这是对 github 上 30s代码片断的翻译整理,因为做者的文档是经过脚本生成的,也就懒得去提pull了,整理了放到博客上供你们学习参考,后续会持续跟进翻译。
使用 Array.concat()
来链接参数中的任何数组或值。html
const arrayConcat = (arr, ...args) => arr.concat(...args); // arrayConcat([1], 2, [3], [[4]]) -> [1,2,3,[4]]
以 b
建立 Set
,而后使用 Array.filter()
过滤,只保留 b
中不包含的值。node
const difference = (a, b) => { const s = new Set(b); return a.filter(x => !s.has(x)); }; // difference([1,2,3], [1,2]) -> [3]
以 b
建立 Set
,而后使用 Array.filter()
过滤,只保留 b
中包含的值。git
const intersection = (a, b) => { const s = new Set(b); return a.filter(x => s.has(x)); }; // intersection([1,2,3], [4,3,2]) -> [2,3]
用 a
和 b
的全部值建立一个 Set
并转换成一个数组。github
const union = (a, b) => Array.from(new Set([...a, ...b])); // union([1,2,3], [4,3,2]) -> [1,2,3,4]
使用 Array.reduce()
将每一个值添加到一个累加器,用值 0
初始化,除以数组的长度。正则表达式
const average = arr => arr.reduce((acc, val) => acc + val, 0) / arr.length; // average([1,2,3]) -> 2
使用 Array.from()
建立一个知足块的数量的新的数组。
使用 Array.slice()
将新数组的每一个元素映射到 size
长度的块。
若是原始数组不能均匀分割,最后的块将包含剩余的元素。算法
const chunk = (arr, size) => Array.from({length: Math.ceil(arr.length / size)}, (v, i) => arr.slice(i * size, i * size + size)); // chunk([1,2,3,4,5], 2) -> [[1,2],[3,4],5]
使用 Array.filter()
去过滤掉假值(false
, null
, 0
, ""
, undefined
和 NaN
)。express
const compact = (arr) => arr.filter(v => v); // compact([0, 1, false, 2, '', 3, 'a', 'e'*23, NaN, 's', 34]) -> [ 1, 2, 3, 'a', 's', 34 ]
使用 Array.reduce()
去迭代数组,当值相同时,递增计数器。api
const countOccurrences = (arr, value) => arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0); // countOccurrences([1,1,2,1,2,3], 1) -> 3
使用递归。
使用 Array.reduce()
获取全部不是数组的值,并将数组展开。数组
const deepFlatten = arr => arr.reduce((a, v) => a.concat(Array.isArray(v) ? deepFlatten(v) : v), []); // deepFlatten([1,[2],[[3],4],5]) -> [1,2,3,4,5]
循环访问数组,使用 Array.shift()
删除数组的第一个元素,直到函数的返回值为 true
,返回其他的元素。promise
const dropElements = (arr, func) => { while (arr.length > 0 && !func(arr[0])) arr.shift(); return arr; }; // dropElements([1, 2, 3, 4], n => n >= 3) -> [3,4]
使用 Array.map()
将 start
(包含)和 end
(不包含)之间的值映射为 value
。
省略 start
将从第一个元素开始/省略 end
将在数组最后结束。
const fillArray = (arr, value, start = 0, end = arr.length) => arr.map((v, i) => i >= start && i < end ? value : v); // fillArray([1,2,3,4],'8',1,3) -> [1,'8','8',4]
使用 Array.filter()
保证数组仅包含惟一值。
const filterNonUnique = arr => arr.filter(i => arr.indexOf(i) === arr.lastIndexOf(i)); // filterNonUnique([1,2,2,3,4,4,5]) -> [1,3,5]
使用递归去递减深度。
使用 Array.reduce()
和 Array.concat()
来合并元素或数组。
基本状况下,当深度为 1
时中止递归。
省略第二个参数,展开深度为 1
。
const flattenDepth = (arr, depth = 1) => depth != 1 ? arr.reduce((a, v) => a.concat(Array.isArray(v) ? flattenDepth(v, depth - 1) : v), []) : arr.reduce((a, v) => a.concat(v), []); // flattenDepth([1,[2],[[[3],4],5]], 2) -> [1,2,[3],4,5]
使用 Array.reduce()
来获取内部全部元素并用 concat()
合并它们。
const flatten = arr => arr.reduce((a, v) => a.concat(v), []); // flatten([1,[2],3,4]) -> [1,2,3,4]
使用 Math.max()
配合 ...
扩展运算符去获取数组中的最大值。
const arrayMax = arr => Math.max(...arr); // arrayMax([10, 1, 5]) -> 10
使用 Math.max()
配合 ...
扩展运算符去获取数组中的最小值。
const arrayMin = arr => Math.min(...arr); // arrayMin([10, 1, 5]) -> 1
使用 Array.map()
将数组的值映射到函数或属性名称。
使用 Array.reduce()
建立一个对象,其中的键是从映射的结果中产生的。
const groupBy = (arr, func) => arr.map(typeof func === 'function' ? func : val => val[func]) .reduce((acc, val, i) => { acc[val] = (acc[val] || []).concat(arr[i]); return acc; }, {}); // groupBy([6.1, 4.2, 6.3], Math.floor) -> {4: [4.2], 6: [6.1, 6.3]} // groupBy(['one', 'two', 'three'], 'length') -> {3: ['one', 'two'], 5: ['three']}
使用 arr[0]
返回传递数组的第一个元素。
const head = arr => arr[0]; // head([1,2,3]) -> 1
使用 arr,slice(0, -1)
去返回去除最后一个元素的数组。
const initial = arr => arr.slice(0, -1); // initial([1,2,3]) -> [1,2]
使用 Array(end-start)
建立一个所需长度的数组,使用 Array.map()
来填充范围中的所需值。
你能够省略start
,默认值为 0
。
const initializeArrayRange = (end, start = 0) => Array.apply(null, Array(end - start)).map((v, i) => i + start); // initializeArrayRange(5) -> [0,1,2,3,4]
使用 Array(n)
建立一个所需长度的数组,使用 fill(v)
去填充所须要的值。
亦能够省略 value
,默认值为 0
。
const initializeArray = (n, value = 0) => Array(n).fill(value); // initializeArray(5, 2) -> [2,2,2,2,2]
使用 arr.slice(-1)[0]
得到给定数组的最后一个元素。
const last = arr => arr.slice(-1)[0]; // last([1,2,3]) -> 3
找到数组的中间,使用 Array.sort()
对值进行排序。
若是长度是奇数,则返回中点处的数字,不然返回两个中间数字的平均值。
const median = arr => { const mid = Math.floor(arr.length / 2), nums = arr.sort((a, b) => a - b); return arr.length % 2 !== 0 ? nums[mid] : (nums[mid - 1] + nums[mid]) / 2; }; // median([5,6,50,1,-5]) -> 5 // median([0,10,-2,7]) -> 3.5
使用 Array.slice()
获得一个包含第一个元素的数组。
若是索引超出范围,则返回 []
。(译者注:超过索引返回 undefind
)
省略第二个参数 n
来获取数组的第一个元素。
const nth = (arr, n=0) => (n>0? arr.slice(n,n+1) : arr.slice(n))[0]; // nth(['a','b','c'],1) -> 'b' // nth(['a','b','b']-2) -> 'a'
使用 Array.reduce()
去过滤/挑选存在于 obj 中的 key 值,并转换回相应的键值对的对象。
const pick = (obj, arr) => arr.reduce((acc, curr) => (curr in obj && (acc[curr] = obj[curr]), acc), {}); // pick({ 'a': 1, 'b': '2', 'c': 3 }, ['a', 'c']) -> { 'a': 1, 'c': 3 } // pick(object, ['a', 'c'])['a'] -> 1
使用 Array.sort()
在比较器中使用 Math.random()
从新排序元素。
const shuffle = arr => arr.sort(() => Math.random() - 0.5); // shuffle([1,2,3]) -> [2,3,1]
使用 filter()
移除不是 values
的一部分的值,使用 includes()
肯定。
const similarity = (arr, values) => arr.filter(v => values.includes(v)); // similarity([1,2,3], [1,2,4]) -> [1,2]
使用 Array.reduce()
去迭代值并计算累计器,初始值为 0
。
const sum = arr => arr.reduce((acc, val) => acc + val, 0); // sum([1,2,3,4]) -> 10
若是数组的长度大于1,则返回 arr.slice(1)
,不然返回整个数组。
const tail = arr => arr.length > 1 ? arr.slice(1) : arr; // tail([1,2,3]) -> [2,3] // tail([1]) -> [1]
使用 Array.slice()
从头开始建立 n
个元素的数组。
const take = (arr, n = 1) => arr.slice(0, n); // take([1, 2, 3], 5) -> [1, 2, 3] // take([1, 2, 3], 0) -> []
使用ES6 Set
和 ...rest
运算符去除全部重复的值。
const unique = arr => [...new Set(arr)]; // unique([1,2,2,3,4,4,5]) -> [1,2,3,4,5]
使用 scrollY
,scrollHeight
和 clientHeight
来肯定页面的底部是否可见。
const bottomVisible = _ => document.documentElement.clientHeight + window.scrollY >= (document.documentElement.scrollHeight || document.documentElement.clientHeight); // bottomVisible() -> true
使用 window.location.href
来获取当前连接地址。
const currentUrl = _ => window.location.href; // currentUrl() -> 'https://google.com'
使用 Element.getBoundingClientRect()
和 window.inner(Width|Height)
值来肯定给定的元素在视口中是否可见。
第二个参数用来指定元素是否要求彻底可见,指定 true
即部分可见,默认为所有可见。
const elementIsVisibleInViewport = (el, partiallyVisible = false) => { const { top, left, bottom, right } = el.getBoundingClientRect(); return partiallyVisible ? ((top > 0 && top < innerHeight) || (bottom > 0 && bottom < innerHeight)) && ((left > 0 && left < innerWidth) || (right > 0 && right < innerWidth)) : top >= 0 && left >= 0 && bottom <= innerHeight && right <= innerWidth; }; // e.g. 100x100 viewport and a 10x10px element at position {top: -1, left: 0, bottom: 9, right: 10} // elementIsVisibleInViewport(el) -> false (not fully visible) // elementIsVisibleInViewport(el, true) -> true (partially visible)
若是存在,使用 pageXOffset
和 pageYOffset
,不然使用 scrollLeft
和 scrollTop
。
你能够省略 el
,默认使用 window
。
const getScrollPos = (el = window) => ({x: (el.pageXOffset !== undefined) ? el.pageXOffset : el.scrollLeft, y: (el.pageYOffset !== undefined) ? el.pageYOffset : el.scrollTop}); // getScrollPos() -> {x: 0, y: 200}
使用 window.location.href
或者 window.location.replace()
去重定向到 url
。
第二个参数用来控制模拟连接点击(true
- 默认)仍是 HTTP 重定向(false
)。
const redirect = (url, asLink = true) => asLink ? window.location.href = url : window.location.replace(url); // redirect('https://google.com')
使用 document.documentElement.scrollTop
或 document.body.scrollTop
获取到顶端的距离。
从顶部滚动一小部分距离。 使用 window.requestAnimationFrame()
实现滚动动画。
const scrollToTop = _ => { const c = document.documentElement.scrollTop || document.body.scrollTop; if (c > 0) { window.requestAnimationFrame(scrollToTop); window.scrollTo(0, c - c / 8); } }; // scrollToTop()
计算两个 Date
对象之间的差距(以天为单位)。
const getDaysDiffBetweenDates = (dateInitial, dateFinal) => (dateFinal - dateInitial) / (1000 * 3600 * 24); // getDaysDiffBetweenDates(new Date("2017-12-13"), new Date("2017-12-22")) -> 9
循环遍历包含异步事件的函数数组,当每一个异步事件完成时调用 next
。
const chainAsync = fns => { let curr = 0; const next = () => fns[curr++](next); next(); }; /* chainAsync([ next => { console.log('0 seconds'); setTimeout(next, 1000); }, next => { console.log('1 second'); setTimeout(next, 1000); }, next => { console.log('2 seconds'); } ]) */
使用递归。
若是提供的参数(args
)的数量足够,则调用传递的函数 fn
,不然返回一个柯里化函数 fn
,等待传入剩下的参数。
若是你想要一个接受参数数量可变的函数(一个可变参数函数,例如Math.min()
),你能够选择将参数个数传递给第二个参数 arity
。
const curry = (fn, arity = fn.length, ...args) => arity <= args.length ? fn(...args) : curry.bind(null, fn, arity, ...args); // curry(Math.pow)(2)(10) -> 1024 // curry(Math.min, 3)(10)(50)(2) -> 2
使用 Array.reduce()
让值在函数间流通。
const pipe = (...funcs) => arg => funcs.reduce((acc, func) => func(acc), arg); // pipe(btoa, x => x.toUpperCase())("Test") -> "VGVZDA=="
使用 currying 返回一个函数,返回一个调用原始函数的 Promise
。
使用 ...rest
运算符传入全部参数。
In Node 8+, you can use util.promisify
Node 8 版本以上,你可使用 util.promisify
const promisify = func => (...args) => new Promise((resolve, reject) => func(...args, (err, result) => err ? reject(err) : resolve(result)) ); // const delay = promisify((d, cb) => setTimeout(cb, d)) // delay(2000).then(() => console.log('Hi!')) -> Promise resolves after 2s
使用 Array.reduce()
经过建立一个 promise 链来运行一系列 promise,每一个 promise 在解析时返回下一个 promise。
const series = ps => ps.reduce((p, next) => p.then(next), Promise.resolve()); // const delay = (d) => new Promise(r => setTimeout(r, d)) // series([() => delay(1000), () => delay(2000)]) -> executes each promise sequentially, taking a total of 3 seconds to complete
经过返回一个 Promise
延迟执行 async
函数,把它放到睡眠状态。
const sleep = ms => new Promise(resolve => setTimeout(resolve, ms)); /* async function sleepyWork() { console.log('I\'m going to sleep for 1 second.'); await sleep(1000); console.log('I woke up after 1 second.'); } */
若是 n
是偶数,返回 n/2
,不然返回 3n+1
。
const collatz = n => (n % 2 == 0) ? (n / 2) : (3 * n + 1); // collatz(8) --> 4 // collatz(5) --> 16
使用 Matg.hypot()
来计算两点间的欧式距离。
const distance = (x0, y0, x1, y1) => Math.hypot(x1 - x0, y1 - y0); // distance(1,1, 2,3) -> 2.23606797749979
使用模运算符(%
)来检查余数是否等于 0
。
const isDivisible = (dividend, divisor) => dividend % divisor === 0; // isDivisible(6,3) -> true
使用模运算符(%
)来计算一个数为偶数仍是奇数。
返回 true
为偶数,返回 false
则为奇数。
const isEven = num => num % 2 === 0; // isEven(3) -> false
使用递归。
若是 n
小于或等于 1
,返回 1
。
其它状况,则返回 n
和 n-1
的阶乘的积。
const factorial = n => n <= 1 ? 1 : n * factorial(n - 1); // factorial(6) -> 720
建立一个指定长度的空数组,初始化前两个值(0
和1
)。
使用 Array.reduce()
将最后两个值的总和添加到数组中(前两个除外)。
const fibonacci = n => Array(n).fill(0).reduce((acc, val, i) => acc.concat(i > 1 ? acc[i - 1] + acc[i - 2] : i), []); // fibonacci(5) -> [0,1,1,2,3]
使用递归。
基本状况是若是 y
等于 0
,则返回 x
。
其它状况下,返回 y
与 x/y
的最大公约数。
const gcd = (x, y) => !y ? x : gcd(y, x % y); // gcd (8, 36) -> 4
使用 异或 运算符(^
)去查找两个数值间的位差,使用 toString(2)
转换为二进制值,使用 match(/1/g)
计算并返回字符串中 1
的数量。
const hammingDistance = (num1, num2) => ((num1 ^ num2).toString(2).match(/1/g) || '').length; // hammingDistance(2,3) -> 1
使用百分比公式计算给定数组中有多少个数小于或等于给定值。
使用Array.reduce()计算值的下面有多少个数是相同的值, 并应用百分比公式。
const percentile = (arr, val) => 100 * arr.reduce((acc,v) => acc + (v < val ? 1 : 0) + (v === val ? 0.5 : 0), 0) / arr.length; // percentile([1,2,3,4,5,6,7,8,9,10], 6) -> 55
使用 Array.reduce()
与 Array.map()
结合来迭代元素并将其组合成一个包含全部组合的数组。
const powerset = arr => arr.reduce((a, v) => a.concat(a.map(r => [v].concat(r))), [[]]); // powerset([1,2]) -> [[], [1], [2], [2,1]]
使用 Math.round()
和字符串模板将数字四舍五入到指定的位数。
省略第二个参数,decimals
将四舍五入到一个整数。
const round = (n, decimals=0) => Number(`${Math.round(`${n}e${decimals}`)}e-${decimals}`); // round(1.005, 2) -> 1.01
Use Array.reduce()
to calculate the mean, variance and the sum of the variance of the values, the variance of the values, then
determine the standard deviation.
You can omit the second argument to get the sample standard deviation or set it to true
to get the population standard deviation.
使用 Array.reduce()
来计算平均值,方差以及方差之和,而后肯定标准误差。
您能够省略第二个参数来获取样本标准差或将其设置为 true
以得到整体标准差。
const standardDeviation = (arr, usePopulation = false) => { const mean = arr.reduce((acc, val) => acc + val, 0) / arr.length; return Math.sqrt( arr.reduce((acc, val) => acc.concat(Math.pow(val - mean, 2)), []) .reduce((acc, val) => acc + val, 0) / (arr.length - (usePopulation ? 0 : 1)) ); }; // standardDeviation([10,2,38,23,38,23,21]) -> 13.284434142114991 (sample) // standardDeviation([10,2,38,23,38,23,21], true) -> 12.29899614287479 (population)
使用 SpeechSynthesisUtterance.voice
和 indow.speechSynthesis.getVoices()
将消息转换为语音。
使用 window.speechSynthesis.speak()
来播放消息。
了解更多关于 SpeechSynthesisUtterance interface of the Web Speech API.
const speak = message => { const msg = new SpeechSynthesisUtterance(message); msg.voice = window.speechSynthesis.getVoices()[0]; window.speechSynthesis.speak(msg); }; // speak('Hello, World') -> plays the message
使用 Array.reduce()
建立和组合键值对。
const objectFromPairs = arr => arr.reduce((a, v) => (a[v[0]] = v[1], a), {}); // objectFromPairs([['a',1],['b',2]]) -> {a: 1, b: 2}
使用 Object.keys()
和 Array.map()
去遍历对象的键并生成一个包含键值对的数组。
const objectToPairs = obj => Object.keys(obj).map(k => [k, obj[k]]); // objectToPairs({a: 1, b: 2}) -> [['a',1],['b',2]])
使用 ...spread
扩展运算符将目标对象的属性添加到拷贝对象中。
const shallowClone = obj => ({ ...obj }); /* const a = { x: true, y: 1 }; const b = shallowClone(a); a === b -> false */
使用递归。
遍历给定字符串中的每一个字母,用其他字母建立全部部分字母。
使用 Array.map()
将字母与每一个部分字母组合,而后使用 Array.reduce()
将全部字母组合到一个数组中。
当给定字符串数量等与 2
或 1
时作简单处理。=
const anagrams = str => { if (str.length <= 2) return str.length === 2 ? [str, str[1] + str[0]] : [str]; return str.split('').reduce((acc, letter, i) => acc.concat(anagrams(str.slice(0, i) + str.slice(i + 1)).map(val => letter + val)), []); }; // anagrams('abc') -> ['abc','acb','bac','bca','cab','cba']
使用 replace()
去查找单词的第一个字母并使用 toUpperCase()
改成大写。
const capitalizeEveryWord = str => str.replace(/\b[a-z]/g, char => char.toUpperCase()); // capitalizeEveryWord('hello world!') -> 'Hello World!'
使用 slice(0,1)
和 toUpperCase()
将首字母大写,使用 slice(1)
获得字符串的其他部分。
忽略 lowerRest
参数以保持字符串的其他部分不变,或者将其设置为 true
以转换为小写字母。
const capitalize = (str, lowerRest = false) => str.slice(0, 1).toUpperCase() + (lowerRest ? str.slice(1).toLowerCase() : str.slice(1)); // capitalize('myName', true) -> 'Myname'
使用 toLowerCase()
转换字符串并用 replace()
删除其中的非字母数字字符。
而后,使用 split('')
分散为单个字符,再使用 reverse()
和 join('')
倒序合并后与原字符进行比较。
const palindrome = str => { const s = str.toLowerCase().replace(/[\W_]/g,''); return s === s.split('').reverse().join(''); } // palindrome('taco cat') -> true
使用数组解构和 Array.reverse()
来反转字符串中字符的顺序。
使用 join('')
组合字符得到一个字符串。
const reverseString = str => [...str].reverse().join(''); // reverseString('foobar') -> 'raboof'
使用 split('')
切割字符串,使用 Array.sort
经过 localeCompare()
去排序,再使用 join('')
组合。
const sortCharactersInString = str => str.split('').sort((a, b) => a.localeCompare(b)).join(''); // sortCharactersInString('cabbage') -> 'aabbceg'
肯定字符串的长度是否大于 num
。
将字符串截断为所需的长度,在末尾或原始字符串后附加 ...
。
const truncate = (str, num) => str.length > num ? str.slice(0, num > 3 ? num - 3 : num) + '...' : str; // truncate('boomerang', 7) -> 'boom...'
使用 replace()
去转义特殊字符。
const escapeRegExp = str => str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // escapeRegExp('(test)') -> \\(test\\)
返回值的构造函数名称的小写字符,值为 undefined
或 null
时则返回 undefined
或 null
。
const getType = v => v === undefined ? 'undefined' : v === null ? 'null' : v.constructor.name.toLowerCase(); // getType(new Set([1,2,3])) -> "set"
使用 Array.isArray()
去检查值是否为数组。
const isArray = val => !!val && Array.isArray(val); // isArray(null) -> false // isArray([1]) -> true
使用 typeof
去检查值是否为原始布尔值类型。
const isBoolean = val => typeof val === 'boolean'; // isBoolean(null) -> false // isBoolean(false) -> true
使用 typeof
去检查值是否为函数原始类型。
const isFunction = val => val && typeof val === 'function'; // isFunction('x') -> false // isFunction(x => x) -> true
使用 typeof
去检查值是否为数值原始类型。
const isNumber = val => typeof val === 'number'; // isNumber('1') -> false // isNumber(1) -> true
使用 typeof
去检查值是否为字符串原始类型。
const isString = val => typeof val === 'string'; // isString(10) -> false // isString('10') -> true
使用 typeof
去检查值是否为 symbol 原始类型。
const isSymbol = val => typeof val === 'symbol'; // isSymbol('x') -> false // isSymbol(Symbol('x')) -> true
使用 console.time()
和 console.timeEnd()
来测量开始和结束时间之间的差别,以肯定回调执行的时间。
const timeTaken = callback => { console.time('timeTaken'); const r = callback(); console.timeEnd('timeTaken'); return r; }; // timeTaken(() => Math.pow(2, 10)) -> 1024 // (logged): timeTaken: 0.02099609375ms
将数值转换为字符串,使用 split()
分割为数组。
再使用 Array.map()
和 parseInt()
将每一个值转换为整数。
const digitize = n => (''+n).split('').map(i => parseInt(i)); // digitize(2334) -> [2, 3, 3, 4]
Use the modulo operator (%
) to find values of single and tens digits.
Find which ordinal pattern digits match.
If digit is found in teens pattern, use teens ordinal.
使用模运算符(%
)来查找单位数和十位数的值。
查找数字匹配哪些序号模式。
若是数字在十几的模式中找到,请使用的十几的序数。
const toOrdinalSuffix = num => { const int = parseInt(num), digits = [(int % 10), (int % 100)], ordinals = ['st', 'nd', 'rd', 'th'], oPattern = [1, 2, 3, 4], tPattern = [11, 12, 13, 14, 15, 16, 17, 18, 19]; return oPattern.includes(digits[0]) && !tPattern.includes(digits[1]) ? int + ordinals[digits[0] - 1] : int + ordinals[3]; }; // toOrdinalSuffix("123") -> "123rd"
使用 Math.random()
去生成一个在指定范围内的随机数,使用 Math.floor()
将其转换为整数。
const randomIntegerInRange = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min; // randomIntegerInRange(0, 5) -> 2
使用 Math.random()
去生成一个在指定范围内的随机数。
const randomInRange = (min, max) => Math.random() * (max - min) + min; // randomInRange(2,10) -> 6.0211363285087005
使用按位左移运算符(<<
)和 toString(16)
将 RGB 参数转换为十六进制,而后使用 padStart(6, '0')
去获取6位数的十六进制。
const rgbToHex = (r, g, b) => ((r << 16) + (g << 8) + b).toString(16).padStart(6, '0'); // rgbToHex(255, 165, 1) -> 'ffa501'
使用数组解构来交换两个变量之间的值。
[varA, varB] = [varB, varA]; // [x, y] = [y, x]
使用 match()
和一个合适的正则去获取全部键值对,使用 Array.reduce()
合并到一个对象中。
容许将 location.search
做为参数传递。
const getUrlParameters = url => url.match(/([^?=&]+)(=([^&]*))/g).reduce( (a, v) => (a[v.slice(0, v.indexOf('='))] = v.slice(v.indexOf('=') + 1), a), {} ); // getUrlParameters('http://url.com/page?name=Adam&surname=Smith') -> {name: 'Adam', surname: 'Smith'}
使用 crypto
API 生成符合 RFC4122 版本4的UUID。
const uuid = _ => ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c => (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16) ); // uuid() -> '7982fcfe-5721-4632-bede-6000885be57d'
Use a regular experssion to check if the email is valid.
Returns true
if email is valid, false
if not.
使用正则表达式去检验邮箱格式。
返回 true
表示邮箱格式正确,false
则不正确。
const validateEmail = str => /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(str); // validateEmail(mymail@gmail.com) -> true
使用 !isNaN
和 parseFloat()
来检查参数是不是一个数字(或容许转换为数值)。
使用 isFinite()
来检查数字是不是有限的。
使用 Number() 来检查数值转换是否成立。
const validateNumber = n => !isNaN(parseFloat(n)) && isFinite(n) && Number(n) == n; // validateNumber('10') -> true
默认返回 value
若是 value
为假,则返回默认值。
const valueOrDefault = (value, d) => value || d; // valueOrDefault(NaN, 30) -> 30