网站设计的就业和发展前景,制作网页超文本标记语言为,廊坊网站建设服务,如何在云主机上建设网站#x1f601; 作者简介#xff1a;一名大四的学生#xff0c;致力学习前端开发技术 ⭐️个人主页#xff1a;夜宵饽饽的主页 ❔ 系列专栏#xff1a;JavaScript小贴士 #x1f450;学习格言#xff1a;成功不是终点#xff0c;失败也并非末日#xff0c;最重要的是继续… 作者简介一名大四的学生致力学习前端开发技术 ⭐️个人主页夜宵饽饽的主页 ❔ 系列专栏JavaScript小贴士 学习格言成功不是终点失败也并非末日最重要的是继续前进的勇气 前言 本文是关于Array.from方法和Array.of方法的运用这是一种创建数组和类型转化成数组的方法,希望可以帮助到大家欢迎大家的补充和纠正 文章目录 8.2 Array.from()8.2.1 含义8.2.3 应用8.2.4 实例 8.3 Array.of()8.3 最后 8.2 Array.from()
8.2.1 含义
Array.from方法用于将两类对象转为真正的数组
类似数组的对象比如DOM操作返回的NodeList集合以及函数内部的arguments对象可遍历iterable对象包括ES6新增的数据结构Set和Map)
Array.from 还可以接受第二个参数作用类似于数组的map方法用来对每个元素进行处理将处理后的值放入返回的数组
Array.from(arrayLike,xx*x)//等同于
Array.from(arrayLike).map(x x*x)⭐️ Array和扩展运算符的区别
先解释何为类似数组对象的本质特征只有一点即必须有 length属性
扩展运算符 其背后调用的是遍历器接口Symbo.iterator如果一个对象没有部署该接口就无法转换
Array.from() 其是支持类似数组对象任何有length对象都可以通过Array.from方法转换为数组扩展运算符是无法转换这种情况的
Array.from({ length:3 })
//[undefined,undefined,undefined]8.2.3 应用
Array.from()可以将各种值转为真正的数组并且提供map功能。这实际上意味着只要有一个原始数据结构就可以先对它的值进行处理然后转成规范的数组结构在使用数组方法进行操作Array.from()可以将字符串转为数组然后返回字符串的长度因为它可以正确处理各种Unicode字符可以避免JavaScript将大于 、uFFFF的Unicode字符算作2个字符的bug
8.2.4 实例
//传入字符串
let strfoo
let ex1Array.from(str)
console.log(ex1)//传入Set类型的
const setnew Set([foo,bar,baz,foo])
let ex2Array.from(set)
console.log(ex2)//传入Mao类型
const mappernew Map([[1,2],[2,4],[4,8]
])
let ex3Array.from(mapper)
console.log(ex3)//传入类数组对象
function f(){return Array.from(arguments)
}let ex4f(1,2,3)
console.log(ex4)8.3 Array.of() 描述 将一组值转为数组
Array.of(3,2,6) //[326]使用细节
这个方法主要是用于弥补数组构造函数Array()的不足因为参数个数不同会导致Array()的行为差异
Array(3) //[, , ,]
Array(3,11,8) //[3,11,8]Array只有当参数个数不少于2个时Array()才会返回有参数组成的新数组
Array.of 基本上可以用来替代Array()或 new Array()
8.3 最后
下面推荐的两篇文章可以补充和扩展文章中涉及的知识点
JavaScript的数组的扩展【ES6的标准入门】JavaScript中Set、Map与弱引用版本WeakSet和WeakMap优雅的数据管理技巧
