JS数组常用方法---16、Array.from()方法
一、总结
一句话总结:
Array.from()方法的作用是将类数组或可迭代对象转换为数组,比如String、Map、伪数组等,必带的参数是arrayLike(想要转换成数组的伪数组对象或可迭代对象),Array.from()方法的返回值是新的数组实例,不影响原结构
Array.from() 作用:将类数组或可迭代对象转换为数组 参数:必带的arrayLike(想要转换成数组的伪数组对象或可迭代对象) 返回值:新的数组实例 是否影响原结构:不影响 //4、从类数组对象(arguments)生成数组 function f() { console.log(arguments); console.log(Array.from(arguments)); // [ 1, 2, 3 ] } f(1, 2, 3);
1、Array.from()方法的作用对象是什么?
Array.from()方法的作用是将类数组或可迭代对象转换为数组,比如String、Map、伪数组等
//1、从 String 生成数组 let arr1=Array.from('foo'); console.log(arr1);// [ "f", "o", "o" ]
二、Array.from()方法
博客对应课程的视频位置:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Array.from()方法</title> 6 </head> 7 <body> 8 <!-- 9 Array.from()方法的作用是将类数组或可迭代对象转换为数组,比如String、Map、伪数组等,必带的参数是arrayLike(想要转换成数组的伪数组对象或可迭代对象),Array.from()方法的返回值是新的数组实例,不影响原结构 10 11 Array.from() 12 作用:将类数组或可迭代对象转换为数组 13 参数:必带的arrayLike(想要转换成数组的伪数组对象或可迭代对象) 14 返回值:新的数组实例 15 是否影响原结构:不影响 16 --> 17 <script> 18 //1、从 String 生成数组 19 // let arr1=Array.from('foo'); 20 // console.log(arr1);// [ "f", "o", "o" ] 21 22 //2、从 Set 生成数组 23 // const set = new Set(['foo', 'bar', 'baz', 'foo']); 24 // let arr2=Array.from(set); 25 // console.log(arr2);// [ "foo", "bar", "baz" ] 26 27 //3、从 Map 生成数组 28 // const map = new Map([[1, 2], [2, 4], [4, 8]]); 29 // console.log(map);// {1 => 2, 2 => 4, 4 => 8} 30 // let arr3=Array.from(map); 31 // console.log(arr3);// [[1, 2], [2, 4], [4, 8]] 32 33 // const mapper = new Map([['1', 'a'], ['2', 'b']]); 34 // console.log(mapper);// {"1" => "a", "2" => "b"} 35 // let arr4=Array.from(mapper.values()); 36 // console.log(arr4);// ['a', 'b']; 37 38 // let arr5=Array.from(mapper.keys()); 39 // console.log(arr5);// ['1', '2']; 40 41 42 43 //4、从类数组对象(arguments)生成数组 44 // function f() { 45 // console.log(arguments); 46 // console.log(Array.from(arguments)); // [ 1, 2, 3 ] 47 // } 48 // console.log(Array); 49 // console.log(Array.from); 50 // console.log(Array.prototype); 51 // console.log([]); 52 // f(1, 2, 3); 53 54 </script> 55 </body> 56 </html>