ES6中新增Array.of()函数的用法详解

new Array()方法

ES6为Array增加了of函数用一种明确的含义将一个或多个值转换成数组。因为用new Array()构造数组的时候,是有二意性的。

构造时,传一个参数,实际上是指定数组的长度,表示生成多大的数组。

构造时,传多个参数,每个参数都是数组的一个元素。

javascript 复制代码
const arr1 = new Array()
const arr2 = new Array(5)
const arr3 = new Array(1, 3, '白色', {p1: 'v1'})
console.log('%s', JSON.stringify(arr1))
console.log('%s', JSON.stringify(arr2))
console.log('%s', JSON.stringify(arr3))

输出结果:

Array.of()方法

ES6增加的Array.of()方法,只有一个含义,of的参数就是表示转换后数组的元素。

JavaScript中Array对象是一个全局对象,可在所有位置进行调用。Array.of()方法创建一个具有可变数量参数的新数组实例。

Array.of() 总是返回参数值组成的数组,用于将一组值,转换为数组。这个方法的主要目的,是弥补数组构造函数Array()的不足。因为参数个数的不同,会导致Array()的行为有差异。

javascript 复制代码
const arr4 = Array.of()
const arr5 = Array.of(5)
const arr6 = Array.of(1, 3, '白色', {p1: 'v1'})
console.log('%s', JSON.stringify(arr4))
console.log('%s', JSON.stringify(arr5))
console.log('%s', JSON.stringify(arr6))

输出结果:

这就是用of生成数组的好处,含义一致。

Array.of基本上可以用来替代Array()或new Array(),并且不存在由于参数不同而导致的重载,它的行为非常统一。

参考资料

Array.of() - JavaScript | MDN | Array.of方法详解_笔记大全_设计学院

JS数组的 Array.of() 和 Array.from() 方法的使用 | 重磅!超详细的 JS 数组方法整理出来了 - 知乎

相关推荐
酉鬼女又兒3 小时前
零基础快速入门前端ES6 核心特性详解:Set 数据结构与对象增强写法(可用于备赛蓝桥杯Web应用开发)
开发语言·前端·javascript·职场和发展·蓝桥杯·es6
酉鬼女又兒5 小时前
零基础快速入门前端蓝桥杯Web考点深度解析:var、let、const与事件绑定实战(可用于备赛蓝桥杯Web应用开发)
开发语言·前端·javascript·职场和发展·蓝桥杯·es6·html5
还是大剑师兰特7 小时前
vueup/vue-quill 详细介绍(Vue3 富文本编辑器)
javascript·vue.js·ecmascript
xuankuxiaoyao10 小时前
VUE.JS实践--事件对象和计算属性
javascript·vue.js·ecmascript
zzginfo11 小时前
JavaScript 假值示例详解
开发语言·前端·javascript·ecmascript
天真萌泪20 小时前
JS逆向自用
开发语言·javascript·ecmascript
我命由我123451 天前
React - 类组件 setState 的 2 种写法、LazyLoad、useState
前端·javascript·react.js·html·ecmascript·html5·js
榴莲omega1 天前
第10天:手写 bind 与 柯里化 | 从疑惑到通透
开发语言·javascript·ecmascript·bind·柯里化
酉鬼女又兒1 天前
零基础快速入门前端深入掌握箭头函数、Promise 与 Fetch API —— 蓝桥杯 Web 考点全解析(可用于备赛蓝桥杯Web应用开发)
开发语言·前端·css·职场和发展·蓝桥杯·es6·js
我命由我123451 天前
React - useEffect、useRef、Fragment
开发语言·前端·javascript·react.js·前端框架·ecmascript·js