• JS数组常用方法---16、Array.from()方法


    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>
     
  • 相关阅读:
    小米、华为与联想,背后隐含的三种模式(转)
    怎样使用jstack诊断Java应用程序故障(转)
    多线程中的死锁举例与分析(转)
    log4j的性能瓶颈定位与性能优化(org.apache.log4j.spi.RootLogger) (转)
    一个与Log4j相关的死锁(转)
    怎样取消shutdown关机命令?-shutdown命令的使用解析
    对软件体系结构的认识
    39个让你受益的HTML5教程
    5大AR应用窥探移动未来~你见过吗?
    Response.AddHeader使用实例
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/12683555.html
Copyright © 2020-2023  润新知