JavaScript 数组方法对比

前言：JavaScript 提供了多种新增，移除，替换数组元素的方法，但是有些会影响原来的数组；有些则不会，它是新建了一个数组。

ps:在开始申明：var l = console.log.bind(console)

新增

1：影响原数组

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

2：不影响原数组
使用concat方法：

    let arr = [1,2,3,4];
    arr.concat(5);
    l(arr) //[1,2,3,4]

使用JavaScript 的展开（spread）操作符，展开操作符是三个点（…）

    let arr1 = [1,2,3,4];
    let arr2 = [...arr1,5];
    l(arr2)//[1, 2, 3, 4, 5]
    l(arr1)//[1, 2, 3, 4, 5]

删除

1：影响原数组

    let arr = [1,2,3,4];
    l(arr.pop());//4 取到最后一个
    l(arr)//[1,2,3] 原数组被改变
    l(arr.shift());//1 取到第一个
    l(arr)//[2,3] 原数组被改变

使用Array.splice()方法

    let arr = ['a','b','c','d'];
    arr.splice(1,2)//1代表从索引为1的数开始('b'),2代表删除('b','c')这两个元素,也就实现了删除这个目的
    l(arr)["a","d"]

2：不影响原数组
使用Array.filter方法 基于原数组创建一个新数组，新数组仅包含匹配特定条件的元素

    let arr = [1,2,3,4];
    l(arr.filter(e => e !== 3))//[1, 2, 4] ，e 代表arr中的每一项
    l(arr)//[1, 2, 3, 4] 原数组未被改变

使用Array.slice方法

    let arr = ['a','b','c','d'];
    l(arr.slice(1,2)); //["b"]
    l(arr);//["a", "b", "c", "d"]

替换

1：影响原数组
使用Array.splice()方法

    let arr = ['a','b','c','d'];
    l(arr.splice(1,2,'e','f'))//["b", "c"]
    l(arr)//["a", "e", "f", "d"]

2：不影响原数组
使用Array.map()方法

    let arr = ['a','b','c','d'];
    let arr1= arr.map(item => {
        if (item == 'b') {
            item = 'f'
        }
        return item
    } )
    l(arr1)//["a", "f", "c", "d"]
    l(arr)//['a','b','c','d']