小编给大家分享一下ES6中Array.from()方法有什么用,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!
北票ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为成都创新互联的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:18980820575(备注:SSL证书合作)期待与您的合作!
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()方法有什么用”有了一定的了解,如果想了解更多相关知识,欢迎关注创新互联行业资讯频道,感谢各位的阅读!