es6-函数的扩展

Posted 2021-01-21 aqigogogo

  /*
    * 1:函数参数的默认值
    * */
    !(() => {
        function f(x, y = 1, z = 1, g = 1) {
            console.log(x, y, z, g);//1,1,false,null

        }

        f(1, undefined, false, null);

    })();

    /*
    * 2与解构赋值结合使用
    * */
    !(() => {
        function f({x = 1, y} = {}) {
            console.log(x, y)
        }

        function f1({x, y} = {x: 1}) {
            console.log(x, y)
        }

        f();//1,undefined
        f({});//1,undefined
        f1();//1,undefined
        f1({});//undefined,undefined
    })()
    /*
    * 3函数的length属性
    * */
    console.log((function (a) {
    }).length);//1
    console.log((function (a, x = 2, e, r) {
    }).length);//1
    console.log((function (...args) {
    }).length);//0
    /*
    * 4：函数的作用域
    * ---- 一旦设置了参数的默认值，函数进行声明初始化时，参数会形成一个单独的作用域（context）。等到初始化结束，这个作用域就会消失。这种语法行为，在不设置参数默认值时，是不会出现的。
    * ----暂时死区
    * */

    /*
    *
    * 5 rest参数(因为箭头函数作用域中午argument对象 用rest参数代替)
    * rest 是数组argument不是
    * rest 参数必须放在最后一位（不然报错）
    * */
    function add(a,...values) {
        console.log(values);
    }

    add(2, 5, 3) // 10
    /*
    * 6：函数的name属性
    * Function构造函数返回的函数实例，name属性的值为anonymous。
    * (new Function).name // "anonymous"
    *ind返回的函数，name属性值会加上bound前缀。
    * function foo() {};foo.bind({}).name // "bound foo"
    (function(){}).bind({}).name // "bound "
    * */

    /*
    * 7箭头函数
    * （1）函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。

（2）不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。

（3）不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用 rest 参数代替。

（4）不可以使用yield命令，因此箭头函数不能用作 Generator 函数。
    * */

 /*
    * 箭头函数
    *   1:this指向函数外部的this(函数定义时候的this指向) 对象的方法中的箭头函数this 指向对象所造作用域的this 非箭头函数时 this指向这个对象
    *   2:不可当做构造函数来new 箭头函数 会报错
    *   3:箭头函数没有argument 用reset参数代替 （形式为...变量名）（变量名是相当于argument）
    *
    *
    *
    * 函数中的函数 有多个调用帧 然后形成调用栈 尾调用不需要保留外层函数的调用帧
    * 尾调用优化 函数内部不调用函数外部的变量
    *
    * */

    let f=(x,y=2)=>x+1+y;
    console.log(f(1));
    // new f();
    function f1(a,b,c) {
        console.log(arguments);
        console.log(arguments.constructor);
        console.log(arguments.constructor.name);
        return a+b+c;
    }
    f1(1,2,3);
    ((...value)=>{
        console.log(value)

    })(1,2,3,4);

    const cat = {
        lives: 9,
        jumps: function ()  {
            console.log(this);
            this.lives--;
            return this.lives;
        }
    }
    console.log(cat.jumps());//8
    console.log(cat.jumps());//7
    console.log(cat.jumps());//6