ES6之函數的擴展(二)

岳光發布于2019-08-26 11:55 / 2763人閱讀

摘要：主要講解參數嚴格模式屬性返回函數的函數名箭頭函數用定義函數參數引入參數其目的是為了獲取函數的多余參數數組的擴展運算符的逆向形式將參數數列轉為一個數組將一個數組轉為逗號分隔的參數序列有點安能辨我是雄雌的感覺參數的情況數組的擴展運算的情

主要講解:

1. rest參數
2. 嚴格模式
3. name屬性 -- 返回函數的函數名
4. 箭頭函數 -- 用 "=>" 定義函數

1.rest參數

        ...arguments                      <=>           ...[...]
引入rest參數其目的是為了獲取函數的多余參數   <=>    數組的擴展運算符...的逆向形式
將參數數列轉為一個數組                      <=>    將一個數組轉為逗號分隔的參數序列

function push(arr,...items){  //有點安能辨我是雄雌的感覺
    if(Array.isArray(items)){
        array = array.concat(items); // rest參數的情況
    }else{
        array.push(...items);        // 數組的擴展運算的情況
    }
}
//rest參數
push([],1,23,4,45,56)       //[1,23,4,45,56]

//數組的擴展運算
push([],...[1,23,4,45,56]); //[1,23,4,45,56]

注意:
    1.rest參數必須位于函數參數末尾,且只能存在一個rest參數,否則報錯
    2.函數的length屬性不包括rest參數,就跟止步于默認值參數一樣,不確定的事情不考慮在內

2.嚴格模式

es5中函數內部可以設定嚴格模式,es6中函數參數使用了默認值、解構賦值、或者擴展運算符的話就不能設定嚴格模式
偽代碼:
    function doSomething(...items){
        "use strict";
        ...
    }
    //Uncaught SyntaxError: Illegal "use strict" directive in function with non-simple parameter list
    //由于代碼中基本沒有在函數內部使用嚴格模式的情況，這個就不多了解了

3.name屬性 -- 返回函數的函數名

function push(arr,...items){}    
    push.name;
    //"push"
    
    push.bind({}).name
    //"bound push"
    
let sayHi = function(){}
    sayHi.name
    //"sayHi"
let sayHi = function realName(){}
    sayHi.name
    //"realName"
    
let sayHell = new Function("x","y","console.log(x,y)");
    sayHell.name
    //"anonymous"
    
    sayHell.bind({}).name
    //"bound anonymous"
//僅僅知道有這么一個屬性，具體用處未知

4.箭頭函數 -- 用 "=>" 定義函數

let sayHi = name => name;
等價于:
let sayHi = function(name){
    return name;
}

用法:
    i.單個參數時,可直接寫參數名
    ii.0個或兩個及兩個以上參數必須加括號
        let f = () => 5;
        let f = (x,y) => x+y;
        
    iii.函數代碼塊多于一條語句,就要使用大括號括起來
        let f = (x,y) => { ...}

**箭頭函數除了簡化函數的寫法,特別是匿名函數.另一個重要功能就是綁定定義時所在的作用域,而非運行時動態的作用域**

像click,setTimeout,setInterval這種運行時動態改變作用域的,寫成箭頭函數的形式則this仍然為代碼定義處的this

//計時器一個
function Timer(){
    this.count = 0;
    
    setInterval(() => {this.count++;},1000);
}

let t = new Timer();

等價的寫法:
function Timer(){
    this.count = 0;
    
    let __that = this;
    setInterval(function(){__that.count++;},1000);
}
//嵌套的情況,可以以此類推.其實就是在外層作用域創建一個變量指向this,然后內層使用.每一層都會創建該層的this指向供下一層使用.

如有bug請指正Thanks?(?ω?)?!

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/107829.html

ES6入門之函數的擴展

摘要：如果所有函數都是尾調用，那么完全可以做到每次執行時，調用幀只有一項，這將大大節省內存。等同于等同于注意，只有不再用到外層函數的內部變量，內層函數的調用幀才會取代外層函數的調用幀，否則就無法進行尾調用優化。 showImg(https://segmentfault.com/img/bVbrTHp?w=1080&h=1920); 1. 函數參數的默認值 1.1 用法在ES6之前是不能為...

dackel 2019-08-02 16:15 評論0 收藏0
ES6入門之函數的擴展

摘要：如果所有函數都是尾調用，那么完全可以做到每次執行時，調用幀只有一項，這將大大節省內存。等同于等同于注意，只有不再用到外層函數的內部變量，內層函數的調用幀才會取代外層函數的調用幀，否則就無法進行尾調用優化。 showImg(https://segmentfault.com/img/bVbrTHp?w=1080&h=1920); 1. 函數參數的默認值 1.1 用法在ES6之前是不能為...

graf 2019-08-23 17:10 評論0 收藏0
ES6入門之對象的擴展

摘要：循環遍歷對象自身的和繼承的可枚舉屬性不含屬性。返回一個數組，包含對象自身的所有屬性的鍵名。目前，只有對象方法的簡寫法可以讓引擎確認，定義的是對象的方法。showImg(https://user-gold-cdn.xitu.io/2019/5/21/16ada8456223b0e1); 1. 屬性的簡潔表示法在ES6中允許直接寫入變量和函數，作為對象的屬性和方法，使得代碼的書寫更為簡潔。...

RiverLi 2019-05-23 11:58 評論0 收藏0
ES6學習手稿之基本類型擴展

摘要：它是一個通用標準，奠定了的基本語法。年月發布了的第一個版本，正式名稱就是標準簡稱。結語的基本擴展還有一些沒有在這里詳細介紹。前言 ES6標準以及頒布兩年了，但是，好像還沒有完全走進我們的日常開發。這篇文章從ES6的基本類型擴展入手，逐步展開對ES6的介紹。 ECMAScript和JavaScript JavaScript是由Netscape創造的，該公司1996年11月將JavaSc...

tommego 2019-08-21 18:25 評論0 收藏0
ES6入門之對象的擴展

摘要：屬性的簡潔表示法在中允許直接寫入變量和函數，作為對象的屬性和方法，使得代碼的書寫更為簡潔。循環遍歷對象自身的和繼承的可枚舉屬性不含屬性。返回一個數組，包含對象自身的所有屬性的鍵名。 showImg(https://segmentfault.com/img/remote/1460000019259004?w=1282&h=1920); 1. 屬性的簡潔表示法在ES6中允許直接寫入變量...

AWang 2019-08-26 13:53 評論0 收藏0