js原生API妙用（一）

复制数组

我们都知道数组是引用类型数据。这里使用slice复制一个数组，原数组不受影响。

 let list1 = [1, 2, 3, 4];

 let newList = list1.slice();

 list1.push(5); // [1,2,3,4,5]

 //newList [1,2,3,4] 不受影响

 console.log(newList); //[1,2,3,4]

 console.log(list1); //[1, 2, 3, 4, 5]

 let list2 = [5,6,7,8];

 let newList2 = list2.concat();

 newList2.push(9); //

 console.log(newList2); //[5, 6, 7, 8, 9]

 console.log(list2); //[1, 2, 3, 4, 5]

函数参数转数组

将函数参数转数组，利用arguments伪数组形式，再用slice拷贝为新数组。

 function argsParam() {

     //arguments伪数组形式，再用slice拷贝为新数组

     return Array.prototype.slice.call(arguments);

 }

 console.log(argsParam(1,2,3,4)); //[1, 2, 3, 4]

重复n个字符

利用Array构造函数传参，再使用join函数分隔指定的字符串

 /**

     @params

     num: 重复次数

     str: 重复字符串

 **/

 function repeatStr(num, str) {

     return new Array(num+1).join(str);

 }

 console.log(repeatStr(5, 's'));//sssss

创建 N x N 二维矩阵，并初始化数据

使用Array对象传入数组length参数，调用fill再用map循环fill替换对应的值返回一个新数组

 /**

     @params

     num: 矩阵次数

     str: 矩阵数组中的值，由于fill函数替换所以值都是一致的

 **/

 function arrayMatrix(num, matrixStr) {

     return Array(num).fill(null).map(() => Array(num).fill(matrixStr));

 }

 //  ["a", "a", "a", "a"]  ["a", "a", "a", "a"] ["a", "a", "a", "a"] ["a", "a", "a", "a"]

 console.log(arrayMatrix(4, 'a'));

类数组（NodeList）转数组（Array）

其实，前面几个例子也有。如slice，这里加多数组的from方法,ES6语法糖

 //返回的不是真正的Array（你无法使用filter、map、reduce等方法）

 const nodeList = document.querySelectorAll('div');

 // 方法1: 使用Array.from

 const arrayList1 = Array.from(nodeList);

 // 方法2: 使用slice

 const arrayList2 = Array.prototype.slice.call(nodeList);

 // 方法3: 使用ES6语法糖

 const arrayList3 = [...nodeList];

数组内记录重复次数

使用reduce函数，reduce函数接收4个参数：1.累计变量：默认数组的第一个值；2.当前变量：默认数组的第二个值；3.当前位置：重0开始；4.原数组

 const arrs = [1, 1, 1, 2, 2, 3];

 //得到{1: 3, 2: 2, 3: 1}

 arrs.reduce((obj, item) => {

     if(!obj[item]) {

         obj[item] = 0;

     }

     obj[item]++;

     return obj;

 }, {});

数组去重

数组去重有很多种方式如传统的for循环等，这里例子使用最新的ES6 set不重复方式，并使用set的has、add等 API操作；注意set返回的也是一个不重复的类数组形式要使用Array.from方法转成数组形式

 /**

     @params

     arr: 需要去重的数组

 **/

 function uniqueArray(arr) {

     const setArr = new Set();

     return arr.filter(val => !setArr.has(val) && setArr.add(val));

 }

 console.log(uniqueArray([1,1,2,1,1,2,3,4,5,3,2,4]));    //[1, 2, 3, 4, 5]

参考：http://hectorguo.com/zh/magic-js/

秒客网