携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第 3 天,点击查看活动详情
数组:可以存储任意类型的数据,可以是字符串、数值、对象等。
创建数组
1、使用new关键字和Array构造函数
- 创建一个空数组
let colors = new Array(); // []
- 给Array构造函数传入一个数值 创建指定长度的数组,数组的length属性会被自动创建并设置成这个值
let colors = new Array(20); // [empty × 20];
console.log(colors.length); // 20
- 给Array构造函数传入保存的元素 会创建包含这些元素的数组
let colors = new Array("red", "blue", "green");
注意这里会有一个问题:
给Array构造函数传入一个值,如果这值是数值,那么就会创建长度为指定数值的数组;参数如果是其他类型的,则会创建一个只包含这个值的数组。
let colors = new Array(3); // 创建一个包含 3 个元素的数组
let names = new Array("Greg");//创建一个只包含一个元素,即字符串"Greg"的数组
2、使用数组字面量表示发 数组字面量是在中括号中包含以 逗号分隔的元素列表
letcolors=["red","blue","green"]; //创建一个包含3个元素的数组
let names = []; // 创建一个空数组
let values = [1,2,]; // 创建一个包含 2 个元素的数组
3、 ES6 新增的用于创建数组的静态方法
- from() 用于将类数组结构转换为数组实例
类数组对象,即任何可迭代的结构, 或者有一个 length 属性 和可索引元素的结构。
还接收第二个可选的映射函数参数
还可以接收第三个可选参数,用于指定映射函 数中 this 的值。但这个重写的 this 值在箭头函数中不适用。
- of() 用于将一组参数转换为数组实例。
这个方法用于替代在ES6之前常用的Array.prototype.slice.call(arguments),一种异常笨拙的将 arguments 对象转换为数组的写法
数组空位
使用数组字面量初始化数组时,可以使用一串逗号来创建空位(hole)。ECMAScript 会将逗号之间 相应索引位置的值当成空位,ES6 规范重新定义了该如何处理这些空位
ES6 新增方法普遍将这 些空位当成存在的元素,只不过值为 undefined:
由于行为不一致和存在性能隐患,因此实践中要避免使用数组空位。如果确实需要 空位,则可以显式地用 undefined 值代替。
数组索引
要取得或设置数组的值,需要使用中括号并提供相应值的数字索引
let colors = ["red", "blue", "green"]; // 定义一个字符串数组
alert(colors[0]);// 显示第一项
colors[2] = "black";// 修改第三项
colors[3] = "brown";// 添加第四项
如果索引小于数组包含的元素数,则返回存储在相应位置 的元素;
如果把一个值设置给超过数组最大索引的索引,就像示例中的colors[3],则数组长度会自动扩 展到该索引值加 1 (索引是3,数组长度是4)
数组中元素的数量保存在length属性中, length属性的独特之处在于,它不是只读,可以通过修改length长度,从数组末尾删除或添加元素;添加元素是以undefined填充。
检测数组
- instanceof 操作符
- Array.isArray()
如果只有一个全局作用域的话: 使用 instanceof 操作符就可以
if(value instanceof Array) {
// 操作数组
}
如果网页里有多个框架,则可能涉及两 个不同的全局执行上下文,因此就会有两个不同版本的 Array 构造函数。如果要把数组从一个框架传 给另一个框架,则这个数组的构造函数将有别于在第二个框架内本地创建的数组。
ECMAScript 提供了 Array.isArray()方法。这个方法的目的就是确定一个值是 否为数组,而不用管它是在哪个全局执行上下文中创建的。
if (Array.isArray(value)){
// 操作数组
}
迭代器方法
在 ES6 中,Array 的原型上暴露了3个用于检索数组内容的方法:keys()、values()和 entries()。
- keys()返回数组索引的迭代器
let arr = [2,3,4,5]
console.log(arr.keys()); // Array Iterator {} 数组索引的迭代器
console.log(Array.from(arr.keys())) // [0, 1, 2, 3]
for(let item in arr.keys()){
console.log('item', item)
}
- values()返回数组元素的迭代器
let arr = [2,3,4,5]
console.log(Array.from(arr.values())) // [2, 3, 4, 5]
- entries()返回 索引/值对的迭代器
let arr = [2,3,4,5]
console.log(Array.from(arr.entries())) // [[0, 2], [1, 3], [2, 4], [3, 5]]