ES6中Array.from()方法有什么用

小编给大家分享一下ES6中Array.from()方法有什么用，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！

Array.from()

Array.from方法用于将两类对象转为真正的数组：类数组的对象（ array-like object ）和可遍历（ iterable ）的对象（包括 ES6 新增的数据结构 Set 和Map ）。

let arrayLike = {    '0': 'a',    '1': 'b',    '2': 'c',    length: 3  };  // ES5 的写法  var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']  // ES6 的写法  let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']    // NodeList 对象  let ps = document.querySelectorAll('p');  Array.from(ps).forEach(function (p) {    console.log(p);  });  // arguments 对象  function foo() {  var args = Array.from(arguments);  // ...  }  //字符串转换为字符数组str.split('')  Array.from('hello')  // ['h', 'e', 'l', 'l', 'o']  let namesSet = new Set(['a', 'b'])  Array.from(namesSet) // ['a', 'b']    Array.from({ length: 3 });  // [ undefined, undefined, undefined ]

对于还没有部署该方法的浏览器，可以用Array.prototype.slice方法替代：

const toArray = (() =>  Array.from ? Array.from : obj => [].slice.call(obj))();

Array.from还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。

Array.from(arrayLike, x => x * x);  //  等同于  Array.from(arrayLike).map(x => x * x);  Array.from([1, 2, 3], (x) => x * x)  // [1, 4, 9]  //Array.from回调函数var arr1 = Array.from([1,2,3], function(item){    return item*item;});var arr2 = Array.from([1,2,3]).map(function(item){    return item*item;});var arr3 = Array.from([1,2,3], (item) => item*item);console.log(arr1); //[ 1, 4, 9 ]console.log(arr2); //[ 1, 4, 9 ]console.log(arr3); //[ 1, 4, 9 ]

值得提醒的是，扩展运算符（...）也可以将某些数据结构转为数组。

// arguments 对象  function foo() {    var args = [...arguments];  }  // NodeList 对象  [...document.querySelectorAll('div')]

看完了这篇文章，相信你对"ES6中Array.from()方法有什么用"有了一定的了解，如果想了解更多相关知识，欢迎关注行业资讯频道，感谢各位的阅读！