JS 数组的方法

数组的方法

push

给数组的尾部添加一个或者多个元素，并且返回数组的新长度。

    添加多个元素时，用逗号分隔。

添加一个元素arr.push(1);

添加多个元素arr.push(1,2,3);

注意

arr.push([4,5,6]);为添加一个元素，该元素是一个数组。

 

例：添加后，如果长度超过5，则替换最后一个。

function addArray(){

    if(arr.length===5){

        arr[arr.length-1]

    }

}

 

注意：添加数组时，数组的长度会一直在改变。

所以以下代码块会死循环。arr.length会不断变化。

for(var i=0;i<arr,length;i++){

    arr.push(i);

}

扩展：arr.push();不填写参数时，可以作为length来使用

例：

for(var i=0;i<arr.push();i++){

    console.log(arr[i]);

}

 

 

---

pop

删除数组中最尾部的元素，并且返回被删除的元素

pop没有参数。

arr.pop();

如果arr.pop()；后，length的长度会发生改变。

 

            

---

 

shift

删除数组的第0个元素，并且返回被删除的元素。

删掉数组的第0个元素，不会删除掉下标，后面的元素会往前跟上，然后删除最后面空出来的下标，然后产生一个新长度，返回出来。

arr.unshft();

删除数组的第0个元素，并且返回被删除的元素。

在数组的第0个元素前添加一个元素，从没有被添加前的元素开始往后挤，后面的元素会依次往后挤，然后产生一个新长度，返回出来。

 

注意：不建议使用shift和unshift来操作大数据。

如果数据过多，会造成数据卡死，如下代码

            

 

---

concat()

不改变原数组

在数组后面添加元素，并返回一个（新）数组

用法：

        arr.concat(1);        //添加一个元素

        arr.concat(1,2,3)    //添加多个元素

        arr.concat([1,2,3]) //添加一个数组

        arr.convar(arr1,arr2)//添加一个或多个数组

concat连接数组

    如果参数是一个或者多个元素，将元素添加在数组尾部

    如果参数是一个或者多个数组，将数组连接在一起

    如果没有参数，复制数组（一个新的数组），俩个数组直接没有引用关系（即一个改变，另外一个不会发生改变）

 

如果需要数组当成元素连接在一起，那么就需要使用外面数组的模式连接

如：

    arr1=arr1.concar([arr],[arr0],[arr2])

将arra0添加在数组arr里面，通过push实现concat()的效果。

    Array.prototype.push.apply(arr,arr0);

---

join

arr.join()；

将数组的元素分别取出，并给与分割符，组合完成后返回一个字符串。

参数：

        1、如果不填写参数，返回以逗号为分割符的字符串

        2、如果填写字符为参数，则以这个字符为分割符

        3、如果填写空字符串，则元素之间连接在一起

var obj={a:1,b:2,c:3,d:[4,5]}

var str="a=1&b=2&c=3&d=4|5";将obj转换为这个

obj

        join实例：拼接Url中的提交数据的字符串

    var obj = {a:1,b:2,c:3,d:[4,5]}

    function objToString(obj){

        var str="";//存储要被拼接的字符串

                var num=0;

                //遍历对象，获得对象的长度。

                for(var prop in obj){

                    num++;

                }

                var i=0;

        for(var key in obj){

            i++;//当前循环的次数

            if(Array.isArray(obj[key]))//判断当前元素是否是数组

                str+=key+"="+obj[key].join("|")+(i===num?"":"&");//判断是否为最后一个，是则不填分割符，不是则填分割符"&"

                continue;

            str+=key+"="+obj[key]+(i===num?"":"&");

        }

        return str;

    }

 

---

indexOf

arr.indexOf(查找元素，从第几个下标开始);

在数组中查找元素，如果找到了，就返回这个元素第一次出现的下标，如果每找到，就返回-1；

返回一个找到的位置下标。

 

寻找{a:1}，结果返回-1。原因：俩个对象的索引（引用地址）不相同，索引地址（引用地址）相同则会找到它

        

 

        寻找所有的1的位置

    var arr=[1,2,3,1,7,8,9,1,5]

        

 

---

 

lastIndexOf()

    从后向前查找，查找元素第一次出现的位置。参考indexOf(),相反。

---

 

splice()

参数 idnex,howmany,item

splice(开始的位置，删除元素的总数，要添加的元素)

返回被删除的元素形成的数组，改变原数组

 

添加

    arr.splice(0,0,2);//表示在最头部添加2这个元素，和unshift相同

    arr.splice(arr.length,0,2);//表示在最尾部添加2这个元素，和push相同

插入

    arr.splice(5,0,2);//表示在第5位插入一个元素2

删除

    arr.splice(0,2)；从第0个位置开始，删除2个元素。

    arr.splice(-2,2)；从倒数第2个位置开始，删除2个元素。

    arr.spllice(-2);如果不填写删除的总数，标时从当前位置一致删除到结尾，达到了删除和截取的功能。

替换

    arr.splice(5,1,2);//表示将第5位元素替换为2

复制

    arr.splice(0)；从0开始，并且返回新数组，这表示从一个数组将所有元素传递到新数组。

 

---

slice()

slice()：返回从原数组中指定开始下标到结束下标之间的项组成的新数组。slice()方法可以接受一或两个参数，即要返回项的起始和结束位置。在只有一个参数的情况下， slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数，该方法返回起始和结束位置之间的项——但不包括结束位置的项。

 

var arr = [1,3,5,7,9,11];

var arrCopy = arr.slice(1);

var arrCopy2 = arr.slice(1,4);

var arrCopy3 = arr.slice(1,-2);

var arrCopy4 = arr.slice(-4,-1);

console.log(arr); //[1, 3, 5, 7, 9, 11](原数组没变)

console.log(arrCopy); //[3, 5, 7, 9, 11]

console.log(arrCopy2); //[3, 5, 7]

console.log(arrCopy3); //[3, 5, 7]

console.log(arrCopy4); //[5, 7, 9]

 

如果没有填写参数，那么等于复制数组，无引用关系

arrCopy只设置了一个参数，也就是起始下标为1，所以返回的数组为下标1（包括下标1）开始到数组最后。

arrCopy2设置了两个参数，返回起始下标（包括1）开始到终止下标（不包括4）的子数组。

arrCopy3设置了两个参数，终止下标为负数，当出现负数时，将负数加上数组长度的值（6）来替换该位置的数，因此就是从1开始到4（不包括）的子数组。

arrCopy4中两个参数都是负数，所以都加上数组长度6转换成正数，因此相当于slice(2,5)。

 

---

遍历

forEach

    //参数 item 每个元素，index每个元素的下标，arr原数组

    arr.forEach(function(item,index,arr){

        console.log(item,index,arr);

        //可以在这里对数组进行修改,无需有返回,需要注意的是：

        //如果元素为栈中存储类型（Number,String,Boolean,null,undefined）,则不能直接修改

        //在堆中存储的(object,object的变异类型：如数组)可以直接修改数值。

    })

注意：forEach没有返回值，会改变原数组，但是只能改变栈中存储的数据

 

---

map

    //参数 item 每个元素，index每个元素的下标，arr原数组

    //注意需要有返回值，return;

    arr.map(function(item,index){

        return item;//可以对item进行操作如：item*2(每个元素都变为2倍)

    })

    map执行后会返回一个数组，该数组是一个新数组

 

    //覆盖修改原数组 t为item（数组的元素）

    arr=arr.map(function (t){

        if(t>5){

            return 5;

        }else{

            return 0;

        }

    })

    注意：map有返回值,返回值为操作过后的数组（新数组），不会改变原数组，返回一个新数组

 

---

 

判断

some

判断元素中是否有满足条件的

一旦找到了，就不再继续查找了

执行完成后返回一个boolean类型

参数：item,index,arr / 元素，元素下标，原数组

    var arr=[1,2,3,4,5,6,7,8,9];

    var bool=arr.some(function (t){

        return t>5;

    })

some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

some() 方法会依次执行数组的每个元素：

如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。

如果没有满足条件的元素，则返回false。

注意： some() 不会对空数组进行检测。

           some() 不会改变原始数组。

---

判断

every

判断元素中是否都满足条件的

一旦找到了，就不再继续查找了

执行完成后返回一个boolean类型

如果所有元素都满足条件，就会返回为true，否则返回false;

参数：item,index,arr / 元素，元素下标，原数组

    arr.every（function(){

        return t>5;

    }）

every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

every() 方法使用指定函数检测数组中的所有元素：

如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。

如果所有元素都满足条件，则返回 true。

注意： every() 不会对空数组进行检测。

注意： every() 不会改变原始数组。

---

查找

filter

用于查找

参数：item,index,arr

元素，元素下标，原数组

将满足条件的元素传递到新的数组中(返回一个数组)

和map()类似，Array的filter()也接收一个函数。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素。

arr.filter(function ( t ) {

    return t>5;

})

    实例：将重复的删除，并且在剩下的一个进行操作，让其num+1；

 

思路：从当前元素开始循环，在后面寻找是否有相同的项，如果有相同的项，则关闭开关（关闭为true）

 

var data1=[];

var num=1;

 

var data1=data.filter(function(t,index){

    var bool=false;//开关

    //从当前元素往后对比，因为当前项本身就有，t为当前项，所以循环从index+1开始

    for(var i=index+1;i<data.length;i++){

        //判断是之后的所有项是否和当前项相同

        if(data[i].id===t.id){

            bool=true;

            num++;

            break;

        }

    }

    //如果和之后的所以项都不相同，就返回这个t（有重复的为什么也会添加过来呢？因为重复的所以项中，最后一个与其他都不相同，所以重复中的最后一个会被添加进来）

    t.num=num;

    if(!bool){ 

        num=1;

        return t;

    }

})

 

---

reduce

    //求每个元素的和

    arr.reduce(function(sum,item,index){

        return sum+item;

    });

    //按条件求和，大于5的相加

    arr.reduce(function(sum,item,index){

        if(item>5){

            return sum+item;

        }else{

            return sum;

        }

    });

arr.reduce(function(sum,item,index) {... },initial)

参数 sum,item,index   initial初始值

当不设置初始值时：

    sum 初始值,第0项的值

    item 是当前项（当前项从第1项开始）

    index是当前项索引项

当设置初始值时：

    sum 初始值=initial的值

    item 是当前项（当前项从第0项开始）

    index是当前项索引项

实例应用：100+数组中的偶数值

var sum=arr.reduce(function(sum,item,index){

    if(item%2===0){

        return sum+item;

    }else{

        return sum;

    }

},100)

console.log(sum);

 

---

 

排序

sort()

sort()：按升序排列数组项——即最小的值位于最前面，最大的值排在最后面。

在排序时，sort()方法会调用每个数组项的 toString()转型方法，然后比较得到的字符串，以确定如何排序。即使数组中的每一项都是数值， sort()方法比较的也是字符串，因此会出现以下的这种情况：

var arr1 = ["a", "d", "c", "b"];

console.log(arr1.sort()); // ["a", "b", "c", "d"]

arr2 = [13, 24, 51, 3];

console.log(arr2.sort()); // [13, 24, 3, 51]

console.log(arr2); // [13, 24, 3, 51](元数组被改变)

为了解决上述问题，sort()方法可以接收一个比较函数作为参数，以便我们指定哪个值位于哪个值的前面。比较函数接收两个参数，如果第一个参数应该位于第二个之前则返回一个负数，如果两个参数相等则返回 0，如果第一个参数应该位于第二个之后则返回一个正数。以下就是一个简单的比较函数：

console.log(arr2.sort(function (a,b){

        return a-b;

    }

))

 

---

reverse()

反转数组项的顺序。

    var arr = [13, 24, 51, 3];

    console.log(arr.reverse()); //[3, 51, 24, 13]

    console.log(arr); //[3, 51, 24, 13](原数组改变)