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 数组方法整理出来了 - 知乎

相关推荐
前端摸鱼匠11 小时前
Vue 3 的toRefs保持响应性:讲解toRefs在解构响应式对象时的作用
前端·javascript·vue.js·前端框架·ecmascript
徐小夕@趣谈前端17 小时前
Web文档的“Office时刻“:jitword共建版2.0发布!让浏览器变成本地生产力
前端·数据结构·vue.js·算法·开源·编辑器·es6
小马_xiaoen17 小时前
Proxy 与 Reflect 从入门到实战:ES6 元编程核心特性详解
前端·javascript·ecmascript·es6
前端 贾公子1 天前
Node.js 如何处理 ES6 模块
前端·node.js·es6
你的代码我的心1 天前
微信开发者工具开发网页,不支持tailwindcss v4怎么办?
开发语言·javascript·ecmascript
菜鸟茜1 天前
ES6核心知识解析01:什么是ES6以及为什么需要ES6
前端·javascript·es6
前端摸鱼匠1 天前
Vue 3 的ref在响应式对象中:介绍ref在reactive对象中的自动解包
前端·javascript·vue.js·前端框架·ecmascript
jin4213522 天前
基于React Native鸿蒙跨平台一款阅读追踪应用完成进度条的增加与减少,可以实现任务的进度计算逻辑
javascript·react native·react.js·ecmascript·harmonyos
jin4213523 天前
React Native鸿蒙跨平台完成闪屏页作为移动应用的入口级页面,实现的二手置换应用闪屏页SecondhandSplash
javascript·react native·react.js·ecmascript·harmonyos
人机与认知实验室3 天前
<span class=“js_title_inner“>如何看待特斯拉第三代Optimus机器人?</span>
开发语言·javascript·机器人·ecmascript·unix