es6定义数组,es6数组添加元素,ES6 新增的创建数组的方法(小结)

es6定义数组,es6数组添加元素,ES6 新增的创建数组的方法(小结)

本文主要介绍了在ES6中创建数组的新方法,并通过示例代码进行了详细介绍。对大家的学习或工作都有一定的参考价值。有需要的朋友下面和边肖一起学习。

在ES6之前,有两种创建阵列的方法:

一: 通过数组字面量

设array=[1,2,3];

console.log(数组);//[1,2,3]

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

设array=new Array(1,2,3);

console.log(数组);//[1,2,3]

New Array()在大多数情况下工作良好:

设array=new Array(1,2);

控制台. log(array . length);//2

console . log(array[0]);//1

console . log(array[1]);//2

array=新数组(' a ');

控制台. log(array . length);//1

console . log(array[0]);//'a '

array=新数组(1,' a ');

控制台. log(array . length);//2

console . log(array[0]);//1

console . log(array[1]);//'a '

但是new Array()有一个奇怪的情况:

设Array=new Array(2);

console . log(array[0]);//未定义

console . log(array[1]);//未定义

控制台. log(array . length);//2

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

为了解决上述不安全问题,ES6引入了Array.of()来解决这个问题:

三:Array.of()

顾名思义,of()方法创建一个数组,数组中的参数作为元素接收。上述单个数字参数的情况也适用:

设array=array . of(3);

控制台. log(array . length);//1

console . log(array[0]);//3

array=Array.of(1,2);

控制台. log(array . length);//2

console . log(array[0]);//1

console . log(array[1]);//2

array=array . of(' a ');

控制台. log(array . length);//1

console . log(array[0]);//'a '

array=Array.of(1,' a ');

控制台. log(array . length);//2

console . log(array[0]);//1

console . log(array[1]);//'a '

四:Array.from()

ES6还添加了Array.from(),它也用于创建数组。主要用于基于类数组对象和迭代对象创建相应的数组。

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

最常见的类数组对象是function的arguments对象。接下来,让我们看一个数组,它包含用Array.from()创建的arguments元素:

函数createArrayFrom() {

console . log(arguments instance of Array);//假

返回Array.from(参数);

}

设array=createArrayFrom(1,2,3);

console.log(array的数组实例);//真

控制台. log(array . length);//3

console . log(array[0]);//1

console . log(array[1]);//2

console . log(array[2]);//3

console . log(array . index of(2));//1

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

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

让iteratorObject={

*[Symbol.iterator](){

产量1;

产量2;

产量3;

}

};

let array=array . from(iterator object);

console.log(array的数组实例);//真

控制台. log(array . length);//3

console . log(array[0]);//1

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

在前面的例子中,我们看到一个类数组对象和一个迭代对象作为Array.from()的第一个参数,从而创建了一个包含它们的元素的数组。Array.from()的第二个参数是一个函数,用来变换类Array对象和iterable对象的元素,然后把它们作为产生数组的元素,例如:

让iteratorObject={

*[Symbol.iterator](){

产量1;

产量2;

产量3;

}

};

let array=array . from(iterator object,(item)={ return item 1 });

console . log(array[0]);//2

console . log(array[1]);//3

console . log(array[2]);//4

在这个例子中,我们提供了将每个元素的值加1的转换,因此在原来的1,2,3被新数组替换后,元素是2,3,4。

六: Array.from()的第三个参数

Array.from()还提供了第三个可用参数,用于指定此。如果这在整个方法调用中使用,请看一个例子:

let firstHelper={

差异:1,

添加(值){

返回值this.diff

}

};

让secondHelper={

差异:2

};

函数createArrayFrom() {

返回Array.from(arguments,firstHelper.add,second helper);

}

设array=createArrayFrom(1,2,3);

console.log(数组);//[3, 4, 5]

在上面的例子中,我们的在add()方法中使用this(这行代码:value this . diff ), add()在firstHelper对象中定义,它也有一个diff属性。但是,我们的第三个参数被传入secondHelper,因此firstHelper.add()方法中的这个参数的值是secondhelper。

它们是ES6中新的Array.of()和Array.from()方法,可以让开发人员用更少的代码处理更多的变量数组创建场景。

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

相关文章阅读

  • es6语法菜鸟教程,babel转换es6原理
  • es6语法菜鸟教程,babel转换es6原理,利用babel将es6语法转es5的简单示例
  • ES6箭头函数,es6新特性箭头函数
  • ES6箭头函数,es6新特性箭头函数,关于ES6中的箭头函数超详细梳理
  • es6模板字符串怎么写样式,ES6中的模板字符串改变html
  • es6模板字符串怎么写样式,ES6中的模板字符串改变html,ES6之模版字符串的具体使用
  • es6数组扩展运算符,es6展开运算符,详解ES6 扩展运算符的使用与注意事项
  • es6定义数组,es6数组添加元素
  • es6...运算符,es6 扩展运算符 三个点(...)
  • es6 变量的解构赋值,es5实现解构赋值,ES6 解构赋值的原理及运用
  • ,,es6数组的flat(),flatMap()函数用法实例分析
  • commonjs和es6的module的区别,ES6 Modules 相对于 CommonJS 的优势是什么-
  • es6数组和对象的方法,使用es6方式实现伪数组转数组
  • es6修改数组中的某一项,es6数组添加元素
  • es6 set内部实现,es6 set原理
  • 留言与评论(共有 条评论)
       
    验证码: