首页 > 语言 > JavaScript > 正文

ES6 新增的创建数组的方法(小结)

2024-05-06 15:36:18
字体:
来源:转载
供稿:网友

在ES6之前,创建数组的方式有2种:

一: 通过数组字面量

let array = [1,2,3];console.log(array);//[1,2,3]

二: 通过new Array()创建数组

let array = new Array(1, 2, 3);console.log(array); //[1,2,3]

在大多数情况下new Array()运行良好:

let array = new Array(1, 2);console.log(array.length); //2console.log(array[0]); //1console.log(array[1]); //2array = new Array('a');console.log(array.length); //1console.log(array[0]);//'a'array = new Array(1, 'a');console.log(array.length); // 2console.log(array[0]);//1console.log(array[1]);//'a'

但是new Array()有一种诡异的情况:

let array = new Array(2);console.log(array[0]); // undefinedconsole.log(array[1]);// undefinedconsole.log(array.length); // 2 

当我们给new Array()传递单个数字参数时,这个数字不是作为数组元素,而是该数组的length属性而存在,而数组本身则是一个空数组。

为了解决上面这个令人类没有安全感的特性,ES6引入了Array.of()来解决这个问题:

三:Array.of()

顾名思义,of()方法就是以它接受到的参数作为元素来创造数组,上面我们说的单个数字参数的情况也同样适用:

let array = Array.of(3);console.log(array.length); // 1console.log(array[0]); // 3array = Array.of(1, 2);console.log(array.length);// 2console.log(array[0]); // 1console.log(array[1]);// 2array = Array.of('a');console.log(array.length);// 1console.log(array[0]);// 'a'array = Array.of(1, 'a');console.log(array.length); // 2console.log(array[0]);// 1console.log(array[1]);// 'a'

四:Array.from()

ES6还增加了一个Array.from(),也是用了创建一个数组。它主要用在以类数组对象和可迭代对象为蓝本,创建对应的数组。

1: Array.from(类数组对象)

我们最熟悉的类数组对象,应该就是function的arguments对象了。接下来,我们看一个用Array.from()创建包含arguments元素的数组:

function createArrayFrom() {  console.log(arguments instanceof Array); // false  return Array.from(arguments);}let array = createArrayFrom(1, 2, 3);console.log(array instanceof Array); // trueconsole.log(array.length); //3console.log(array[0]);//1console.log(array[1]);//2console.log(array[2]);//3console.log(array.indexOf(2)); //1

2: Array.from(可迭代对象)

Array.from()也可以把一个可迭代对象转换为数组:

let iteratorObject = {  *[Symbol.iterator](){    yield 1;    yield 2;    yield 3;  }};let array = Array.from(iteratorObject);console.log(array instanceof Array); // trueconsole.log(array.length); // 3console.log(array[0]); // 1

五:Array.from()的第二个参数

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选