JS中数组的那些事

1. 把对象中的keys转成数组

   let obj = {
        a: 123,
        b: 321,
        c: 333,
        d: 567
    }
    console.log(Object.keys(obj)); // ["a", "b", "c", "d"]

2. 把字符串分割成数组

    let str = "a,b,c,d";
    console.log(str.split(',')); // ["a", "b", "c", "d"]

3. 把数组转成字符串

用toString转换

    let arr = [1,2,3,4];
    console.log(arr.toString()); //1,2,3,4

用join转换

    let arr = [1,2,3,4];
    console.log(arr.join(",")); //1,2,3,4

4.数组排序sort

sort是按字符编码的顺序进行排序

    let arr = [11,12,1,32, 3, 4];
    console.log(arr.sort()); // [1, 11, 12, 3, 32, 4]

如果要让数组按大小排序呢，代码如下：

升序：

    let arr = [11,12,1,32, 3, 4];
    console.log(arr.sort((a, b)=>{
        return a - b;
    })); // [1, 3, 4, 11, 12, 32]

降序:

    let arr = [11,12,1,32, 3, 4];
    console.log(arr.sort((a, b)=>{
        return b - a;
    })); // [32, 12, 11, 4, 3, 1]

5.reverse方法

reverse() 方法用于颠倒数组中元素的顺序

该方法会改变原来的数组，而不会创建新的数组

    let arr = [11,12,1,32, 3, 4];
    console.log(arr.reverse()); // [4, 3, 32, 1, 12, 11]
    console.log(arr);  // [4, 3, 32, 1, 12, 11]

6. 栈和队列

• 栈操作：

先进后出

    let arr = [];
    arr.push(1);
    arr.push(2);
    console.log(arr); // [1,2]
    console.log(arr.pop()); // 2
    console.log(arr.pop()); // 1

pop是拿数组最后一个值

• 队列操作：

先进先出

    let arr = [];
    arr.push(1);
    arr.push(2);
    console.log(arr); // [1,2]
    console.log(arr.shift()); // 1
    console.log(arr.shift()); // 2

shift是拿数组第一个值

unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度

    let arr = [1,2];
    arr.unshift(3,4,5);
    console.log(arr); // [3, 4, 5, 1, 2]

7.concat方法

concat() 方法用于连接两个或多个数组，不改变原数组

    let arr1 = [1,2,3];
    let arr2 = [4,5,6];
    console.log(arr1.concat(arr2)); // [1, 2, 3, 4, 5, 6]
    console.log(arr1); // [1,2,3]
    console.log(arr2); // [4,5,6]

8.slice方法

slice(start, end)截取数组中从start到end的数组，不改变原数组

    let arr = [1,2,3,4,5,5];
    console.log(arr.slice(1,3)); // [2, 3]
    console.log(arr); // [1, 2, 3, 4, 5, 5]

9.splice方法

splice(index,howmany,item1,…,itemX)

index: 规定添加/删除项目的位置，使用负数可从数组结尾处规定位置

howmany: 要删除的项目数量。如果设置为 0，则不会删除项目

item1, …, itemX: 向数组添加的新项目

splice可以用来数组删除和添加，会改变原来的数组

    let arr = [1,2,3,4,5,5];
    console.log(arr.splice(1,3)); // [2, 3, 4]
    console.log(arr); //  [1, 5, 5]

10.indexOf() 和 lastIndexOf()

indexOf：某个元素在数组中首次出现的索引值

lastIndexOf：某个元素在数组中最后一次出现的索引值

    let arr = [1,2,3,4,5,5];
    console.log(arr.indexOf(5)); // 4
    console.log(arr.lastIndexOf(5)); // 5

11. every()方法

• 检测数组所有元素是否都符合指定条件
• every() 不会对空数组进行检测
• every() 不会改变原始数组

 let arr = [{
        name: '小明',
        id: 1
    },{
        name: '小明',
        id: 2
    }];

    let a = arr.every(it=>{
        return it.name == '小明'
    })
    console.log(a); // true

    let b = arr.every(it=>{
        return it.id == 1
    })
    console.log(b); // false

12. some()方法

• 用于检测数组中的元素是否满足指定条件
• some() 不会对空数组进行检测
• some() 不会改变原始数组

 let arr = [{
        name: '小明',
        id: 1
    },{
        name: '小明',
        id: 2
    }];

    let a = arr.some(it=>{
        return it.name == '小明'
    })
    console.log(a); // true

    let b = arr.some(it=>{
        return it.id == 1
    })
    console.log(b); // true

13.forEach和for循环的区别

• forEach不支持break
• forEach中使用return无效

14.filter过滤

• filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素
• filter() 不会对空数组进行检测
• filter() 不会改变原始数组

 let arr = [{
         name: '小明',
         id: '1'
     },{
         name: '小花',
         id: '2'
     },{
         name: '小明',
         id: '3'
     }]

    //  过滤出name为小明的那一项
    let newArr = arr.filter(it=>it.name == '小明');
    console.log(newArr);
    // 输出结果 [{name: "小明", id: "1"}, {name: "小明", id: "3"}]

15.map用法

• map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值
• map() 方法按照原始数组元素顺序依次处理元素
• map() 不会对空数组进行检测
• map() 不会改变原始数组

    let arr = ['小明', '小花', '小涛'];
    let newArr = arr.map((it, index)=>{
        return {
            name: it,
            id: index
        }
    });
    console.log(newArr);
    //输出结果：[{name: "小明", id: 0}, {name: "小花", id: 1}, {name: "小涛", id: 2}]

16.reduce用法

• reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值
• reduce() 对于空数组是不会执行回调函数的

语法

arr.reduce(function(prev,cur,index,arr){
...
}, init);

arr 表示原数组；
prev 表示上一次调用回调时的返回值，或者初始值 init;
cur 表示当前正在处理的数组元素；
index 表示当前正在处理的数组元素的索引，若提供 init 值，则索引为0，否则索引为1；
init 表示初始值。

 let arr = [1,2,3,4,5];
    let total = arr.reduce((pre, current, index)=>{
        return pre+current;
    }, 0);
    console.log(total); // 15

17.reduceRight用法

• reduceRight() 方法的功能和 reduce() 功能是一样的，不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加
• reduce() 对于空数组是不会执行回调函数的