JavaScript中的数组相关方法

一、数组的增删改

1. push()
push()方法是向数组中添加新元素的最佳方法，在数组结尾处添加一个新元素，返回新数组的长度
例：

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.push('Lemon');  
    console.log(fruits); // 输出：['Banana','Orange','Apple','Mango','Lemon']
    console.log(x); // 输出 : 5
</script>

.length属性也可以向数组添加元素
fruits[fruits.length] = 'Lemon ';

2. Array.isArray(fruits)
判断变量fruits是否是数组类型。如果是，返回true；否则，返回false。
类似功能的有：instanceof
例：fruits instanceof Array;
如果fruits是数组，返回true；否则，返回false。

3. toString()
把数组转换为字符串，数值之间由逗号连接
例：

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.toString();
    console.log(x);   // 输出 ： Banana,Orange,Apple,Mango
</script>

4. join()
也可以将所有数组元素结合为一个元素，不过，可以规定分割符

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.join("-");
    console.log(x); // 输出 ：Banana-Orange-Apple-Mango
</script>

5. pop()
从数组中删除最后一个元素,并返回被删除的元素

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.pop();
    console.log(x);  // 输出 ：Mango
    console.log(fruits);  // 输出 ：Banana,Orange,Apple        
</script>

6. push()
在数组结尾处添加一个新元素，并返回新数组的长度。并且一次可以添加多个，在括号内用逗号隔开。

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.push('Kimi','Lemon');
    console.log(x);  // 输出 ：6
    console.log(fruits);  // 输出 ：Banana,Orange,Apple,Mango,Kimi,Lemon      
</script>

7. shift()
会删除首个数组元素，并把它所有其他元素降低索引，返回碑额删除的元素。

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.shift();
    console.log(x);  // 输出 ：Banana
    console.log(fruits);  // 输出 ：Orange,Apple,Mango      
</script>

8. unshift()
向数组开头添加 新元素，返回长度。也可以一次添加多个元素。

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.unshift('Kimi','Lemon');
    console.log(x);  // 输出 ：6
    console.log(fruits);  // 输出 ：Kimi,Lemon,Banana,Orange,Apple,Mango     
</script>

9. delete
删除数组元素，但不会删除位置。并且被删除位置用for…in循环遍历不到，用for循环才能遍历到。

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    delete fruits[1];
    for(var i=0;i<fruits.length;i++)
    {
        console.log(fruits[i]); 
    }
    /*
        输出： Banana
              undefined
              Apple
              Mango
    */   
</script>

10. splice()
拼接数组，可以向数组添加数据，返回包含所有删除元素的数组

<script>
    var fruits = ['Banana','Orange','Apple','Mango'];
    var x = fruits.splice(1,2,'Lemon','Kiwi');
    console.log(x);  // 输出 ：Orange,Apple
    console.log(fruits);  // 输出 ：Banana,Lemon,Kiwi,Mango
</script>

注：第一个参数（1）：定义了应该添加的新元素的位置索引；
　　第二个参数（2）：定义了应该删除多少个数组元素；
　　其余参数（‘Lemon’,‘Kiwi’）：定义要添加的元素。

11. split()
将字符串转换为数组。

<script>
    var a = 'a,b,c,d';
    var b = a.split(',') 
    // 根据逗号分隔为数组
    // b 数组 ：["a", "b", "c", "d"]
    var x = 'a b c d';
    var y = x.split(' ');
    // 根据空格分隔为数组
    // b 数组 ：["a", "b", "c", "d"]
</script>

二、数组排序

1. sort()
以字母顺序对数组进行排序。(如果有数字，也是逐个数字比较，而不是比较大小)

<script>
    var a = [4,'f',true,1,12,'a','t','b'];
    var b = a.sort();
    console.log(b); // 输出 ：1,12,4,a,b,f,t,true
</script>

2. reverse()
反转数组中的元素（倒序）

<script>
    var a = [1,2,3,4,5];
    var b = a.reverse();
    console.log(b); // 输出 ：5,4,3,2,1
</script>

三、数组迭代

1. Arry.forEach()
forEach()函数为每个数组元素调用一次函数。
例：

<script>
   // 用forEach()函数遍历数组
    var fruits = ['Banana','Orange','Apple','Mango'];
    var text = "<ul>";
    fruits.forEach(myFunction);
    text += "</ul>";
    document.write(text);
    function myFunction(value)
    {
        text += "<li>" + value + "</li>" ;
    }
</script>

2. Array.map()
通过对每个数组元素执行函数来创建新数组。
注：不会对没有值得数组元素执行函数；不会改变元素数组。

<script>
    var a = [1,2,3,4,5];
    var b = a.map(fun);
    console.log(b); // 输出 ：2,4,6,8,10
    function fun(value){
        return value*2;
    }
</script>

3. Array.filter()
创建一个包含通过测试的数组元素的新数组。

<script>
    var a = [1,2,3,4,5];
    var b = a.filter(fun);
    // b 数组 ：[4, 5]
    function fun(value){
        return value > 3;
    }
</script>

4. Array.every()
检测所有数组元素是否都通过测试，全部通过返回true；否则，返回false。

<script>
    var a = [1,2,3,4,5];
    var b = a.every(fun);
    console.log(b);     // 输出 : false
    function fun(value){
        return value > 3;
    }
</script>

5. Array.some()
检测某些数组元素是否通过测试，只要有满足条件的，就返回true；全都不满足，才返回false。

<script>
    var a = [1,2,3,4,5];
    var b = a.some(fun);
    console.log(b);     // 输出 : true
    function fun(value){
        return value > 3;
    }
</script>

6. Array.find()
返回数组中第一个通过测试的元素值。

<script>
    var a = [1,2,3,4,5];
    var b = a.find(fun);
    console.log(b);     // 输出 : 4
    function fun(value){
        return value > 3;
    }
</script>

7. Array.findIndex()
返回数组中第一个通过测试的元素索引。

<script>
    var a = [1,2,3,4,5];
    var b = a.findIndex(fun);
    console.log(b);     // 输出 : 3
    function fun(value){
        return value > 3;
    }
</script>

四.一些新特性

1.Array.includes() ---- ES7新特性
Array.includes(‘aa’,2)
查找数组是否有’aa’,有返回true,没有返回false.
参一(‘aa’):要查找的数据;
参二(‘2’):搜索的起始位置.

var a = [1,'aa',4,true];
console.log(a.includes('1')); //false,数据类型也要相同
console.log(a.includes(1));  //true
console.log(a.includes(1,3)); //false

2.Array.flat() ---- ES10
可以将一个多层的多维数组,递归遍历成一个新数组,括号内可以写递归几层,不写默认1
(ps:按照我的理解就是,括号内数字是几,数组内的数组就去掉几层括号)

var a = [1,[2],[[3]]];
console.log(a.flat(1)) // [1,2,[3]]  :2外面去掉了一层括号,3外面也去掉了一层括号
console.log(a.flat(2)) // [1,2,3]  :2外面去掉了一层括号已经直接拿出来了,3外面也去掉了两层括号,也拿出来了