queryzz.js

queryzz - a library for working with query. Get, set, format your query as you want.

Features

• Full TypeScript support
• Support all platforms
• Easy to use

Table of Contents

• Quick start
  • Install
  • Initialization
• Methods
  • formatQuery
  • getQuery
  • setQuery

Quick start

Install

We support all platforms.

npm

For module bundlers such as Webpack or Browserify.

npm i queryzz

Include with <script>

Download and install with script.

<script src="queryzz.js"></script>

CDN

Recommended for learning purposes, you can use the latest version:

<script src="https://cdn.jsdelivr.net/npm/queryzz/dist/queryzz.js"></script>

Recommended for production for avoiding unexpected breakage from newer versions:

<script src="https://cdn.jsdelivr.net/npm/queryzz@1.0.0/dist/queryzz.js"></script>

Initialization

ES6

queryzz as an ES6 module.

import { getQuery } from 'queryzz';

getQuery();

Node

queryzz as a Node.js module

const { getQuery } = require('queryzz');

getQuery();

Browser

Exports a global variable called queryzz. Use it like this

<script>
  queryzz.getQuery();
</script>

AMD

queryzz as an AMD module. Use with Require.js, System.js, and so on.

requirejs(['queryzz'], function(queryzz) {
  queryzz.getQuery();
});

Methods

formatQuery

Format query object to string.

Params

• query
  • Type: IQuery
  • Description: Query variable to format.
• encode
  • Type: Boolean
  • Description: Need to encode special characters. Default: true.

Returns

• string

Example

const query = { value: 'test', field: ['hi', 'hello'] };
formatQuery(query)
// => value=test&field=hi&field=hello

const query = { value: 'https://google.com' }
formatQuery(query, true)
// => value=https%3A%2F%2Fgoogle.com

const query = { value: 'https://google.com' }
formatQuery(query, false)
// => value=https://google.com

Source code

getQuery

Get query from url.

Params

• options
  • Type: String,Options
  • Description: Can be null and link or query and object with params.
• options.link
  • Type: String
  • Description: Link or query to parse. Default: window.location.search.
• options.arrays
  • Type: Array
  • Description: Fields that must be arrays. Default: [].
• options.parse
  • Type: Boolean
  • Description: Need to parse types. Default: true.

Returns

• Query

Example

// URL: /?value=test&field=hi&field=hello
getQuery()
// => { value: 'test', field: ['hi', 'hello'] }

getQuery('value=test&field=hi&field=hello')
// => { value: 'test', field: ['hi', 'hello'] }

// URL: /?value=test&field=hi
getQuery({ arrays: ['value'] })
// => { value: ['test'], field: 'hi' }

// URL: /?value=test&field=hi&value=123&test=true
getQuery()
// => { value: ['test', 123], field: 'hi', test: true }

getQuery({ link: 'value=test&field=hi&value=123&test=true', parse: false })
// => { value: ['test', '123'], field: 'hi', test: 'true' }

Source code

setQuery

Set query to url.

Params

• query
  • Type: Query
  • Description: Object to parse in url.
• params
  • Type: Object
  • Description: Object with params.
• params.saveOld
  • Type: Boolean
  • Description: Does save old query. Default: false.
• params.saveHash
  • Type: Boolean
  • Description: Does save hash. Default: true.
• params.saveEmpty
  • Type: Boolean
  • Description: Does save empty fields. Default: false.
• params.replaceState
  • Type: Boolean
  • Description: Doesn't save history in browser. Default: false.

Example

setQuery({ test: 'value' })
// => /?test=value

setQuery({ test: ['12', '34'] })
// => /?test=12&test=34

// /?test=value&field=test
setQuery({ test: 'field' }, { saveOld: true })
// => /?test=value&test=field&field=test

// /?test=value#someHash
setQuery({ test: 'value' }, { saveHash: false })
// => /?test=value

Source code

© Valery Strelets