zoukankan      html  css  js  c++  java
  • javascript es6系列教程

    三个点(...)在es6中,有两个含义:

    • 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式:  在形参面前加三个点( ... )
    • 用在数组前面,可以把数组的值全部打散,展开,叫展开运算符. 语法格式:  在数组面前加三个点( ... )

    求不定参数的和,以前可以用arguments来做,现在可以用不定参数来做,如下:

    复制代码
     1         function add( ...values ){
     2             console.log( values ); // [10, 20, 30]
     3             let sum = 0;
     4             for( let i = 0, len = values.length; i < len; i++ ){
     5                 sum += values[i];
     6             }
     7             return sum;
     8         }
     9         var res = add( 10, 20, 30 );
    10         console.log( res ); //60
    复制代码
    1         function add( ...keys, last ) { //报错,不定参数只能放在最后面
    2 
    3         }
    1         // function add( ...key1, ...key2 ){ //报错,一个函数不能出现多个不定参数
    2 
    3         // }

    筛选拷贝对象的属性,之前我们是这样子做的:

    复制代码
     1         function pick( src ){
     2             let target = Object.create( null );//创建一个空对象,跟new Object不同
     3             for( let i = 1, len = arguments.length; i < len; i++ ){
     4                 target[arguments[i]] = src[arguments[i]];
     5             }
     6             return target;
     7         }
     8         let user = {
     9             name : 'ghostwu',
    10             age : 22,
    11             sex : 'man',
    12         };
    13         var obj = pick( user, 'name', 'age' ); //拷贝user对象的name和age属性
    14         console.log( obj ); //{name: "ghostwu", age: 22}
    复制代码

    这样做没有什么问题,读取属性我们始终要记得从1开始, 因为arguments对象的索引0 被 src这个参数占据了. 用不定参数修改如下:

    复制代码
     1         function pick( src, ...keys ){
     2             console.log( keys ); //['name','age'];
     3             let target = Object.create( null );
     4             for( let i = 0, len = keys.length; i < len; i++ ){
     5                 target[keys[i]] = src[keys[i]];
     6             }
     7             return target;
     8         }
     9 
    10         let user = {
    11             name : 'ghostwu',
    12             age : 22,
    13             sex : 'man',
    14         };
    15 
    16         var obj = pick( user, 'name', 'age' );
    17         console.log( obj );
    复制代码

    以上方式,更符合数组操作习惯, 拿来就用,不要老是记着从1开始

    不定参数与arguments类似,当初设计的目的就是为了取代arguments,那不定参数会不会影响arguments呢?

    复制代码
    1         function show( ...keys ){
    2             console.log( keys.length ); //3
    3             console.log( arguments.length ); //3
    4             keys[0] = 1000;
    5             console.log( keys[0], keys[1], keys[2] ); // 1000,20,30
    6             console.log( arguments[0], arguments[1], arguments[2] ); //10,20,30
    7         }
    8         show( 10, 20, 30 );
    复制代码

    不定参数修改之后,arguments并不会受到影响

    展开运算符:

    1         let a = 10, b = 20;
    2         console.log( Math.max( a, b ) ); //20
    1         let arr = [ 1, 3, 0, -1, 20, 100 ];
    2         console.log( Math.max( arr ) );//NaN, max不能接收数组参数

    我们可以借助apply的语法,把数组传递进去

    1 let arr = [ 1, 3, 0, -1, 20, 100 ];
    2 console.log( Math.max.apply( Math, arr ) );//100

    有了展开运算符之后,更简单

    1         let arr = [ 1, 3, 0, -1, 20, 100 ];
    2         console.log( Math.max( ...arr ) ); //100 ...: 把数组展开
    3         console.log( Math.max( ...arr, 1000 ) ); //1000
    作者:ghostwu, 出处:http://www.cnblogs.com/ghostwu 博客大多数文章均属原创,欢迎转载,且在文章页面明显位置给出原文连接
  • 相关阅读:
    Zabbix5 Frame 嵌套
    Zabbix5 对接 SAML 协议 SSO
    CentOS7 安装 Nexus
    CentOS7 安装 SonarQube
    GitLab 后台修改用户密码
    GitLab 查看版本号
    GitLab Admin Area 500 Error
    Linux 安装 PostgreSQL
    Liger ui grid 参数
    vue.js 是一个怪东西
  • 原文地址:https://www.cnblogs.com/xibuhaohao/p/10563436.html
Copyright © 2011-2022 走看看