0.6.0 • Published 3 years ago
utils-es v0.6.0
utils-es
javascript util functions with ES syntax
Table of Contents
Usage
npm install utils-es
# or
yarn add utils-es
- formatter
thousandsSeparatorFormat(n)
- @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
## - url
> ### getQueryString(queryKey, searchString)
* @method getQueryString
* @param queryString {String}
* @param searchString {String}
* @return {String}
```js
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"
paramsToQueryString(params)
- transform params object to query string
- @param {Object} params
- @return { String } query string
paramsToQueryString({ name: 'tom', age: 16 }); // return name=tom&age=16
- string
changePosition(souce, startPosition, length, targetPosition)
- @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 changed
## - dom
> createElement(tagName, attrs)
* create dom element
* @param {String} tagName dom tag name
* @param {Object} attrs dom attributes
* @return { DomElement} dom element
```js
import { createElement } from "utils-es/dom";
const link = createElement("a", {
class: "link",
href: "https://www.google.com",
target: "_blank",
innerText: "Google"
}); // return HTMLElement
removeElement(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"]);
- event
- queue
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);
- safe
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, "'")
## - transform
> data2Set(source)
* data2Set transform data to Set Object
* @param {Any} data
* @return {Set | Any} Set object or source data
```js
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}
- lang
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 true
For Commonjs module
Use 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");