本文详细介绍了JavaScript中的Array对象，包括创建方法、属性、方法及其使用示例。此外还讲解了如何利用ECMAScript5的新特性进行数组迭代。
Array对象定义
Array对象用于在单个的变量中存储多个值
创建Array对象的语法:
new Array(); new Array(size); new Array(element0, element1, ..., elementn);
参数
参数 size 是期望的数组元素个数。返回的数组，length 字段将被设为 size 的值。
参数 element ..., elementn 是参数列表。当使用这些参数来调用构造函数 Array() 时，新创建的数组的元素就会被初始化为这些值。它的 length 字段也会被设置为参数的个数。
注释:
如果调用构造函数 Array() 时没有使用参数，那么返回的数组为空，length 字段为 0。
当调用构造函数时只传递给它一个数字参数，该构造函数将返回具有指定个数、元素为 undefined 的数组。
数组的检测方法
ECMAScript3做出规定,可以使用instanceo操作符来检测数组
<script type="text/javascript">
var nums=["one","two","three"];
//instanceof 如果检测是数组,返回true;若果不是数组,false
console.log(nums instanceof Array)//true
console.log(typeof nums)//object
</script>数组的转换方法
toLocaleString()、toString()和valueOf()方法。
实例:
<script type="text/javascript">
var nums=["one","two","three"];
//调用toLocaleString()与toString()方法相同
console.log(nums.toLocaleString())//one,two,three
//调用valueOf()方法，返回的还是这个数组。
//由于alert()要接收一个字符串参数，所以它会在后台调用toString()方法
alert(nums.valueOf());//one,two,three
console.log(nums.valueOf())//["one", "two", "three"]
//调用toString()方法，会返回数组中每个值的字符串形式拼接的以逗号分隔的字符串；
console.log(nums.toString())//one,two,three
//默认都会以逗号分隔字符串的形式返回数组项
</script>
Array 对象属性
| 属性 | 描述 |
|---|---|
| constructor | 返回对创建此对象的数组函数的引用。 |
| length | 设置或返回数组中元素的数目。 |
| prototype | 使您有能力向对象添加属性和方法。 |
Array 对象方法(方法具体说明参照http://www.w3school.com.cn/jsref/jsref_obj_array.asp)
| 方法 | 描述 |
|---|---|
| concat() | 连接两个或更多的数组，并返回结果。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。 |
| join() | 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 |
| pop() | 删除并返回数组的最后一个元素,如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值 |
| push() | 向数组的末尾添加一个或更多元素，并返回新的长度。它直接修改 arrayObject，而不是创建一个新的数组 提示：要想数组的开头添加一个或多个元素，请使用 unshift() 方法。 |
| slice() | 从某个已有的数组返回选定的元素,返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素。 |
| shift() | 删除并返回数组的第一个元素 说明: 如果数组是空的，那么 shift() 方法将不进行任何操作，返回 undefined 值。该方法不创建新数组，而是直接修改原有的 arrayObject。 |
| unshift() | 向数组的开头添加一个或更多元素，并返回新的长度。 |
| sort() | 对数组的元素进行排序 |
| splice() | 删除元素，并向数组添加新元素。 |
| toSource() | 返回该对象的源代码。 |
| toString() | 把数组转换为字符串，并返回结果。 |
| toLocaleString() | 把数组转换为本地字符串，并返回结果。arrayObject 的本地字符串表示。 说明: 首先调用每个数组元素的 toLocaleString() 方法，然后使用地区特定的分隔符把生成的字符串连接起来，形成一个字符串。 |
| reverse() | 颠倒数组中元素的顺序。 |
| valueOf() | 返回数组对象的原始值 |
示例:
- concat()方法:
语法
arrayObject.concat(arrayX,arrayX,......,arrayX)
| 参数 | 描述 |
|---|---|
| arrayX | 必需。该参数可以是具体的值，也可以是数组对象。可以是任意多个。 |
返回值
返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。
实例1:将参数连接到数组a中;
<script type="text/javascript">
var a = [1,2,3];
document.write(a.concat(4,5));
</script>输出:
1,2,3,4,5
实例2:两个数组连接
<script type="text/javascript">
var array_a=[1,2,3];
var array_b=[4,5];
console.log(array_a.concat(array_b));//[1, 2, 3, 4, 5]
</script>2. slice()方法，它能够基于当前数组中的一个或多个项创建一个新数组。
arrayObject.slice(start,end)
slice()方法接收一个或两个参数，即要返回的项的起始和结束位置；如果传入一个参数，则返回当前传入参数的位置到当前数组结束位置的新数组；如果传入两个参数，则返回起始和结束位置的新数组，但不包括结束位置的项，即前闭后开。注意：slice()不会影响原始数组。
返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素。
示例:
<script type="text/javascript">
var colors = ["red","green","blue","yellow","purple"];
var colors2 = colors.slice(1);
alert(colors2);//green,blue,yellow,purple
var colors3 = colors.slice(1,3);
alert(colors3);//green,blue 不包括位置3的"yellow"
</script>拓展：如果slice方法的参数中有负数，则用数组的长度加上该负数来确定起始和结束位置
<script type="text/javascript">
var colors = ["red","green","blue","yellow","purple"];
var colors2 = colors.slice(-2,0);
alert(colors2);//没有任何输出
var colors3 = colors.slice(-2,-1);//相当于colors.slice(colors.length-2,colors.length-1);即colors.slice(3,4);
alert(colors3);//yellow
</script>
3.splice()方法
语法
arrayObject.splice(index,howmany,item1,.....,itemX)
- 删除:可以删除任意数量的项,只需指定2个参数:要删除的第一项的位置(index)和要删除的项数(howmany).
如:splice(0,2);会删除数组中的前两项 - 插入:可以向指定位置插入任意数量的项,需提供三个参数:index,howmany,item(可选多个item...),
此时howmany一般为0.例如：splice(2,0,"red","green")会从当前数组的位置2开始插入字符串"red"和"green"。 - 替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项.
只需指定3个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如：splice(2,1,"red","green")会删除当前数组位置2的项，然后再从位置2开始插入字符串"red"和"green"。
注意：splice()方法始终返回一个数组，该数组包含从原始数组中删除的项，如果没有删除任何项，则返回一个空数组。
示例:
<script type="text/javascript">
var nums=["one","two","three"];
//----------1.splice(index,howmany) 删除--------------
var remove = nums.splice(0,1);//删除数组的第一项"one"
alert(nums);//two,three
alert(remove );//one
//如果删除的项的起始位置大于数组的长度
var remove1 = nums.splice(3,1);
alert(nums);//one,two,three(不做改变)
alert(remove1);//没有输入
//同时如果删除项的起始位置为负数
var remove2 = nums.splice(-1,1);//相当于nums.splice(nums.length-1,1);即nums.splice(2,1)
alert(nums);//one,two
alert(remove2);//three
//-----------2.splice(index,0,item...)插入--------------
var remove3 = nums.splice(1,0,"2","3");
alert(nums);//one,2,3,two,three
alert(remove3 );//空数组，因为splice的第二个参数是0
//----------3.splice(index,hwomany,item1,item2,...)替换--------------
var colors = ["red","green","blue"];
var replace = colors.splice(1,1,"red","purple");
alert(colors);//red,red,purple,blue
alert(replace);//green
</script>数组的迭代
ie7,ie8等支持ECMAScript3的浏览器使用常规的迭代语句:
for循环:
for (initialization; expression; post-loop-expression) statement例子：
iCount = 6;
for (var i = 0; i < iCount; i++) {
alert(i);
}
for-in 语句
for(propertyinexpression) statement
例子：
for (sProp in window) {
alert(sProp);
}
chrome,firefox,Ie9+等支持ECMAScript5的浏览器:
ECMAScript5提供5个迭代的方法。每个方法都接收两个参数：要在每一项上运行的函数和（可选的）运行该函数的作用域对象。传入方法中的函数接收三个参数：数组项的值、该项在数组中的位置和数组对象本身。
-
every()：对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true；
-
filter()：对数组中的每一项运行给定函数，返回该函数会返回true的项组成的数组；
-
forEach()：对数组中的每一项运行给定函数，这个方法没有返回值；
-
map()：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组；
-
some()：对数组中的每一项运行给定函数，如果该函数对任意一项返回true，则返回true。
示例:
<script type="text/javascript">
var numbers = [1,2,3,4,5,4,3,2,1];
//every循环numbers，判断数组numbers中的每一项是否都大于2
var everyResult = numbers.every(function(item,index,array){
return (item>2);
});
alert(everyResult);//false
//some循环numbers，判断数组numbers中项是否有大于2的项，如果有则返回true，否则返回false
var someResult = numbers.some(function(item,index,array){
return (item>2);
});
alert(someResult);//true
//filter循环numbers，判断数组numbers中大于2的项，将数组中大于2的项返回组成数组返回，如果没有则返回空数组
var filterResult = numbers.filter(function(item,index,array){
return (item>2);
});
alert(filterResult);//3,4,5,4,3
//forEach循环numbers，将数组numbers中的每一项都加1
var forEachResult = numbers.forEach(function(item,index,array){
array[index] = item+1;
});
alert(numbers);//2,3,4,5,6,5,4,3,2
//map循环numbers，将数组numbers中的每一项都乘以2，并返回计算后的数组
var mapResult = numbers.map(function(item,index,array){
return item*2;
});
alert(mapResult);//2,4,6,8,10,8,6,4,2
</script> --------------分割线
2017/ 04/06
扫一扫
1147
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
