ES6 小技巧

199 阅读2分钟

数组方法

1、数组差集
    var arr1 = [2,3,4]; var arr2= [1,2,3]
    var result = arr1.concat(arr2).filter(function (v) {
        return arr1.indexOf(v)===-1 || arr2.indexOf(v)===-1
    })
    console.log(result)     //[4,1]
    
2、数组交集
    var arr1 = [2,3,4]; var arr2= [1,2,3]
    var result = arr2.filter(function(v){
        return arr1.indexOf(v)!==-1
    })
    console.log(result)     //[2,3]
    
3、arr.includes() 判断数中是否包含给定的值
    let arr = [1,2,3,4,5]
    let arr1 = arr.includes(2)  
    console.log(arr1)   // ture
    
4、arr.find(callback) 找到第一个符合条件的数组成员  找到第一个符合条件就退出循环
    let arr = [1,2,3,4,5,2,4]
    let arr1 = arr.find((value, index, array) =>value > 2)
    console.log(arr1)   // 3

5、arr.filter(callback) 过滤数组,返回一个满足要求的数组    从头找到尾 找寻所有符合条件的
    let arr = [1,2,3,4,5]
    let arr1 = arr.filter( (value, index) => value<3)
    console.log(arr1)    // [1, 2]

6、arr.reduce(callback, initialValue) 迭代数组的所有项,累加器,数组中的每个值(从左到右)合并,最终计算为一个值
    参数: callback: previousValue 必选 --上一次调用回调返回的值,或者是提供的初始值(initialValue)
                    currentValue 必选 --数组中当前被处理的数组项
                    index 可选 --当前数组项在数组中的索引值
                    array 可选 --原数组
            initialValue: 可选 --初始值
    let arr = [0,1,2,3,4]
    let arr1 = arr.reduce((preValue, curValue) => preValue + curValue)
    console.log(arr1)    // 10

7、arr.every(callback) 依据判断条件,数组的元素是否全满足,若满足则返回ture
    let arr = [1,2,3,4,5]
    let arr1 = arr.every( (value, index) =>value<3)
    console.log(arr1) // false
    let arr2 = arr.every( (value, index) =>value<6)
    console.log(arr2)  // true
    
8、arr.some() 依据判断条件,数组的元素是否有一个满足,若有一个满足则返回ture
    let arr = [1,2,3,4,5]
    let arr1 = arr.some( (value, index) =>value<3)
    console.log(arr1) // true
    let arr2 = arr.some( (value, index) =>value>6)
    console.log(arr2) // false

9、数组去重
    A:
        let arr = [1,2,3,4,1,2,3,1,2,3];
        function unique(arr) {
            return Array.from(new Set(arr))
        }
        let newArr2 = unique(arr);
        console.log(newArr2)        //[1,2,3,4]
    
    B:
        const arr = [1,1,2,2,3,3,4,4,5,5]
        let newArr = [...new Set(arr)];
        console.log(newArr)        //[1,2,3,4,5]

10、flat扁平化数组
        a. flat()默认只会拉平一层,flat(n)拉平n层,Infinity无限次
        b. flat()会跳过空格,返回新数组不改变原数组

    var arr = [1,[2],[3,[4],[5,[6]]]];
    console.log(arr.flat(Infinity))        //[1, 2, 3, 4, 5, 6]
    
11、treeToArray 【扁平化数据】
    treeToArray(data){
      return data.reduce((res,{children = [], ...params}) => {
        return res.concat([params],treeToArray(children))
      },[])
    }

12、深度克隆
    JSON.parse(JSON.stringify(obj))
        弊端:
            a.如果obj里面有时间对象,则JSON.stringify后再JSON.parse的结果,时间将只是字符串的形式。而不是时间对象;
            b.如果obj里有RegExpError对象,则序列化的结果将只得到空对象;
            c.如果obj里有函数,undefined,则序列化的结果会把函数或 undefined丢失;
            d.如果obj里有NaNInfinity和-Infinity,则序列化的结果会变成null
            e.JSON.stringify()只能序列化对象的可枚举的自有属性,例如 如果obj中的对象是有构造函数生成的, 则使用JSON.parse(JSON.stringify(obj))深拷贝后,会丢弃对象的constructor;
            f.如果对象中存在循环引用的情况也无法正确实现深拷贝;

    function clone(Obj) {
        var buf;   
        if(Obj instanceofArray) {
            buf = [];  // 创建一个空的数组
            vari = Obj.length;
            while(i--) {
                buf[i] = clone(Obj[i]);
            }
            returnbuf;
        } elseif(Obj instanceofObject){
            buf = {};  // 创建一个空对象
            for(vark inObj) {  // 为这个对象添加新的属性
                buf[k] = clone(Obj[k]);
            }
            returnbuf;
        }else{
            returnObj;
        }
    }