作用

将 类似数组对象 和 可遍历对象 转换为真正的数组。

1.类似数组对象

1.1 有length属性的对象

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
}

Array.from(arrayLike); //['a', 'b', 'c']

ES5也是存在可以将上面的类似数组对象转为真正的数组对象

[].slice.call(arrayLike)

1.2 DOM操作返回的NodeList集合

let ps = document.querySelectorAll('p');
Array.from(ps).foreach(function(p){
    console.log(p);
});

扩展运算符（...）也可以转换

[...document.querySelectorAll('div')]

1.3 函数内部的arguments对象

function foo() {
    var args = Array.from(arguments);
}

同样扩展运算符(...)也可以实现

function foo(){
    var args = [...arguments];
}

总结

扩展运算符(...)不可以将有length属性的对象转换为数组。(...)可以将NodeList集合和arguments对象转换为数组。

2.可遍历对象

部署了Iterator接口的数据结构，包括新增的数据结构Set和Map。

2.1 字符串

Array.from('hello');
//['h','e','l','l','o']

2.2 Set

let nameSet = new Set(['a', 'b']);
Array.from(nameSet);//['a', 'b']

第二个参数

作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。

Array.from(arrayLike, x => x * x);

Array.from(arrayLike).map(x => x * x);