美文网首页
ECMAScript6--8.函数扩展

ECMAScript6--8.函数扩展

作者: 飞菲fly | 来源:发表于2017-10-20 14:09 被阅读31次

    1.函数新增特性

    • 参数默认值
      -- 在ES5,参数是没有默认值的;想让参数达到默认值的效果,通过||运算符实现这个效果;
    • rest参数
      -- ...变量
    • 扩展运算符
      -- rest参数的逆运算或逆运用;
    • 箭头函数
      -- ()=>箭头函数;
      • this绑定
        -- 重点补充箭头函数在用的时候this的指向;
        ES5:this指向是函数被调用时的对象所在;
        ES6箭头函数:在定义时候对象所在;
    • 尾调用

    2.函数参数默认值
    --默认值后面不能在有没有默认值的变量;

    {
        function test(x,y='world'){
            console.log('默认值',x,y);
        }
        
        /*
        function test(x,y='world',c){
            //c没有默认值是错误的写法;
        }
        */
        
        /*
        function test(x,y='world',c='test'){
            //这样写可以;
        }
        */
        
        
        test('Hello'); //默认值 Hello world
        test('Hello','hill');//默认值 Hello hill
    }
    

    3.作用域的概念

    {
        let x ='test';
    
        //参数y=x;这个x取的就是前面的参数x;
        function test2(x,y=x){
            console.log('作用域',x,y);//作用域 hill hill
        }
        
        /*
        function test2(c,y=x){
            console.log('作用域:',c,y); //作用域:hill test
        }
        */
        
        test2('hill');
        //test2(); //作用域:undefined undefined
    }
    

    4.rest参数

    • 写法: (...变量);
    • 作用:把一系列的参数转换成数组;(不离散的值变成数组)
      在不确定有多少个参数的时候,最终把你输入的参数都转换成一个数组;
      • ES5:arguments和这个有异曲同工之处;
        • 不同区别是arguments[0]指的是:
          arguments是javascript的一个内置对象,存储的是函数的参数,arguments[0]指代的就是函数的第一个参数;
      • ES6:没有arguments[0]的问题;rest参数之后不能在有其他的参数,否则会编译报错; 如果后边还有别的参数,在转换数组的时候不知道参数到什么时候截止;
    {
        function test3(...arg){
            for(let v of arg){
                console.log('rest', v);
            }
        }
        
        test3(1,2,3,4,'a'); 
        //rest 1 
        //rest 2
        //rest 3 
        //rest 4 
        //rest a
    }
    

    5.扩展运算符

    {
        //把数组转成了离散的值;
        console.log(...[1,2,4]); //1 2 4
        
        console.log('a',...[1,2,4]); //a 1 2 4
    }
    

    6.箭头函数(注意this绑定,有时候适合用箭头函数有时候不适合)

    {
        //let arrow(函数名) = v(函数参数) => v*2(函数返回值)
        let arrow = v => v*2;  
       
        //没有参数
        let arrow2 = () => 5;
       
        console.log('arrow',arrow(3)); // arrow 6
        consoel.log(arrow2()); //5
    }
    

    7.尾调用:存在于函数式编程;

    • 是什么:函数的最后一句话,是不是一个函数;

    • 作用:(提升性能的)之前做递归,涉及一个函数地址嵌套,相当耗费资源的,
      有了尾调用在尾调用优化的过程中,提升性能;
      --在性能优化过程中,觉得某个过程是不断嵌套别的函数或者是你这个函数依赖另一个函数的一个操作,建议可以写成尾调用的形式;

      {
          function tail(x){
             console.log('tail',x);
         }
      
         function fx(x){
            //尾调用就是这种情况:
            //return语句就是fx这个函数的最后一步;最后一步就是一个函数tail(x);
             return tail(x);
         }
      
         fx(123); //tail 123
      }

    相关文章

      网友评论

          本文标题:ECMAScript6--8.函数扩展

          本文链接:https://www.haomeiwen.com/subject/sicvuxtx.html