第2章 ES6基础编程

函数的扩展

  • rest参数
  • 箭头函数

rest参数-三点运算符

ES6 引入 rest 参数(形式为“...变量名”),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中



注意:只能放到最后位置,前面如果还有其他的,他会去掉前面固定部分的参数

上面是三点运算符作为参数引用,
三点运算符的另外一个作用:作为拓展运算符使用:
扩展用法:将数组插入到另外一个数组的中间

        let arr=[1,6];
        let arr1=[2,3,4,5];
        arr=[1,...arr1,6];//把arr1的每个值拿出来放到arr的中间
        //遍历数组
        console.log(arr);//数组
        console.log(...arr); //数组遍历后的实际值

再来一个小例子

        function push(array, ...items) {
            for (var i = 0; i < items.length; i++) {
                array.push(items[i]);
            }
        }
        var a = [];
        push(a, 1, 2, 3);
        //扩展运算符
        console.log(...a);

总结:三点运算符应用
1、作为扩展参数用
2、作为拓展运算符使用

箭头函数

最重要的一点:箭头函数this和普通函数的this:简头函数没有自己的作用域,这一点以后续axios调用时非常有用,多用于定义回调函数上

1、简头函数如果外层有函数,this就是外层函数
2、如果外层没有函数,this即是window

      

简头函数小括号有几种情况:
1、没有形参时,小括号不可省略

    

2、一个形参时,小括号可省略

        let fun2 = username =>console.log(username);
        fun2("wang.qj");

3、2-n个形参时,小括号不可省略
正确的写法:

let fun3 = (username,password) =>console.log(username,password);
fun3("wang.qj","123456");

错误的写法:
let fun4 = username,password =>console.log(username,password)
fun4("wang.qj","123456");

参数部分的小括号使用小结

1、没有参数时,括号不可省
2、一个参数时,可省略括号
3、大于一个时,小括号不可省略
总结一下:只有参数个数是一个时,可省略小括号

函数体的几点说明:
1、只有一条语句时,函数体的花括号可以省略,花括号省略时会把语句的执行结果返回,也就是相当于自动return 。

        let x=10;
        let y=20;
        let fun = () =>x+y;
        console.log(fun());//30
        let fun2 = () =>{x+y;}
        var value=fun2();
        console.log(value); //undefined 因为这时没有返回值

2、函数体有多条语句时,花括号不可以省略

        let fun2 = (x,y) =>{
            let result=x+y;
            return result;
        }
        console.log(fun2(20,30));//50

3、返回json

    

4、由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号。
错误的写法:

    

正确的写法:

    

函数体使用总结:
为防止写错,尽量用以下方式

    {
        return ****;
    }

你可能感兴趣的:(第2章 ES6基础编程)