首页 > 代码库 > JS引用类型（2）——Array类型
JS引用类型（2）——Array类型
【2】Array类型
ECMAScript数组的每一项可以保存任何类型的数据，并且大小是可以动态调整的，即可以随着数据的添加自动增长以容纳新增数据。
（1）创建数组
1》使用Array构造函数
var colors = new Array();var colors = new Array(20);var colors = new Array("red","blue","green");var colors = Array(3);var colors = Array("Greg");
2》使用数组字面量
var colors = ["red","blue","green"];var colors = [];var colors = [1,2,];//不推荐使用，会创建一个包含2或3项的数组var colors = [,,,,,];//不推荐使用，会创建一个包含5或6项的数组
与对象一样，使用数组字面量表示法时，也不会调用Array构造函数。
（2）数组length属性
数组的length属性不只是可读的。通过设置这个属性，可以从数组的末尾移除项或向数组中添加新项。
var colors = ["red","blue","green"];colors.length = 2; //移除最后一项alert(colors[2]); //undefinedvar colors = ["red","blue","green"];colors.length = 4; //数组不存在位置3alert(colors[4]); //undefinedvar colors = ["red","blue","green"];colors[colors.length] = "black"; //在位置3添加一种颜色colors[colors.length] = "brown"; //在位置4添加一种颜色
（3）检测数组
1》instanceof操作符：确定某个对象是不是数组
if(value instanceof Array){//对数组执行某些操作}
2》Array.isArray()方法：确定某个值到底是不是数组
if(Array.isArray(value)){//对数组执行某些操作}
IE 9+和其他浏览器支持此方法。
（4）转换方法
1》前文讲到Object对象都有toLocalString()、toString()、valueOf()方法
- toLocaleString()方法：返回对象的字符串表示，该字符串与执行环境的地区对应。
- toString()方法：返回对象的字符串表示。
- valueOf()方法：返回对象的原始值，可能是字符串、数值或布尔值等。通常与toString()方法的返回值相同。
对数组而言：
- toString()方法：返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。
- valueOf()方法：返回对象的原始值。
var colors = ["red","blue","green"];console.log(colors.toString()); //red,blue,greenconsole.log(colors.toLocalString()); //red,blue,greenconsole.log(colors.valueOf()); //["red","blue","green"]console.log(colors); //["red","blue","green"]alert(colors.toString()); //red,blue,greenalert(colors.toLocalString()); //red,blue,greenalert(colors.valueOf()); //red,blue,greenalert(colors); //red,blue,green
alert()要接受字符串参数，所以会在后台调用toString()方法。
2》join()方法：使用不同分隔符来构建包含所有数组项的字符串
var colors = ["red","blue","green"];alert(colors.join(",")); //red,blue,greenalert(colors.join("||")); //red||blue||green
如果不给join方法传入任何值，或者给它传入undefined,则使用逗号作为分隔符。
如果数组中某一项的值是null或undefined，那么该值在join()、toLocalString()、toString()、valueOf()方法返回的结果中以空字符串表示。
（5）栈方法：LIFO后进先出；在栈的顶部插入，移除
1》push()方法：可以接受任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。
2》pop()方法：从数组末尾移除最后一项，减少数组的length值，然后返回移除的项。
var colors = new Array();var count = colors.push("red","green");alert(count); //2count = colors.push("blue");alert(count); //3var item = colors.pop();alert(item); //"blue"alert(colors.length); //2
（6）队列方法：FIFO先进先出；队列在列表的末端添加项，从列表的前端移除项
1》push()方法：可以接受任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。
2》shift()方法：移除数组中的第一项并返回该项，同时将数组长度减1。
var colors = new Array();var count = colors.push("red","green");alert(count); //2count = colors.push("blue");alert(count); //3var item = colors.shift();alert(item); //"red"alert(colors.length); //2
3》unshift()方法：在数组前端添加任意个项并返回新数组的长度。
使用unshift()和pop()方法，可以从相反方向来模拟队列，即在数组的前端添加项，从数组末端移除项。
var colors = new Array();var count = colors.unshift("red","green");alert(count); //2count = colors.unshift("blue");alert(count); //3console.log(colors); //["blue","red","green"]var item = colors.pop();alert(item); //"green"alert(colors.length); //2
（7）重排序方法
1》reverse()方法：反转数组项顺序。
var values = [1,2,3,4,5];values.reverse();console.log(values); //[5,4,3,2,1]
2》sort()方法：按升序排列数组项。
var values = [0,1,5,10,15,6,25];values.sort(); //[0,1,10,15,25,5,6] 进行字符串比较
sort()方法可以接受一个比较函数作为参数。
function compare1(value1,value2){if(value1<value2){return -1;}else if(value1>value2){return 1;}else{return 0;}}function compare2(value1,value2){if(value1>value2){return -1;}else if(value1<value2){return 1;}else{return 0;}}function compare(value1,value2){return value2 - value1;}var values = [0,1,5,10,15,6,25];values.sort(compare1); //[0,1,5,6,10,15,25] values.sort(compare2); //[25,15,10,6,5,1,0] values.sort(compare); //[25,15,10,6,5,1,0]
（8）操作方法
1》concat()方法：基于当前数组中的所有项创建一个新数组。不会影响原始数组。
var colors = ["red","green","black"];var colors2 = colors.concat("yellow",["blue","brown"]);alert(colors); //red,green,blackalert(colors2); //red,green,black,yellow,blue,brown
2》slice()方法：基于当前数组中的一或多个项创建一个新数组。不会影响原始数组。
可以接受一或两个参数，即要返回项的起始和结束位置。
var colors = ["red","green","black"，"yellow","blue","brown"];var colors2 = colors.slice(1);var colors3 = colors.slice(1,4);alert(colors); //red,green,black,yellow,blue,brownalert(colors2); //green,black,yellow,blue,brownalert(colors3); //green,black,yellow
如果slice()方法的参数中有一个负数，则用数组长度加上该数来确定相应的位置。如果结束位置小于起始位置，则返回空数组。
3》splice()方法。
删除：可以删除任意数量的项，只需指定2个参数：要删除的第一项的位置和要删除的项数。
插入：可以向指定位置插入任意数量的项，只需提供3个参数：起始位置、0（要删除的项数）、要插入的项。如果要插入多个项，可以再传入第四、第五，以至任意多个项。
替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需提供3个参数：起始位置、要删除的项数、要插入的任意数量的项。插入的项数不必与删除的项数相等。
splice()方法始终都会返回一个数组，该数组包含从原始数组中删除的项（如果没有删除任何项，则返回一个空数组）。
var colors = ["red","green","blue"];var removed = colors.splice(0,1);alert(colors); //green,bluealert(removed); //redremoved = colors.splice(1,0,"yellow","orange");alert(colors); //green,yellow,orange,bluealert(removed); // 返回的是一个空数组removed = colors.splice(1,1,"red","purple");alert(colors); //green,red,purple,orange,bluealert(removed); //yellow
（9）位置方法
indexOf()和lastIndexOf()两个方法。都接收两个参数：要查找的项和表示查找起点位置的索引（可选的）。其中indexOf()方法从数组的开头开始向后查找，lastIndexOf()方法从数组的末尾开始向前查找。
这两个方法都返回要查找的项在数组中的位置，或者在没找到的情况下返回-1。在比较第一个参数与数组中的每一项时，会使用全等操作符，也就是说，要求查找的项必须严格相等。
var numbers = [1,2,3,4,5,4,3,2,1];alert(numbers.indexOf(4)); //3alert(numbers.lastIndexOf(4)); //5alert(numbers.indexOf(4,4)); //5alert(numbers.lastIndexOf(4,4)); //3var person = {name:"Nicholas"};var people = [{name:"Nicholas"}];var morePeople = [person];alert(people.indexOf(person)); //-1alert(morePeople.indexOf(person)); //0
（10）迭代方法
ECMAScript5为数组定义了5个迭代方法。
每个方法都接受两个参数：要在每一项上运行的函数和（可选的）运行该函数的作用域对象——影响this的值。
传入这些方法中的函数会接收三个参数：数组项的值、该项在数组中的位置和数组对象本身。
- every()：对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true。
- some()：对数组中的每一项运行给定函数，如果该函数对任一项返回true，则返回true。
- filter()：对数组中的每一项运行给定函数，返回该函数会返回true的项组成的数组。
- forEach()：对数组中的每一项运行给定函数，这个方法没有返回值。
- map()：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
以上方法都不会修改数组中的包含的值。
var numbers = [1,2,3,4,5,4,3,2,1];var everyResult = numbers.every(function(item,index,array){return (item>2);});alert(everyResult); //falsevar someResult = numbers.some(function(item,index,array){return (item>2);});alert(someResult); //truevar filterResult = numbers.filter(function(item,index,array){return (item>2);});alert(filterResult); //[3,4,5,4,3]var mapResult = numbers.map(function(item,index,array){return item*2;});alert(mapResult); //[2,4,6,8,10,8,6,4,2]var forEachResult = numbers.forEach(function(item,index,array){//执行某些操作});//类似于for循环
IE 9+和其他浏览器支持
（11）归并方法
reduce()和reduceRight()方法迭代数组所有项，然后构建一个最终返回的值。
其中，reduce()从数组的第一项开始，逐个遍历到最后。reduceRight()方法则相反。
这两个方法都接受两个参数：一个在每一项上调用的函数和（可选的）作为归并基础的初始值。
传入这些方法中的函数会接收四个参数：前一个值，当前值，项的索引和数组对象。
var values = [1,2,3,4,5];var sum = values.reduce(function(prev,cur,index,array){return prev+cur;});alert(sum); //15
IE 9+和其他浏览器支持
JS引用类型（2）——Array类型