JavaScript Array（数组） 对象

在 JavaScript 中，数组不是基本类型，而是具有以下核心特征的 Array 对象：

JavaScript 数组是可调整大小的，并且可以包含不同的数据类型。（当不需要这些特征时，可以使用类型化数组。）
JavaScript 数组不是关联数组，因此，不能使用任意字符串作为索引访问数组元素，但必须使用非负整数（或它们各自的字符串形式）作为索引访问。
JavaScript 数组的索引从 0 开始：数组的第一个元素在索引 0 处，第二个在索引 1 处，以此类推，最后一个元素是数组的 length 属性减去 1 的值。
JavaScript 数组复制操作创建浅拷贝。（所有 JavaScript 对象的标准内置复制操作都会创建浅拷贝，而不是深拷贝）。

数组下标

Array 对象不能使用任意字符串作为元素索引（如关联数组），必须使用非负整数（或它们的字符串形式）。通过非整数设置或访问不会设置或从数组列表本身检索元素， 但会设置或访问与该数组的对象属性集合相关的变量。数组的对象属性和数组元素列表是分开的，数组的遍历和修改操作不能应用于这些命名属性。

数组元素是对象属性，就像 toString 是属性一样（具体来说，toString() 是一种方法）。然而，尝试按以下方式访问数组的元素会抛出语法错误，因为属性名无效：

1
2
console.log(arr.0); // a syntax error

JavaScript 语法要求使用方括号表示法而不是点号表示法来访问以数字开头的属性。也可以用引号包裹数组下标（例如，years[‘2’] 而不是 years[2]），尽管通常没有必要。

JavaScript 引擎通过隐式的 toString，将 years[2] 中的 2 强制转换为字符串。因此，‘2’ 和 ‘02’ 将指向 years 对象上的两个不同的槽位，下面的例子可能是 true：

1
2
console.log(years['2'] !== years['02']);

只有 years[‘2’] 是一个实际的数组索引。years[‘02’] 是一个在数组迭代中不会被访问的任意字符串属性。

长度与数值属性的关系

JavaScript 数组的 length 属性和数值属性是连接的。

一些内置数组方法（例如 join()、slice()、indexOf() 等）在被调用时会考虑到数组的 length 属性的值。

其他方法（例如，push()、splice() 等）也会更新数组的 length 属性。

1
2
3
4
const fruits = [];
fruits.push('banana', 'apple', 'peach');
console.log(fruits.length); // 3

当在 JavaScript 数组上设置一个属性时，如果该属性是一个有效的数组索引并且该索引在数组的当前边界之外，引擎将相应地更新数组的 length 属性：

1
2
3
4
5
6
7
8
fruits[5] = 'mango';
console.log(fruits[5]);
// 'mango'
console.log(Object.keys(fruits));
// ['0', '1', '2', '5']
console.log(fruits.length);
// 6

增加 length。

1
2
3
4
5
6
7
8
9
fruits.length = 10;
console.log(fruits);
// ['banana', 'apple', 'peach', empty x 2, 'mango', empty x 4]
console.log(Object.keys(fruits)); // ['0', '1', '2', '5']
console.log(fruits.length);
// 10
console.log(fruits[8]);
// undefined

但是，减少 length 属性会删除元素。

1
2
3
4
5
fruits.length = 2;
console.log(Object.keys(fruits)); // ['0', '1']
console.log(fruits.length);
// 2

这将在 Array/length 页中进一步解释。

Array的对象方法

说明：部分是ECMAScript5的新特性（IE678不支持）

主要对一些新特性进行讲解

concat

concat作用是拼接数组，需要注意的是也可以把一个数组元素作为拼接的元素，如果这样的话，数组会被拉平，再和其它的元素拼接起来成为新的数组，但是不会被拉平两次，concat不会修改原数组。
例如

1
2
3
4
var arr=[1,2,3,4,5];
arr.concat([10,11],13);//[1,2,3,4,5,10,11,13]
arr.concat([1,[2,3]]);//[1,2,3,4,5,1,[1,3]]

slice

slice（a,b）a和b可以取负数，表示从a位置开始截取到b位置的一段数组，是一个左闭右开的区间，a和b可以取负数，如果是负数代表倒数第a/b个元素

1
2
3
4
5
6
var arr=[1,2,3,4,5];
arr.slice(1,3);//[2,3]
arr.slice(1);//[2,3,4,5]
arr.slice(1,-1);//[2,3,4]
arr.slice(-4,-3);//[2]

splice

splice删除元素并向数组添加新元素
object.splice(a)从左边开始删除a个元素
object.splice(a，b)从a位置开始截取其中的b个元素
object.splice(a，b，c，d)从a位置开始截取b个元素，并将c和d或者更多的元素插入原数组
需要注意的是splice会修改原数组

1
2
3
4
5
6
7
8
9
10
var arr=[1,2,3,4,5];
arr.splice(2);//[3,4,5]
arr;//[1,2];原数组被修改了
var arr=[1,2,3,4,5];
arr.splice(2，2);//[3,4]
arr;//[1,2,5];
var arr=[1,2,3,4,5];
arr.splice(1，1，‘a’，‘b’);//[2]
arr;//[1,"a","b",3,4,5];

foreach

foreach()函数从头到尾把数组遍历一遍。有三个参数分别是：数组元素，元素的索引，数组本身

1
2
3
4
5
6
7
8
9
10
11
var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a)
{//分别对应：数组元素，元素的索引，数组本身
console.log(x + '|' + index + '|' + (a === arr));
});
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true

说明：如果只有一个参数那这个参数代表数组元素，也就是数组的值，请看例2。

1
2
3
4
5
6
7
例2
var data=[1,2,3,4,5,6];
var sum=0;
data.forEach(function(v){//其中的v就是数组的值 123456
sum+=v;})
document.write(sum+"<br>");//打印出来是21

map

map 对数组做一些映射,map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组，它与forEach的区别是forEach为数组中的每个元素执行一次回调函数。

1
2
3
4
5
6
var arr = [1, 2, 3];
arr.map(function(x) {
return x + 10;
}); // [11, 12, 13]
arr; // [1, 2, 3]

filter

filter 过滤掉某些元素，和map有点类似，Array的filter也接收一个函数。但是和map不同的是， filter把传入的函数依次作用于每个元素，然后根据返回值是 true 还是false决定保留还是丢弃该元素，也就是过滤掉不符合要求的某些元素。

1
2
3
4
5
6
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
}); // returns [1, 4, 7, 8, 9, 10]
arr; // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

最后

以上就是饱满红牛最近收集整理的关于JavaScript Array（数组） 对象JavaScript Array（数组） 对象数组下标长度与数值属性的关系Array的对象方法的全部内容，更多相关JavaScript内容请搜索靠谱客的其他文章。