ES6函式學習記錄

2021-10-08 21:23:34 字數 2055 閱讀 1198

es6在函式擴充套件方面,新增了很多特性。

es5 中,this指向的是函式被呼叫的物件;而 es6 的箭頭函式中,this指向的是函式被定義時。簡單來說,箭頭函式中的this,是不會變的,是永遠繫結在當前的環境下。

有了es6,當我們在定義乙個方法,但是不確定其引數的個數時,我們就可以用擴充套件運算子作為引數。

以前,我們在定義方法時,引數要確定個數,如下:

function

fn(a, b, c)fn(

1,2,

3);

上方**中,因為方法的引數是三個,但使用時是用到了四個引數,所以會報錯:

現在,我們有了擴充套件運算子,就不用擔心報錯的問題了。**可以這樣寫:

functionfn(

...arg)fn(

1,2,

3);//方法中定義了四個引數,但只引用了三個引數,es6 中並不會報錯。

上方**中注意,arg引數之後,不能再加別的引數,否則編譯報錯。

舉例:陣列賦值的問題

我們來分析一段**:(將陣列 arr1 賦值給 arr2)

let arr1 =

['www'

,'smyhvae'

,'com'];

let arr2 = arr1;

// 將 arr1 賦值給 arr2,其實是讓 arr2 指向 arr1 的記憶體位址

console.

log(

'arr1:'

+ arr1)

;console.

log(

'arr2:'

+ arr2)

;console.

log(

'---------------------');

arr2.

push

('你懂得');

//往arr2 裡新增一部分內容

console.

log(

'arr1:'

+ arr1)

;console.

log(

'arr2:'

+ arr2)

;

上方**中,我們往往 arr2 裡新增了***,卻發現,arr1 裡也有這個內容。原因是:let arr2 = arr1;其實是讓 arr2 指向 arr1 的位址。也就是說,二者指向的是同乙個記憶體位址。

let arr1 =

['www'

,'smyhvae'

,'com'];

let arr2 =

[...arr1]

;//arr2 會重新開闢記憶體位址

console.

log(

'arr1:'

+ arr1)

;console.

log(

'arr2:'

+ arr2)

;console.

log(

'---------------------');

arr2.

push

('你懂得');

//往arr2 裡新增一部分內容

console.

log(

'arr1:'

+ arr1)

;console.

log(

'arr2:'

+ arr2)

;

rest 運算子

rest 在英文中指的是剩餘部分(不是指休息)。我們來舉個例子,理解剩餘部分的含義:

function

fn(first, second,

...arg)fn(

0,1,

2,3,

4,5,

6);//呼叫函式後,輸出結果為 5

上方**的輸出結果為 5。 呼叫fn()時,裡面有七個引數,而arg指的是剩下的部分(因為除去了first和second)。

從上方例子中可以看出,rest運算子適用於:知道前面的一部分引數的數量,但對於後面剩餘的引數數量未知的情況。

ES6中箭頭函式學習總結

先來看看普通的函式是怎麼定義的 通過物件字面量定義函式 再來看看es6中箭頭函式的定義 現在知道了箭頭函式和普通函式的差別,接下來分析其引數和返回值與普通函式的差異。引數問題 傳入乙個引數的寫法 返回值問題 函式體中只有1行 時 現在再來看看在標籤中箭頭函式與普通函式this的返回值 看看在物件中箭...

ES6學習 Generator函式

generator是es6提供的一種非同步程式設計的解決方案。形式上有兩個特徵。一是,function關鍵字和函式名之間有個星號 二是,函式內部使用yield語句,定義不同的內部狀態。function hellogenerator var hw hellogenerator 必須呼叫物件的next方...

ES6學習 箭頭函式

定義 params1,params2,params3.其中 中的內容為傳入箭頭函式的引數,為函式內的內容。規範 1 引數部分 1 如果有多個引數,不能省略 如果引數個數不明,可以用.rest表示,但是.rest必須放在最後 2 如果只有乙個引數,可以省略 3 如果沒有引數,那麼可以用 表示 eg 2...