🔥 An elegant way to parse and manipulate query-params in javascript. 🔥

npm install --save qps-utils or yarn add qps-utils

Try it out here:

import qpsUtils from 'qps-utils';

const params = {
  'id': '341',
  'name': 'john',
  'color': 'purple'
};

const url = qpsUtils.construct(params);

console.log(url); //prints: 'id=341&name=john&color=purple'

const params = {
  'id': '341',
  'name': 'john',
  'color': 'purple'
};

const url = qpsUtils.baseUrl('https://example.com')
                .construct(params);

console.log(url);
//prints: 'https://example.com?id=341&name=john&color=purple'

const url = qpsUtils
  .add('mode', 'production')
  .add('version', '1.0.0')
  .construct();

console.log(url);
//prints: 'mode=production&version=1.0.0'

const url = qpsUtils
  .baseUrl('https://www.example.com')
  .add('mode', 'production')
  .add('version', '1')
  .add('public', 'yes')
  .construct();

console.log(url);
//prints: 'https://www.example.com?mode=production&version=1&public=yes'

const url =
  'https://example.com?mode=production&version=1&public=true';

const params = qpsUtils.parse(url)
                .params().map();

console.log(params);
// { 'mode': 'production', 'version': '1', 'public': true }

const url =
  'https://example.com?mode=production&version=1&public=true';

const isPublic = qpsUtils.parse(url)
                .params().get('public');

console.log(isPublic);
// prints: true

const url =
  'https://example.com?mode=production&version=1&public=true';

const updatedUrl = qpsUtils.parse(url)
                    .params()
                    .add('license', 'MIT')
                    .add('stars', 0)
                    .construct();

console.log(updatedUrl);
// prints: https://example.com?mode=production&version=1&public=true&license=MIT&stars=0

Note: If any existing key present, calling add() function updates that existing key's value

const url =
  'https://example.com?mode=production&version=1&public=true';

const updatedUrl = qpsUtils.parse(url)
                    .params()
                    .add('license', 'MIT')
                    .add('stars', 0)
                    .remove('mode')
                    .remove('version')
                    .construct();

console.log(updatedUrl);
// prints: https://example.com?&public=true&license=MIT&stars=0

const url =
  'https://example.com?mode=production&version=1&public=true';

const updatedUrl = qpsUtils.parse(url)
                    .params()
                    .add('license', 'MIT')
                    .add('stars', 0)
                    .remove('mode')
                    .remove('version')
                    .changeBaseUrl('https://qps-utils.github.io')
                    .construct();

console.log(updatedUrl);
// prints: https://qps-utils.github.io?&public=true&license=MIT&stars=0

An object that exposes these functions: add(), baseUrl(), construct(), parse()

Internally maintains the url by adding the key & value in this format: "key=value" and returns a handle. Subsequent calls to this method appends key & value to the url string.

{string} key, {string} value - (required)

{object} handle - Exposes two functions add(), construct()

Sets the baseUrl and returns a handle. Using that handle's add method, query parameters can be appended and with construct method, the complete url can be obtained.

{string} : baseUrl - (required) A string that represents the endpoint/baseUrl.

{object} handle - Exposes two functions add(), construct()

Constructs the query param url from the given javascript object.

{object} : paramsObject - (optional) An object with keys & values with which the url is formed.

{string} : url - representing query params.

Reads the given url and internally constructs a map of its query parameters, if any available.

{string} : url - (required) Url with query parameters that needs to be manipulated

{object} : handle - Exposes two functions: baseUrl(), params()

Returns the base URL string in the input that is passed to the parse() function.

None

{string} : baseUrl - substring of the url string from the beginning till the point where '?' is found.

Returns a handle that allows manipulation of the url which was passed to parse() function.

None

{object} : handle - Exposes these functions: map(), get(), add(), remove(), changeBaseUrl(), construct()

Returns an object that represents the query parameters in the url string given to parse() function

None

{object} : queryParams - Javascript object which the keys & values represent the keys & values in the url query parameters

Returns a string which is the value for the given key as per the input url.

{string}: key - A string that represents the key as query params in the url.

{string} : value - A string that represents the value for the given key in the input url. If key not present, returns the empty string.

Adds the new pair of query params to the map maintained internally. If the key was already present, it replaces the old value with the new value passed.

{string} key, {string} value - (required)

{object} : handle - which exposes the same set of functions like the one returned by params() function: map(), get(), add(), remove(), changeBaseUrl(), construct()

Removes the key, value pair from the map maintained internally.

{string} key, {string} value - (required)

{object} : handle - which exposes the same set of functions like the one returned by params() function
map(), get(), add(), remove(), changeBaseUrl(), construct()

Updates the baseUrl with the new one.

{string} newUrl - (required)

{object} : handle - which exposes the same set of functions like the one returned by params() function:
map(), get(), add(), remove(), changeBaseUrl(), construct()

Thanks goes to these wonderful people (emoji key):

bautistaaa 🚇 ⚠️ 💻

Tiago Santos Da Silva 💻

Jihoon Yang 💻

This project follows the all-contributors specification. Contributions of any kind welcome!