javascript util functions with ES syntax
- Usage
- - formatter
- - url
- - string
- - dom
- - event
- - queue
- - safe
- - transform
- - lang
- For Commonjs module
npm install utils-es
# or
yarn add utils-es- @description Thousands Separator Formatter
- @param {Number | String} n
- @return { String }
import { thousandsSeparatorFormat } from "utils-es/formatter";
// import formatter from "utils-es/formatter";
// import { formatter } from "utils-es";
const result = thousandsSeparatorFormat(-123456.78);
// const result = formatter.thousandsSeparatorFormat(-123456.78);
// result=> -123,456.78- @method getQueryString
- @param queryString {String}
- @param searchString {String}
- @return {String}
import { getQueryString } from "utils-es/url";
// import url from "utils-es/url";
// import { url } from "utils-es";
const result = getQueryString("key");
// const result = url.getQueryString("key");
// result=> query value for key
const result = getQueryString("key", "https://localhost/?key=value");
// result => "value"- transform params object to query string
- @param {Object} params
- @return { String } query string
paramsToQueryString({
name: 'tom',
age: 16
}); // return name=tom&age=16- @description move a part from string to another position
- @param {String | Number} source source content
- @param {Integer} startPosition move start position
- @param {Integer} length move length
- @param {Integer} targetPosition target position to put
import { changePosition } from "utils-es/string";
// import string from "utils-es/string";
// import { string } from "utils-es";
const result = changePosition("abcdefg", 0, 2, 7); // return "cdefgab"
// const result = string.changePosition("abcdefg", 0, 2, 7);
// result=> string position changedcreateElement(tagName, attrs)
- create dom element
- @param {String} tagName dom tag name
- @param {Object} attrs dom attributes
- @return { DomElement} dom element
import { createElement } from "utils-es/dom";
const link = createElement("a", {
class: "link",
href: "https://www.google.com",
target: "_blank",
innerText: "Google"
}); // return HTMLElementremoveElement(element)
- remove element
- @param {DomElement} element
import { removeElement } from "utils-es/dom";
removeElement(link);addClass(element, className)
- add new class name
- @param {DomElement} element
- @param {String | Array} className
- @returns {DomElement} element
import { addClass } from "utils-es/dom";
addClass(link, "hover");
addClass(link, "hover active");
addClass(link, ["hover", "active"]);removeClass(element, className)
- remove class name from element
- @param {DomElement} element
- @param {String | Array} className
- @returns {DomElement} element
import { removeClass } from "utils-es/dom";
removeClass(link, "hover");
removeClass(link, "hover active");
removeClass(link, ["hover", "active"]);debounce(func, wait, immediate)
- @param {Function} func
- @param {Integer} wait debounce wait time in milliseconds
- @param {Boolean} immediate
- @returns {Function} new Function
import { debounce } from "utils-es/queue";
const newFunc = debounce(oldFunc);xssFilter(source)
- xss filter
- @param {String} source source content
- @returns {String} html safe content
import { xssFilter } from "utils-es/safe";
const safeInnerHTML = xssFilter(originalHTMLString));
// replace all script tag to <script>htmlSafe(source)
- html source safe encode
- @param {String} source raw html content
- @returns safe html
import { htmlSafe } from "utils-es/safe";
const safeInnerHTML = htmlSafe(originalHTMLString));
// html safe encode will replace below characters
// replace(/&/g, "&")
// replace(/>/g, ">")
// replace(/</g, "<")
// replace(/"/g, """)
// replace(/'/g, "'")data2Set(source)
- data2Set transform data to Set Object
- @param {Any} data
- @return {Set | Any} Set object or source data
import { data2Set } from "utils-es/transform";
data2Set(); // return Set(0)
data2Set(1); // return Set(1) {1}
data2Set("foo"); // return Set(1) {"foo"}
data2Set([1,2,3]); // return Set(3) {1,2,3}isType(source, type)
- check varible type
- @param {Any} source
- @param {String} type
- @return {String | Boolean}
import { isType } from "utils-es/lang";
isType(1); // return "Number"
isType(1, "Number"); // return trueUse modules in utils-es/dist
files in dist folder are umd modules
const utils = require("utils-es/dist");
const formatter = require("utils-es/dist/formatter");
const { getQueryString } = require("utils-es/dist/url");