数组不仅仅在JavaScript中扮演着非常重要的角色,而且在其它的程序语言中的重要性也是不言而喻的。数组在面试的过程中被提及的频率是非常高的,同时JavaScript中的数组与其他语言中的的数组还是有些区别的。
创建数组
- 通过使用Array构造函数创建数组:
/*************创建一个空的数组**************/
var arr1=new Array();//创建一个空的数组
console.log(arr1);//[]
arr1[0]="张三";//设置数组下标0的值为张三
arr1[1]="李四";//设置数组下标1的值为李四
console.log(arr1);//[ '张三', '李四' ]
console.log(arr1.length);//2
/*************创建指定长度的数组************/
var arr2 = new Array(2);//创建一个长度为2的数组
arr2[0]="red";//arr2下标0的值为"red"
arr2[1]="yellow";//arr2下标1的值为"yellow"
arr2[2]="green";//arr2下标2的值为"green",arr2声明长度为2,但可以添加超过其指明长度的元素
console.log(arr2);//[ 'red', 'yellow', 'green' ]
/*********创建指定数组初始值的数组*********/
var arr3 = new Array("laoLiu","laoTie","laoWang");
console.log(arr3.length);//3
console.log(arr3);//[ 'laoLiu', 'laoTie', 'laoWang' ]
- 通过数组字面量的形式创建数组:
//其实即为Array的简化写法
var arr1 = []; //创建一个空数组
var arr2 = [20]; // 创建一个长度为1的数组
var arr3 = ["red","yellow","green"]; // 创建一个具有初始值的数组
arr3[arr3.length] = "blue"; //下标3处(数组尾部)添加一项"blue"
arr3[1]="gold";//修改下标为1的值为"gold"
//注:数组的length属性是可修改的!
arr3.length = arr3.length-1; //将数组的最后一项删除
console.log(arr3);// ["red","gold","green"]
数组常见方法
- push():将一个或多个元素添加到数组尾部,返回值为添加元素后的数组长度。
var arr = ["red"];
var len=arr.push("blue");//尾部添加一个元素
console.log(len,arr);//2, [ 'red', 'blue' ]
len=arr.push("gold","white");//尾部添加多个元素
console.log(len,arr);//4 ,[ 'red', 'blue', 'gold', 'white' ]
- unshift():将一个或多个元素添加到数组头部,返回值为添加元素后的数组长度。
var arr = ["red"];
var len=arr.unshift("blue");//头部添加一个元素
console.log(len,arr);//2, [ 'blue', 'red' ]
len=arr.unshift("gold","white");//头部添加多个元素
console.log(len,arr);//4 ,[ 'gold', 'white', 'blue', 'red' ]
- pop():数组末尾移除最后一项,减少数组的 length 值,然后返回移除的项。
var arr = ["red","yellow","green"];
var item=arr.pop();//移除arr最后一项green
console.log(item);//green
console.log(arr.length);//2
console.log(arr);//[ 'red', 'yellow' ]
- shift():删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined 。
var arr = ["red","yellow"];
var item=arr.shift();//移除arr第一项red
console.log(item);//red
console.log(arr);//[ 'yellow' ]
item=arr.shift();//继续移除第一项
console.log(item);//yellow
console.log(arr);//[ ]
item=arr.shift();//arr已为空数组,但我还要继续shift
console.log(item);//undefined
console.log(arr);//[ ]
- reverse():数组的元素顺序进行反转,返回结果为反转后的数组。
var arr=[2,4,6,8,10];
console.log(arr.reverse());//[ 10, 8, 6, 4, 2 ]
console.log(arr);//[ 10, 8, 6, 4, 2 ]
- concat():连接两个或多个数组,它不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
//连接多个元素
var arr = [1,2,3];
console.log(arr.concat(4,5));//[ 1, 2, 3 , 4, 5]
console.log(arr);//[ 1, 2, 3 ]
//连接数组
var arr2 = [1,2,3];
console.log(arr2.concat([4,5],[6,7]));//[ 1, 2, 3, 4, 5, 6, 7 ]
console.log(arr2);//[ 1, 2, 3 ]
- slice():该方法可从数组中返回选定的元素。接收一个或两个参数,即要返回的起始与结束位置。如果只有一个参数,返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数,返回起始和结束之间的元素,但不包括结束位置的元素。
var arr = [1,2,3,4,5,6];
var arr2 = arr.slice(1);
var arr3 = arr.slice(1,3);
var arr4 = arr.slice(1,-2);
var arr5 = arr.slice(-3,-1);
//原数组没有发生变化
console.log(arr); //[ 1, 2, 3, 4, 5, 6 ]
//返回从下标1到数组最后的项
console.log(arr2); //[ 2, 3, 4, 5, 6 ]
//返回开始下标为1,结束下标(不包括3)之间的元素。
console.log(arr3); //[ 2, 3 ]
//下标为负数时,将负数加上数组的长度6,来替换该位置的数,所以应与arr.slice(1,4)的结果一致
console.log(arr4); //[ 2, 3, 4 ]
//负数与数组长度相加,替换位置的数字,即与arr.slice(3,5)的结果相同。
console.log(arr5); //[ 4, 5 ]
- join():通过指定的分隔符将数组的各个元素进行连接成为一个字符串。如果不指定分隔符,则默认使用逗号作为分隔符。
var arr=["red","yellow","green"];
//指定"-"为分隔符,进行分隔
console.log(arr.join("-"));//red-yellow-green
//未指定分隔符,返回字符串默认以,进行分隔
console.log(arr.join());//red,yellow,green
//对原数组无影响
console.log(arr);//[ 'red', 'yellow', 'green' ]
- splice():非常强大的数组方法,可以实现删除、插入和替换。返回值为一个数组,该数组为删除元素,如果没有删除任何元素,则返回一个空数组。
删除:可以删除任意数量的元素,需要指定2个参数:要删除的第一项的位置和要删除的项数。返回的结果为删除的内容。
var arr=[2,4,6,8,10];
var arr2=arr.splice(0,2);//从下标0开始删除,删除2个元素
console.log(arr2);//[ 2, 4 ]
console.log(arr);//[ 6, 8, 10 ]
插入:可以向指定位置插入任意数量的元素,需要提供3个参数:起始位置、0(要删除的元素数量)、插入的元素
var arr=[2,3];
//从数组第2个位置插入3,4
var arr2=arr.splice(2,0,3,4);
console.log(arr2);//[]
console.log(arr);//[2,3,3,4]
替换:其实就是先删除,然后再插入
var arr=[2,3];
//将3替换为4,5
//先删除元素3,然后在3的位置插入4,5
var arr2=arr.splice(1,1,4,5);
console.log(arr2);//[3]
console.log(arr);//[ 2, 4, 5 ]
- forEach():对数组进行遍历。参数为函数,默认有传参,参数分别为:遍历数组的元素,与元素对应的下标(索引),数组本身
var arr=[2,3,6,7,9];
arr.forEach(function(v,i,a){
console.log(v+"|"+i+"|"+(a==arr));
})
// 结果:
// 2|0|true
// 3|1|true
// 6|2|true
// 7|3|true
// 9|4|true
- split():把一个字符串分割为数组
var arr="day day up";
//使用空格符作为分隔符
console.log(arr.split(" "));//[ 'day', 'day', 'up' ]
//使用字符串"a"作为分隔符
console.log(arr.split("a"));//[ 'd', 'y d', 'y up' ]
console.log(arr);//"day day up"