js数组

JavaScript之对象Array

 

　　数组Array是JavaScript中最常用的类型之一，同一数组中可以保存任意类型的数据，并且它的长度是动态的，会随着数组中数据的加减自动变化。每个数组都有一个表示其长度（数组元素的个数）的length属性。并且数组元素的索引（下标）是从0开始的，所以数组最后一个元素的索引永远等于length – 1；

 

一     创建数组

         1，使用new关键字创建

var arr = new Array();

       可以向Array构造函数传递参数以实现创建包含特定数据的数组，多个参数使用逗号隔开。

　　需要注意的是：当参数只有一个数字时，构造函数创建的不是包含该数字的字符串，而是一个长度为该数字的空数组，即arr.length = 数字。

         2，使用字面量形式创建

var arr = [1,2,3];

       数组元素被包含在一对“[]”中括号内，数组的每个元素之间用逗号隔开，最后一个元素后面不需要逗号。

　　另外，上面已经讲过，数组的长度是动态的，它体现在可以手动的修改其length的值，以达到删除或增加数组长度的目的。

var arr = [1,2,3];
console.log(arr.length);//3
arr.length = 2;
console.log(arr.length);//2
console.log(arr);//[1,2]
arr.length = 3;
console.log(arr.length);//3
console.log(arr);//[1,2,empty ]

　　3，数组元素的访问

         我们使用中括号[]加数字的形式访问数组元素。      

var arr = [1,2,3];
console.log(arr[0]);//1

         通过这种方式我们也可以动态的修改某一位置的值，或向某一位置插入一个新值。   

var arr = [1,2,3];
arr[0] = 4;
console.log(arr);//[4,2,3]
arr[4] = 0;
console.log(arr);//[4,2,3,empty,0];

        可以看到，原本arr的长度是3，但我们向下标4的位置插入了一个新值，于是数组的长度变成了5，由于下标为3的位子原来并没有值，并且我们也没有新插入，所以JavaScript自动向该位置添加了一个空值占位符。

二     数组的遍历

         1，普通for循环　　　　

var arr = [1,2,3];
for(var i = 0,len = arr.length;i < len;i++){
    console.log(arr[i]);
    //some code;
}    

       效率最高的遍历数组方式。 

　　 2，forEach　　　

var arr= [1,2,3];
arr.forEach(function (item, index, array) {
    console.log(index + ":" + item + ":" + array);
});
/*
0:1:[1,2,3]
1:2:[1,2,3]
2:3:[1,2,3]
*/

　　函数接受3个参数，第一个是当前处理元素的值，第二个是当前处理元素的下标，第三个是当前遍历的数组，第二三个参数是可选的。

         3，map　　　

var arr = [1,2,3];
var newArr = arr.map(function (item, index, array) {
    return item * item;
}
console.log(newArr);//[1,4,9]

        函数的参数和forEach方法一致。它会把函数作用到每个遍历到的数组元素上，并返回一个新值，最终得到一个新数组并返回。

　　 4，for…in　　

var arr = [1,2,3];
for(var index in arr){
    console.log(index + ":" + arr[index]);
}
/*
0:1
1:2
2:3
*/

       for...in更适合遍历对象，而不是数组，而且使用它遍历数组的效率并不高。

　　5，for…of

var arr = [1,2,3];
for(var item of arr){
    console.log(item);
}
//1
//2
//3

　　for...of是ES6的新方法，用它遍历数组比for...in稍快一点。

三 　　数组常用方法

　　1，  toString(),valueOf()和join()

　　数组调用toString()和valueOf()一般返回由逗号隔开的所有数组元素组成字符串。　

var arr = [“hello”,”world”];
console.log(arr.toString());//”hello,world”
console.log(arr.valueOf());//”hello,world”

　　join()方法和他们不同，它可以接受一个字符串作为参数，用这个字符串作为分隔符。

var arr = [”hello”,”world”];
console.log(arr.join());//”hello,join”
console.log(arr.join(“”));//”helloworld”
console.log(arr.join(“&&”));//”hello&&world”

　　2，  push()和pop()，unshift()和shift()

　　push()接受任意个参数，依次添加到数组的末尾，返回修改后数组的长度。

　　pop()从数组末尾删除一项，返回被删除的元素。

　　unshift()从数组开头插入任意个元素，返回插入后数组的长度。

　　shift()从数组开头删除一个元素，返回被删除的元素。

var colors = ["red","blue","pink","white"];
colors.push("black");//5
console.log(colors);//["red","blue","pink","white","black"]
colors.pop();//"black"
console.log(colors);//["red","blue","pink","white"]
colors.unshift("green");//5
console.log(colors);//["green","red","blue","pink","white"]
colors.shift();//"green"
console.log(colors);//["red","blue","pink","white"]

　　3，  reverse()和sort()

　　reverse()会翻转数组元素的顺序。

var arr = [1,2,3];
arr.reverse();
console.log(arr);//[3,2,1]

　　sort()默认根据数组元素的字符编码排序。可以接受一个函数作为参数，该函数接受两个参数，如果第一个参数应该在第二个之后，那么返回一个正数，如果第一个和第二个位置不变，则返回0，如果第一个应该在第二个之前，那么返回一个负数。

var colors = ["red","blue","pink","white"];
colors.sort(function(val1,val2){
    if(val1 < val2){
        return -1;
    }else if(val1 == val2){
        return 0;
    }else{
        return 1;
    }
});
console.log(colors);["blue","pink","red","white"]

　　如果想实现倒序排列，可以设置当val1小于val2时返回1，最后返回-1；如果比较的是数字，可简写为：

var arr = [3,51,55,23,-1,-50,0.2];
arr.sort(function(val1,val2){
    return val1 - val2;
});
console.log(arr);//[-50, -1, 0.2, 3, 23, 51, 55]

　　如果想实现倒序排列，则return val2 - val1 即可；

　　sort()方法在接受到函数作为参数后，会把数组的每一个值依次当做函数的参数传给它，第一次是arr[0]和arr[1],比较完后会把排在后面的那个值作为函数的第一个参数，arr[2]作为第二个参数再传给函数，依次类推，直到最后一个数组元素。

　　4，  concat()

　　接受一个或多个数组作为参数，把这些参数数组与原数组连接，形成一个新数组并返回。如果不是数组，也会被简单的连接到一起形成新数组。

var arr = [1,2,3];
var otherArr = ["hello","world"];
console.log(arr.concat(otherArr));//[1,2,3,"hello","world"]

　　5，  slice()

　　接受两个数字作为参数，返回数组下标在他们之间的元素（不包含下标为第二参数的元素）组成的新数组，该方法不会改变原数组。

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

　　6，  splice()

　　该方法功能强大，有以下三种使用方法：

　　　　A：删除

           接受两个数字参数，第一个表示需要被删除的第一项的下标，第二个表示续保被删除的元素个数。

　　　　B：插入

           接受3个或多个参数，第一个是插入元素的起始位置，第二个是0，表示不删除原数组的任何元素，第三个是要被插入的元素，如果有多个元素需要被插入，可以继续在后面添加其他参数。

　　　　C：替换

           接受3个或多个参数，第一个是要被替换的元素的起始位置，第二个是需要被替换的元素个数，其他的的参数是替换的内容。如果想保持原数组长度不变，则替换内容的个数必须和第二个参数相等。

var arr = [1,2,3,4,5];
arr.splice(0,3);//从第一个元素开始删除3个元素
console.log(arr);//[4,5]
arr.splice(0,0,1,2,3);//从第一个元素开始删除0个，并添加1,2,3这3个元素
console.log(arr);[1,2,3,4,5]
arr.splice(2,2,5,5);//从第三个元素开始删除2个，并在该位置添加两个5，从结果看就像是用5替换了原数组中的3和4
console.log(arr);//[1,2,5,5,5]