JavaScript中的from
用法主要涉及到将其他数据类型转换为数组,这通常通过使用Array.from()
方法实现,它可以接受一个类数组对象(array-like object)或可迭代对象(iterable object),并将其转换为一个真正的数组。
Array.from()基础用法

参数说明
arrayLike: 一个类数组对象或可迭代对象。
mapFn(可选): 如果指定了该参数,新数组的每个元素会是回调函数调用后的值。
thisArg(可选): 当执行回调函数时,用作this
的值。
示例代码
// 将类数组对象转换为数组 const arrayLike = {0: 'a', 1: 'b', 2: 'c', length: 3}; const arr = Array.from(arrayLike); console.log(arr); // ['a', 'b', 'c'] // 使用映射函数 const arrWithMap = Array.from([1, 2, 3], x => x * 2); console.log(arrWithMap); // [2, 4, 6]
将字符串转换为字符数组
使用Array.from()
可以轻松地将字符串转换为字符数组,这对于处理字符串中的每个字符非常有用。
示例代码

const str = "hello"; const charArray = Array.from(str); console.log(charArray); // ['h', 'e', 'l', 'l', 'o']
将NodeList转换为数组
在操作DOM时,经常需要将NodeList转换为数组以利用数组的方法。
示例代码
const listItems = document.querySelectorAll('li'); const nodeListArray = Array.from(listItems); console.log(nodeListArray); // NodeList转数组
4. 使用thisArg作为回调函数的上下文
可以通过thisArg
参数来指定回调函数中的this
值。
示例代码
const obj = {a: 1, b: 2}; const entries = Object.entries(obj); const mappedEntries = Array.from(entries, function(entry) { return this[entry[0]]; }, obj); console.log(mappedEntries); // [1, 2]
结合生成器函数使用
Array.from()
也可以与生成器函数一起使用,以创建新的数组实例。
示例代码

function* generatorFunction() { yield 1; yield 2; yield 3; } const gen = generatorFunction(); const generatedArray = Array.from(gen); console.log(generatedArray); // [1, 2, 3]
相关问题与解答
问题1:Array.from()
和扩展运算符(...
)有什么区别?
解答:Array.from()
主要用于将类数组对象或可迭代对象转换为数组,而扩展运算符(...
)用于展开数组或可迭代对象,两者都可以用于合并数组,但Array.from()
还可以接受第二个参数作为映射函数,这是扩展运算符做不到的。
问题2: 如何将一个Set转换为数组?
解答: 可以使用Array.from()
方法将Set转换为数组。
const mySet = new Set([1, 2, 3]); const myArray = Array.from(mySet); console.log(myArray); // [1, 2, 3]
以上内容就是解答有关“from用法js”的详细内容了,我相信这篇文章可以为您解决一些疑惑,有任何问题欢迎留言反馈,谢谢阅读。
原创文章,作者:K-seo,如若转载,请注明出处:https://www.kdun.cn/ask/748416.html