es6箭頭函數

  • 默認值
    //一、參數默認值 位置在全部形參的後面
    //es6以前的採起的默認值只能變相採起
    function test(a,b) {
        a=a||2;
        b=b||2;
        return a*b
    }
    console.log(test());
//可是這個有弊端  當咱們傳遞的值爲0的時候,仍是會走默認值。改造以後
    function test1(a,b) {
        a=typeof a==="undefined"?2:a;
        b=typeof b==="undefined"?2:b;
        return a*b
    }

    console.log(test1(0,0))
//    es6爲咱們提供了默認值
//    語法糖:  function(a,b=2){}
     let test2=(a=2,b=2) =>{
        return a*b
    };
    console.log(test2());

  • 默認參數的名字 默認參數的名字不能和函數內的形參名字相同,若是相同會報錯,沒有默認值的狀況下,形參名字能夠相同。
    //使用默認參數的時候,函數的形參中的參數名字不能和默認參數的名字同樣 會報錯。可是不是默認參數的時候能夠是相同的名字
    function fn (a,a) {
        return arguments[0]*arguments[1]
    };
    console.log(fn(2,2));
    //可是若是使用的是默認參數的時候不能同名
    function fn1 (a,a=2) {
        console.log(2)
    }
    console.log(fn1(2,2));

  • 默認參數不是傳值,每次在使用默認值得時候,才進行表達式求值。即惰性求值
1 //    默認參數 不是傳值,每次在使用的時候都會進行計算,惰性求值。
2     let  a=(a,b=2+1)=>{
3         return a*b
4     };
5     console.log(a(2));

 

1    let  valEx=(a=2,b=2)=>{
2         console.log("執行一次");
3         return a*b
4     };
5     let  a=(a,b=valEx())=>{
6         return a*b
7     };
8     console.log(a(2));

 1 //  經過函數參數的默認值和解構賦值來結合使用
 2     let f=({a,b=2})=>{
 3         console.log(a,b)
 4     };
 5     f({});
 6     f({a:2,b:2});
 7     // f();//這種狀況下 咱們傳遞不是對象的時候,會報錯 TypeError: (destructured parameter) is undefined。
 8 //    解決上面的f()報錯問題咱們能夠定義默認值給對象便可避免。
 9     f=({a,b=2}={})=>{
10         console.log(a,b)
11     };
12     f();

 

 練習es6

 1 // 寫法一 解構的時候給變量設置默認值。在傳參的時候的設置默認值 這種狀況不給函數傳遞對象的時候會使用解構的默認值
 2 function m1({x = 0, y = 0} = {}) {
 3     return [x, y];
 4 }
 5 
 6 // 寫法二 這種狀況沒有給解構賦默認值,在傳遞空對象的時候,x y都是undefined
 7 function m2({x, y} = { x: 0, y: 0 }) {
 8     return [x, y];
 9 }
10 
11 // 函數沒有參數的狀況
12 m1();//[0,0]
13 m2() ;//[0,0]
14 
15 // x 和 y 都有值的狀況
16 m1({x: 3, y: 8});//[3,8]
17 m2({x: 3, y: 8});//[3,8]
18 
19 // x 有值,y 無值的狀況
20 m1({x: 3});//[3,0]
21 m2({x: 3});//[3,undefined]
22 
23 // x 和 y 都無值的狀況
24 m1({}) ;//[0,0]
25 m2({});//[undefined,undefined]
26 
27 m1({z: 3}) ;////[0,0]
28 m2({z: 3}) ;//[undefined,undefined]
  •  函數的length 函數length的屬性,表示函數的形參的長度。
1 function test(x,y,c){
2 
3 }
4 console.log(test.length);
  • 在給函數賦予默認值的時候,此時函數的長度是形參的長度減去有默認值的形參的長度。
1 //形參的默認值,會致使函數的length的失效,此時的length的長度是全部形參的個數減去有默認值的形參的個數。
2     let a=(d,c,f=1)=>{};
3     console.log(a.length);
  • 默認參數的做用域
 1 // 做用域 在使用形參默認值的時候,在出事的默認值的時候,默認值會造成單獨的做用域。默認值初始化完畢以後,該做用於消失,若是沒有參數的默認值不會存在這個做用域。
 2     let x=12;
 3     let  fn=(x,y=x)=>{
 4         console.log(x,y);//2 2
 5     };
 6     fn(2);
 7     //函數fn 在給y初始化默認值的時候,使用的x這個形參,而不是全局的x。他會從當前的做用域查找。若是沒有依次向上查找。即從他的做用域鏈查找。函數內部的聲明的變量並不會改變全局的
 8     let u=2;
 9     let fn1=(j=u)=>{
10 
11         let u=4;
12         console.log(j,u);
13     };
14     fn1();//2 ,4
15     console.log(u)//2
  • 應用  爲必須參數拋出錯誤。比較方便
1 //默認參數的應用
2     let missParam=()=>{
3         throw  new Error("require paramter!")
4     };
5     let fn=(x=missParam())=>{};
6     fn();
7 //    也說明默認參數是惰性執行,也就是隻有當缺乏默認值的時候纔會執行默認值後面的表達式

  • rest 參數
 1 //rest 參數 es6中 rest參數代替es5中的arguments   語法:...變量名
 2     let fn=(...arr)=>{
 3         let sum=0;
 4         for(var val of arr){
 5             sum+=val;
 6         }
 7         return sum
 8     };
 9     console.log(fn(1,2,3,4,5));
10     //函數的length的方法,計算不包含rest參數。
11     console.log(fn.length);

相關文章
相關標籤/搜索