Array.from和 Array.of

（Array.from和 Array.of）

ES6新增了很多数组操作的方法。但是，Array.from和Array.of 并不在数组的原型对象上。或者说，并不是一个动态的方法。

所以，我们是不可以直接在数组上去调用这个方法的。

const arr = ["one", "two"];

arr.from() //报错 类数组对象 我们常常说到的类数组对象类数组对象，那么，什么是类数组对象呢？

• 吃饭
• 睡觉
• 打豆豆
• 刷牙
• 吃宵夜

image

我们可以看到这个对象的构造器并不是我们的Array，而是NodeList。那么，我们说，这种带有length属性。构造器却不是Array的对象就叫做类数组对象。

那么实际上，我们常常需要去使用数组的方法，去操作这些类数组对象。

例如，我现在需要取得上例的todo。将内容存起来。

上例运行后将会直接报错，因为类数组对象不是数组对象，并不具备我们的map方法。 那么，如何去实现调用map方法呢？

Array.from() 在ES6当中,我们可以通过使用Array.from()来将类数组对象直接转换成数组对象。

const list = document.querySelectorAll('li');
var listArr = Array.from(list);
const todos = listArr.map(val => val.innerText);
复制代码

当然，这样写总感觉代码还不够美观。那么其实，Array.from有第二个参数，第二个参数就类似的是我们的map方法。

const list = document.querySelectorAll('li');
const todos = Array.from(list,val => val.innerText);
console.log(todos)
复制代码

Array.of() 我们知道，在我们使用数组的构造器函数去新建一个数组的时候。

var arr = new Array(10);

传入一个参数的时候，将会生成数组的长度。

var arr = new Array(1,2,3); console.log(arr);//[1,2,3]; 将会生成一个数组。

那么ES6就为了避免这种情况发生，设计了Array.of()。来使无论传入多少个参数，都可以直接生成一个数组。

var arr = Array.of(1); console.log(arr); //[1]; var arr1 = Array.of(2,3); console.log(arr1); //[2,3];

转载于:https://juejin.im/post/5c6e9f55e51d4572c9580fbb