JS集合引用类型之 Array

Array

一、创建数组

1、使用Array构建函数

let colors = new Array();
// 创建一个初始length为20的数组
let arr = new Array(20);
// 传入要保存的数组元素
let arr1 = new Array('red', '1', 1);

2、省略new操作符，结果一致

let arr = Array(2);

3、数组字面量（不会调用Array构造函数）

let arr = ['red', 'green', 'white'];
let arr1 = [];
let arr2 = [1, 2];

二、from()和of()方法

ES6新增的用于创建数组的静态方法
from(): 将类数组结构转换为数组实例
of(): 将一组参数转换为数组实例
场合：

from

1、字符串拆分成数组

Arrar.from('zdx');       // ['z', 'd', 'x']

2、将集合和映射转换为一个新数组

const m = new Map().set(1, 2).set(3, 4);
const n = new Set().add(1).add(2).add(3).add(4);
Array.from(m);           //[[1,2],[3,4]]
Array.from(n);           //[1,2,3,4]

3、对数组浅复制

const a1 = [1, 2, 3, 4];
const a2 = Array.from(a1);
console.log(a1);           // [1, 2, 3, 4]
alert(a1 === a2);          // false 

4、可以使用任何可迭代对象

const iter = {
 *[Symbol.iterator]() {
 yield 1;
 yield 2;
 yield 3;
 yield 4;
 }
};
console.log(Array.from(iter)); // [1, 2, 3, 4]

5、对象轻松地转换为数组

function getArgsArray() {
  return Array.from(arguments);
}
console.log(getArgsArray(1, 2, 3, 4))    //[1, 2, 3, 4]

of

将一组参数转换为数组

Array.of(1,2,3,4)   // [1,2,3,4]
Array.of(undefined)  // [undefined]

三、数组空位

const options = [,,,,,];    // 创建包含 5 个元素的数组

注意：由于行为不一致和存在性能隐患，因此实践中要避免使用数组空位。如果确实需要
空位，则可以显式地用 undefined 值代替。

四、数组索引

数组 length 属性的独特之处在于，它不是只读的。通过修改 length 属性，可以从数组末尾删除或添加元素：

let colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组
colors.length = 2;
alert(colors[2]); // undefined

使用length属性也可以方便地向数组末尾添加元素，如

let colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组
colors[colors.length] = "black"; // 添加一种颜色（位置 3）
colors[colors.length] = "brown"; // 再添加一种颜色（位置 4）

数组中最后一个元素的索引始终是 length - 1，因此下一个新增槽位的索引就是 length。
新的长度会在新增元素被添加到当前数组外部的位置上时自动更新。换句话说，就是 length 属性会更新为位置加上 1。

let colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组
colors[99] = "black"; // 添加一种颜色（位置 99）
alert(colors.length); // 100 

五、检测数组

1、value instanceof Array
2、Array.isArray(value)

六、迭代器方法

在Array原型上暴露了3个用于检索数组内容的方法：key()、values()、entries()
key() 返回数组索引的迭代器；
value() 返回数组元素的迭代器；
entries() 返回数组索引,元素的迭代器；
eg:

const a1 = ["foo", "bar", "baz", "qux"];
a1.keys();

const a = ["foo", "bar", "baz", "qux"];
Array.from(a.key());     // [1, 2, 3, 4]
Array.from(a.values());    // ["foo", "bar", "baz", "qux"]
Array.from(a.entries());   

七、复制和填充方法

fill()：填充数组，向一个已有的数组中插入全部或部分相同的值，开始索引用于指定开始填充的位置。
第二个参数：开始填充位置；
第三个参数：结束填充位置；

const zeroes = [0, 0, 0, 0, 0];
zeroes.fill(5);        // [5, 5, 5, 5, 5]
zeroes.fill(6, 3);       // [5, 5, 5, 6, 6]    
zeroes.fill(0); 
zeroes.fill(6, 1, 3);       // [0, 6, 6, 0, 0]  

copyWithin()：批量复制，从第几个开始复制，替换掉后面的

let arr =  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.copyWithin(5)        //[0, 1, 2, 3, 4, 0, 1, 2, 3, 4]

也可以指定从数组的第几个到第几个

let arr =  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.copyWithin(4, 0, 3)     // [0, 1, 2, 3, 0, 1, 2, 7, 8, 9]

…