helper-js
Advanced tools
js functions, just import needed functions. TypeScript supported.
js 方法库, 按需使用. 支持TypeScript
npm install helper-js --save
import {arrayLast} from 'helper-js'
// or
import * as hp from 'helper-js'
hp.arrayLast(...)
get global, such as window in browser.
返回顶级全局变量. 例如浏览器的window
detect if global variable document existing.
判断全局变量document是否存在
detect if argumrnt is null, undefined, empty array, empty string, false, NaN, empty object
检查是否是null, undefined, 空数组, 空字符串, false, NaN, 空对象
rand int in range, including min and max
返回指定范围随机整数, 包括范围起始值和终止值
rand item in array
返回数组随机一项
Pad a string to a certain length with another string
左边补充指定字符, 使其达到指定长度
If n less than min, return min, else n.
如果n小于min, 返回min, 否则n.
If n greater than max, return max, else n.
如果n大于max, 返回max, 否则n.
'abc abc' to 'Abc abc'
To lower case and use - as delimiter. example: '-ABC abc_def camelCase-- helloMyFriend' to 'a-b-c-abc-def-camel-case-hello-my-friend'
To lower case and use _ as delimiter.
'abc-abc-abc_abc' to 'AbcAbcAbcAbc'
'AbcAbcAbcAbc' to ['Abc', 'Abc', 'Abc', 'Abc']
'abcAbc' to 'Abc Abc'
generate random string
随机字符串
remove item from array. return removed count
从数组删除项. 返回删除计数
remove items from array by sorted indexes. indexes example: [0, 2, 6, 8, 9]
通过有序的索引集删除数组项. 索引集例子: [0, 2, 6, 8, 9]
return new array excluding indexes
返回新数组除了给定索引
get item from array by index. index can be negative number
通过所以获取数组一项. 支持负值索引.
get first or array
返回数组首项
get last of array
返回数组末项
return arr1 - arr2
get array item sibling. Example: getArrayItemSibling(arr, item, -1), get previous sibling
获得数组项的一个同级. 例: getArrayItemSibling(arr, item, -1), 获得前一个
get array item siblings. Example: getArrayItemSiblings(arr, item, [-1, 1]), get previous and next sibling
获得数组项的多个同级. 例: getArrayItemSiblings(arr, item, [-1, 1]), 获得前一个和后一个
Split array every n. n can be getter, which argument is the times.
每n个拆分数组. n可以是方法, 参数是第几次分块
Compute mark of each item, and group them by mark.
计算每项的标识, 通过标识将数组项分组.
Each item in the new array is unique.
新数组每项唯一.
get items from array by range. range can be negative
从数组获得一个范围内的项. 范围可以为负.
return new array excluding n items from end
返回新数组排除末尾n项
get one-dimensional array from multidimensional array
从多维数组获取一维数组
like Array.map
loop for Array, Object, NodeList, String
example: objectGet(window, 'document.body.children.0') . source: http://stackoverflow.com/questions/8817394/javascript-get-deep-value-from-object-by-passing-path-to-it-as-string
例: objectGet(window, 'document.body.children.0') . 参考: http://stackoverflow.com/questions/8817394/javascript-get-deep-value-from-object-by-passing-path-to-it-as-string
refer objectGet
try delete obj[prop]
walk object and change key, value, delete key. return cloned new object.
深度遍历对象, 可以改变key, value, 删除key. 返回克隆的新对象.
Arguments:
handler:
return null: don't change anything
return {delete: true}: delete
return {key: newKey}: change key
return {value: newValue}: change value
return {skip: true}: skip children
return {stop: true}: stop
can return delete|((key|value)|(skip|stop))
limit: to prevent circular reference.
[{id: 1}, {id: 2}] to {'1':{id: 1}, '2': {id: 2}}
example: pairRows(users, userProfiles, 'id', 'user_id')
walk tree data by with depth first search. tree data example: [{children: [{}, {}]}]
深度优先遍历树形数据. 树形数据示例: [{children: [{}, {}]}]
refer depthFirstSearch
tree data helpers
if it is function, return result, else return it directly.
add executed count as first argument of func
增加执行次数作为方法的第一个参数
(getVal, handler) => update . when execute update, call getVal and check if changed.
(getVal, handler) => update . 执行update时, 调用getVal并检查结果是否改变.
the returned function only accept one argument
must pass arguments to next manually
execute promise in sequence
return NodeList if there are multiple top-level nodes
refer: https://gist.github.com/aderaaij/89547e34617b95ac29d1
there is some trap in el.offsetParent, so use this func to fix
get el current position. like jQuery.position. The position is relative to offsetParent viewport left top. it is for set absolute position, absolute position is relative to offsetParent viewport left top.
相对于offsetParent可视区域左上角(el.offsetLeft或top包含父元素的滚动距离, 所以要减去). position一般用于设置绝对定位的情况, 而绝对定位就是以可视区域左上角为原点.
like jQuery.offset(x, y), but it just return cmputed position, don't update style
类似 jQuery.offset的设置功能, 但是它只返回计算的position, 不改变元素样式.
refer getBoundingClientRect
TODO not tested
TODO not tested
source: http://youmightnotneedjquery.com/
source: http://youmightnotneedjquery.com/
source: http://youmightnotneedjquery.com/
[isOffsetInEl]
@param {Number} x
@param {Number} y
@param {Object} el HTML Element
get border
scroll to a positon with duration
from https://gist.github.com/andjosh/6764939
interface options{
x: number // nullable. don't scroll horizontally when null
y: number // nullable. don't scroll vertically when null
duration: number // default 0
element: Element // default is the top scrollable element.
beforeEveryFrame: (count: number) => boolean|void // call before requestAnimationFrame execution. return false to stop
}
return stop
day and date is same
startWeekDay: 0 is Sunday
return: [getCalendar_Day x 7][]
eg: 2018-09-07T03:38:37.888Z
timezone must be UTC
timestamp eg: 2018-09-07T03:38:37.888Z
binarySearch
callback(mid, i) return mid - your_value if arr is ascending, else return your_value - mid
二分查找
callback(mid, i) arr升序时, 返回mid - your_value, 否则返回your_value - mid
clipboard-polyfill is more powerful
复制文字到剪贴板. 仅限于简单使用. 复杂环境推荐clipboard-polyfill
https://developer.mozilla.org/docs/Web/API/Window/open
http://www.w3school.com.cn/htmldom/met_win_open.asp#windowfeatures
resolve arguments to help overload. 解析函数参数, 帮助重载
types eg: ['Object', (i) => i > 3, ['Number', default], null ]
null represent all types of argument
resolveArgsByType([1,'str'], ['Number', 'Boolean' ,'String']) -> [1, null, 'str']
resolveArgsByType([1,'str'], ['Number', ['Boolean', true] ,'String']) -> [1, true, 'str']
事件处理
Deprecated in next version
on continuous input. return destroy
监听连续输入事件. 返回取消监听函数.
refer onContinuousInput
attach cached getters to an object; can attach to self
for animation
FAQs
js functions, import on demand. TypeScript supported. [API](https://phphe.github.io/helper-js/)
The npm package helper-js receives a total of 8,182 weekly downloads. As such, helper-js popularity was classified as popular.
We found that helper-js demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.