数组
数据的有序列表,可以存放任意类型的数据,数组的大小可以动态调整。
数组的声明
数组字面量
var arr1 = []; //空数组
var arr2 = [1, 2, 3];
Array构造函数
当参数只有一个数值时,代表数组的长度。当有多个参数时,代表数组的元素
var arr1 = new Array(); //空数组
var arr2 = new Array(4); //长度为4的空数组
var arr3 = new Array(4, 5, 6);
console.log(arr3); //[4, 5, 6]
数组的赋值与取值
本质上数组属于一种特殊的对象。
console.log(typeof [1, 2, 3]); //'object'
数组的特殊性体现在,它的键名是按次序排列的一组整数(0,1,2,…)
var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); //["0", "1", "2"]
上面代码中,通过Object.keys
方法可以获得所有键名。数组的键名就是整数0、1、2。
数组成员的键名都是固定的,所以数组不用为每个元素指定键名,但对象的每个成员都必须指定键名。JS语言规定,对象的键名一律为字符串,所以数组的键名其实也是字符串,之所以可以用数值读取,是因为非字符串的键名会被转为字符串。
var arr = [1, 2, 3];
console.log(arr[1]); //2
console.log(arr['1']); //2
console.log(arr[1.00]); //2
上面代码中分别用数值和字符串作为键名,都能读取数组。原因是数值键名被自动转为了字符串。赋值时也是这样。
对象有两种读取成员的方法:点结构(object.key
)和方括号结构(object[key]
)。但是数组的键名,不能使用点结构,只能使用方括号。(方括号是运算符,可以接收数值)
var arr = [1, 2, 3];
arr.0 //SyntaxError: Unexpected number
数组的长度
length属性,获取或设置数组中元素的个数。是一个动态的值,等于键名中的最大整数加上1。JS使用一个32位整数保存数组的元素个数,所以数组最多只有 232−1 2 32 − 1 个。
console.log(arr.length);//获取数组中元素的个数
arr.length = 1; //设置数组中元素的个数
如果将length
设置为不合法的值,会报错
//负值
[].length = -1; //RangeError: Invalid array length
//大于等于2的32次方
[].length = Math.pow(2, 32);
//字符串
[].length = 'abc';
数组本质上是一种对象,所以可以为数组添加属性,但这不影响length
属性的值。
var a = [];
a['p'] = 'abc';
console.log(a.length); //0
a[2.1] = 'abc'
console.log(a.length); //0
上面代码中,将数组的键分别设为字符串和小数,结果都不影响length
属性。
如果数组的键名是添加超出范围的数值,该键名或自动转为字符串。
var arr = [];
arr[-1] = 'a';
arr[Math.pow(2, 32)] = 'b';
console.log(arr); //[-1: "a", 4294967296: "b"]
in运算符
检查某个键名是否存在,适用于对象,也适用于数组。
var arr = ['a', 'b', 'c', 'd'];
console.log(2 in arr); //true
console.log('2' in arr); //true
console.log(4 in arr); //false
如果数组的某个位置是空位,返回false
var arr = [];
arr[100] = 'a';
console.log(100 in arr); //true
console.log(1 in arr); //false
数组的遍历
for (var i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
console.log(arr.length); //0
示例:
将0-100之间的所有奇数放到数组中
var arr = [];
for (var i = 1; i <= 100; i++) {
if (i % 2 != 0) {
arr[i] = i;
}
}
//上面代码中,arr索引为偶数时,为undefined,这样的数组叫做稀疏数组。
var arr = [];
var j = 0;
for (var i = 1; i <= 100; i++) {
if (i % 2 != 0) {
arr[j] = i;
j++;
}
}
//新建一个变量存储索引
var arr = [];
for (var i = 1; i <= 100; i++) {
if (i % 2 != 0) {
arr[arr.length] = i;
}
}
//使用数组的length属性
数组的空位
当数组的某个位置是空元素时,称该数组存在空位。数组的空位不影响length
属性。空位是可以读取的,返回undefined
var a = [1, , 1];
console.log(a.length); //3
console.log(a[1]); //undefined
如果最后一个元素后面有逗号,并不会产生空位,有没有这个逗号,结果都是一样的。
var a = [1, 2, 3,];
console.log(a.length); //3
console.log(a); //[1, 2, 3]
使用delete
命令删除一个数组成员,会形成空位,并且不会影响length
属性。
var a = [1, 2, 3];
delete a[1];
console.log(a[1]); //undefined
console.log(a.length); //3
delete a[2];
console.log(a.length); //3
数组的某个位置是空位,与某个位置是undefined
是不一样的。如果是空位,使用forEach
方法、for...in
结构、以及Object.keys
方法进行遍历,空位都会被跳过。如果某个位置是undefined
遍历时不会被跳过。也就是说,空位就是数组没有这个元素,所以不会遍历到,undefined
表示数组有这个元素,值为undefined
,所以遍历不会跳过。
var a = [, , undefined];
a.forEach(function (x, i) {
console.log(i + '. ' + x);
});
//2. undefined
for (var i in a) {
console.log(i);
}
//2
console.log(Object.keys(a));
//["2"]
类似数组的对象
如果一个对象的所有键名都是正整数或零,并且有length
属性,那么这个对象就很像数组,语法称为“类似数组的对象”。但是类似数组的对象并不是数组,它们不具备数组特有的方法。
var o = {
0: 'a',
1: 'b',
length: 2
};
console.log(o[0]); //'a'
console.log(o.length); //2
o.push('c'); // TypeError: o.push is not a function
“类似数组的对象”的根本特征是具有length
属性,但是这个属性不是动态值,不会随着成员的变化而变化。
var o = {
length: 0
};
o[3] = 'd';
console.log(o.length); //0
典型的“类似数组的对象”有函数的arguments
对象,以及大多数DOM元素集,还有字符串。
//arguments对象
function args() {
return arguments;
}
var arrLike = args('a', 'b');
console.log(arrLike[0]); //'a'
console.log(arrLike.length); //2
console.log(arrLike instanceof Array); //false
//DOM元素集
var elts = document.getElementsByTagName('h3');
console.log(elts.length); //2
console.log(elts instanceof Array); //false
//字符串
console.log('abc'[1]); //'b'
console.log('abc'.length); //3
console.log('abc' instanceof Array); //false
数组的slice
方法可以将“类似数组的对象”变成真正的数组。
var arr = Array.prototype.slice.call(arrLike);
也可以通过call()
方法把数组的方法放到对象上面。