ES6 函数的拓展(四)

最新推荐文章于 2024-09-22 17:53:42 发布

转载最新推荐文章于 2024-09-22 17:53:42 发布 · 112 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/nzcblogs/p/11360915.html

本文深入探讨JavaScript中函数的参数默认值、name和length属性，rest参数的使用，以及箭头函数的this指向、arguments特性与构造函数限制。通过具体示例，帮助读者理解这些概念的实际应用。

一、参数带默认值函数
1、在函数形参可以赋予函数默认值【即实参严格匹配undefined时,在函数内部使用形参时调用它的默认值】
2、函数name属性【返回函数名称,无名的函数返回空字符串】
3、函数length属性【从左往右开始计算函数形参直到碰到带有默认值形参时结束计算,这样计算的形参个数】
eg：

    //普通函数传参
    function test(a,b=2,c,d=3){
        console.log(a,b,c,d);
    }
    test(3,4,5);  //输出abcd分别为：3,4,5,3
    console.log(test.name);  //test
    console.log(test.length)    //1
    //使用解构传递参数,以对象解构为例
    function add({a=2,b}){
        //形参 {a=2,b} = {b:5,a:undefined  对象解构与属性顺序无关
        console.log(a,b);
    }
    add({a:undefined,b:5});  //使用对象解构  输出a b为：2 5

4、rest参数
在函数形参那是有扩展运算符接受实参【返回接受的参数组成的数组】
eg：
   function test(a,b,...tail){
       console.log(a,b,tail);   //1 2 [3,4]
   }
   test(1,2,3,4);
   //参数数组解构传递
   function add([a,...tail]){
       console.log(a,tail);   //1 [2,3,4]
   }
   add([1,2,3,4]);

二、箭头函数
1、ES6中箭头函数中的this指向为该箭头函数【声明】时所处的父模块作用域中的this指向
2、ES6中箭头函数中的arguments不保存实参,不进行实参的使用
3、不能作为构造函数【其函数内this指向可能不会指向该类实例对象】
eg：

    //箭头函数内部没有this，this指向箭头函数【声明时】的父作用域中的this
    function test(){
        console.log(this);
        return ()=>{    //箭头函数声明在这里【其this指向与test函数中的一样】
            console.log(this);
        };   
    }

    let obj = {
        name:'zhangsan',
        test:test()   //这里会先执行test()函数，然后再将test()函数返回的箭头函数地址赋值给obj的test属性，箭头函数在test()函数中已经声明了
    };
    obj.test();    //这里执行的是test()函数中返回的箭头函数而不是外面定义的test()函数

转载于:https://www.cnblogs.com/nzcblogs/p/11360915.html