1、all

如果数组所有元素满足函数条件，则返回true。调用时，如果省略第二个参数，则默认传递布尔值。

    const all = (arr, fn = Boolean) => arr.every(fn);
     
    all([4, 2, 3], x => x > 1); // true
    all([1, 2, 3]); // true

2、allEqual

判断数组中的元素是否都相等

    const allEqual = arr => arr.every(val => val === arr[0]);
     
    allEqual([1, 2, 3, 4, 5, 6]); // false
    allEqual([1, 1, 1, 1]); // true

3、approximatelyEqual

此代码示例检查两个数字是否近似相等，差异值可以通过传参的形式进行设置

    const approximatelyEqual = (v1, v2, epsilon = 0.001) => Math.abs(v1 - v2) < epsilon;
     
    approximatelyEqual(Math.PI / 2.0, 1.5708); // true

4、arrayToCSV

此段代码将没有逗号或双引号的元素转换成带有逗号分隔符的字符串即CSV格式识别的形式。

    const arrayToCSV = (arr, delimiter = ',') =>
      arr.map(v => v.map(x => `"${x}"`).join(delimiter)).join('\n');
      
    arrayToCSV([['a', 'b'], ['c', 'd']]); // '"a","b"\n"c","d"'
    arrayToCSV([['a', 'b'], ['c', 'd']], ';'); // '"a";"b"\n"c";"d"'

5、arrayToHtmlList

此段代码将数组元素转换成<li>标记，并将此元素添加至给定的ID元素标记内。

    const arrayToHtmlList = (arr, listID) =>
      (el => (
        (el = document.querySelector('#' + listID)),
        (el.innerHTML += arr.map(item => `<li>${item}</li>`).join(''))
      ))();
      
    arrayToHtmlList(['item 1', 'item 2'], 'myListID');

6、attempt

此段代码执行一个函数，将剩余的参数传回函数当参数，返回相应的结果，并能捕获异常。

    const attempt = (fn, ...args) => {
      try {
        return fn(...args);
      } catch (e) {
        return e instanceof Error ? e : new Error(e);
      }
    };
    var elements = attempt(function(selector) {
      return document.querySelectorAll(selector);
    }, '>_>');
    if (elements instanceof Error) elements = []; // elements = []

7、average

此段代码返回两个或多个数的平均数。

    const average = (...nums) => nums.reduce((acc, val) => acc + val, 0) / nums.length;
    average(...[1, 2, 3]); // 2
    average(1, 2, 3); // 2

8、averageBy

一个 map()函数和 reduce()函数结合的例子，此函数先通过 map() 函数将对象转换成数组，然后在调用reduce()函数进行累加，然后根据数组长度返回平均值。

    const averageBy = (arr, fn) =>
      arr.map(typeof fn === 'function' ? fn : val => val[fn]).reduce((acc, val) => acc + val, 0) /
      arr.length;
      
    averageBy([{ n: 4 }, { n: 2 }, { n: 8 }, { n: 6 }], o => o.n); // 5
    averageBy([{ n: 4 }, { n: 2 }, { n: 8 }, { n: 6 }], 'n'); // 5

9、bifurcate

此函数包含两个参数，类型都为数组，依据第二个参数的真假条件，将一个参数的数组进行分组，条件为真的放入第一个数组，其它的放入第二个数组。这里运用了Array.prototype.reduce() 和 Array.prototype.push() 相结合的形式。

    const bifurcate = (arr, filter) =>
      arr.reduce((acc, val, i) => (acc[filter[i] ? 0 : 1].push(val), acc), [[], []]);
    bifurcate(['beep', 'boop', 'foo', 'bar'], [true, true, false, true]);
    // [ ['beep', 'boop', 'bar'], ['foo'] ]

10、bifurcateBy

此段代码将数组按照指定的函数逻辑进行分组，满足函数条件的逻辑为真，放入第一个数组中，其它不满足的放入第二个数组 。这里运用了Array.prototype.reduce() 和 Array.prototype.push() 相结合的形式，基于函数过滤逻辑，通过 Array.prototype.push() 函数将其添加到数组中。

    const bifurcateBy = (arr, fn) =>
      arr.reduce((acc, val, i) => (acc[fn(val, i) ? 0 : 1].push(val), acc), [[], []]);
      
    bifurcateBy(['beep', 'boop', 'foo', 'bar'], x => x[0] === 'b');
    // [ ['beep', 'boop', 'bar'], ['foo'] ]

11、bottomVisible

用于检测页面是否滚动到页面底部。

    const bottomVisible = () =>
      document.documentElement.clientHeight + window.scrollY >=
      (document.documentElement.scrollHeight || document.documentElement.clientHeight);
     
    bottomVisible(); // true

12、byteSize

此代码返回字符串的字节长度。这里用到了Blob对象，Blob（Binary Large Object）对象代表了一段二进制数据，提供了一系列操作接口。其他操作二进制数据的API（比如File对象），都是建立在Blob对象基础上的，继承了它的属性和方法。生成Blob对象有两种方法：一种是使用Blob构造函数，另一种是对现有的Blob对象使用slice方法切出一部分。

    const byteSize = str => new Blob([str]).size;
     
    byteSize('????'); // 4
    byteSize('Hello World'); // 11

13、capitalize

将字符串的首字母转成大写,这里主要运用到了ES6的展开语法在数组中的运用。

    const capitalize = ([first, ...rest]) =>
      first.toUpperCase() + rest.join('');
      
    capitalize('fooBar'); // 'FooBar'
    capitalize('fooBar', true); // 'FooBar'

14、capitalizeEveryWord

将一个句子中每个单词首字母转换成大写字母，这里中要运用了正则表达式进行替换。

    const capitalizeEveryWord = str => str.replace(/\b[a-z]/g, char => char.toUpperCase());
     
    capitalizeEveryWord('hello world!'); // 'Hello World!'

15、castArray

此段代码将非数值的值转换成数组对象。

    const castArray = val => (Array.isArray(val) ? val : [val]);
     
    castArray('foo'); // ['foo']
    castArray([1]); // [1]

16、compact

将数组中移除值为 false 的内容。

    const compact = arr => arr.filter(Boolean);
     
    compact([0, 1, false, 2, '', 3, 'a', 'e' * 23, NaN, 's', 34]);
    // [ 1, 2, 3, 'a', 's', 34 ]

17、countOccurrences

统计数组中某个值出现的次数

    const countOccurrences = (arr, val) => arr.reduce((a, v) => (v === val ? a + 1 : a), 0);
    countOccurrences([1, 1, 2, 1, 2, 3], 1); // 3

18、Create Directory

此代码段使用 existSync() 检查目录是否存在，然后使用 mkdirSync() 创建目录（如果不存在）。

    const fs = require('fs');
    const createDirIfNotExists = dir => (!fs.existsSync(dir) ? fs.mkdirSync(dir) : undefined);
    createDirIfNotExists('test');
    // creates the directory 'test', if it doesn't exist

19、currentURL

返回当前访问的 URL 地址。

    const currentURL = () => window.location.href;
     
    currentURL(); // 'https://medium.com/@fatosmorina'

20、dayOfYear

返回当前是今年的第几天

    const dayOfYear = date =>
      Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);
     
    dayOfYear(new Date()); // 272

21、decapitalize

将字符串的首字母转换成小写字母

    const decapitalize = ([first, ...rest]) =>
      first.toLowerCase() + rest.join('')
     
    decapitalize('FooBar'); // 'fooBar'
22、deepFlatten

通过递归的形式，将多维数组展平成一维数组。

    const deepFlatten = arr => [].concat(...arr.map(v => (Array.isArray(v) ? deepFlatten(v) : v)));
     
    deepFlatten([1, [2], [[3], 4], 5]); // [1,2,3,4,5]

23、default

去重对象的属性，如果对象中含有重复的属性，以前面的为准。

    const defaults = (obj, ...defs) => Object.assign({}, obj, ...defs.reverse(), obj);
     
    defaults({ a: 1 }, { b: 2 }, { b: 6 }, { a: 3 }); // { a: 1, b: 2 }

24、defer

延迟函数的调用，即异步调用函数。

    const defer = (fn, ...args) => setTimeout(fn, 1, ...args);
     
    defer(console.log, 'a'), console.log('b'); // logs 'b' then 'a'

25、degreesToRads

此段代码将标准的度数，转换成弧度。

    const degreesToRads = deg => (deg * Math.PI) / 180.0;
     
    degreesToRads(90.0); // ~1.5708

26、difference

此段代码查找两个给定数组的差异，查找出前者数组在后者数组中不存在元素。

    const difference = (a, b) => {
      const s = new Set(b);
      return a.filter(x => !s.has(x));
    };
     
    difference([1, 2, 3], [1, 2, 4]); // [3]

27、differenceBy

通过给定的函数来处理需要对比差异的数组，查找出前者数组在后者数组中不存在元素。

    const differenceBy = (a, b, fn) => {
      const s = new Set(b.map(fn));
      return a.filter(x => !s.has(fn(x)));
    };
     
    differenceBy([2.1, 1.2], [2.3, 3.4], Math.floor); // [1.2]
    differenceBy([{ x: 2 }, { x: 1 }], [{ x: 1 }], v => v.x); // [ { x: 2 } ]

28、differenceWith

此段代码按照给定函数逻辑筛选需要对比差异的数组，查找出前者数组在后者数组中不存在元素。

    const differenceWith = (arr, val, comp) => arr.filter(a => val.findIndex(b => comp(a, b)) === -1);
     
    differenceWith([1, 1.2, 1.5, 3, 0], [1.9, 3, 0], (a, b) => Math.round(a) === Math.round(b));
    // [1, 1.2]

29、digitize

将输入的数字拆分成单个数字组成的数组。

    const digitize = n => [...`${n}`].map(i => parseInt(i));
     
    digitize(431); // [4, 3, 1]

30、distance

计算两点之间的距离

    const distance = (x0, y0, x1, y1) => Math.hypot(x1 - x0, y1 - y0);
     
    distance(1, 1, 2, 3); // 2.23606797749979

31、drop

此段代码将给定的数组从左边开始删除 n 个元素

    const drop = (arr, n = 1) => arr.slice(n);
     
    drop([1, 2, 3]); // [2,3]
    drop([1, 2, 3], 2); // [3]
    drop([1, 2, 3], 42); // []

32、dropRight

此段代码将给定的数组从右边开始删除 n 个元素

    const dropRight = (arr, n = 1) => arr.slice(0, -n);
     
    dropRight([1, 2, 3]); // [1,2]
    dropRight([1, 2, 3], 2); // [1]
    dropRight([1, 2, 3], 42); // []

33、dropRightWhile

此段代码将给定的数组按照给定的函数条件从右开始删除，直到当前元素满足函数条件为True时，停止删除，并返回数组剩余元素。

    const dropRightWhile = (arr, func) => {
      while (arr.length > 0 && !func(arr[arr.length - 1])) arr = arr.slice(0, -1);
      return arr;
    };
     
    dropRightWhile([1, 2, 3, 4], n => n < 3); // [1, 2]

34、dropWhile

按照给定的函数条件筛选数组，不满足函数条件的将从数组中移除。

    const dropWhile = (arr, func) => {
      while (arr.length > 0 && !func(arr[0])) arr = arr.slice(1);
      return arr;
    };
     
    dropWhile([1, 2, 3, 4], n => n >= 3); // [3,4]

35、elementContains

接收两个DOM元素对象参数，判断后者是否是前者的子元素。

    const elementContains = (parent, child) => parent !== child && parent.contains(child);
     
    elementContains(document.querySelector('head'), document.querySelector('title')); // true
    elementContains(document.querySelector('body'), document.querySelector('body')); // false

36、filterNonUnique

移除数组中重复的元素

    const filterNonUnique = arr => [ …new Set(arr)];
    filterNonUnique([1, 2, 2, 3, 4, 4, 5]); // [1, 2, 3, 4, 5]

37、findKey

按照给定的函数条件，查找第一个满足条件对象的键值。

    const findKey = (obj, fn) => Object.keys(obj).find(key => fn(obj[key], key, obj));
     
    findKey(
      {
        barney: { age: 36, active: true },
        fred: { age: 40, active: false },
        pebbles: { age: 1, active: true }
      },
      o => o['active']
    ); // 'barney'

38、findLast

按照给定的函数条件筛选数组，将最后一个满足条件的元素进行删除。

    const findLast = (arr, fn) => arr.filter(fn).pop();
     
    findLast([1, 2, 3, 4], n => n % 2 === 1); // 3

39、flatten

按照指定数组的深度，将嵌套数组进行展平。

    const flatten = (arr, depth = 1) =>
      arr.reduce((a, v) => a.concat(depth > 1 && Array.isArray(v) ? flatten(v, depth - 1) : v), []);
     
    flatten([1, [2], 3, 4]); // [1, 2, 3, 4]
    flatten([1, [2, [3, [4, 5], 6], 7], 8], 2); // [1, 2, 3, [4, 5], 6, 7, 8]

40、forEachRight

按照给定的函数条件，从数组的右边往左依次进行执行。

    const forEachRight = (arr, callback) =>
      arr
        .slice(0)
        .reverse()
        .forEach(callback);
        
    forEachRight([1, 2, 3, 4], val => console.log(val)); // '4', '3', '2', '1'

41、forOwn

此段代码按照给定的函数条件，进行迭代对象。

    const forOwn = (obj, fn) => Object.keys(obj).forEach(key => fn(obj[key], key, obj));
    forOwn({ foo: 'bar', a: 1 }, v => console.log(v)); // 'bar', 1

42、functionName

此段代码输出函数的名称。

    const functionName = fn => (console.debug(fn.name), fn);
     
    functionName(Math.max); // max (logged in debug channel of console)
————————————————
版权声明：本文为CSDN博主「前端达人」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/Ed7zgeE9X/article/details/104284779