ES6 06箭頭函式和this

2022-09-10 07:57:12 字數 1522 閱讀 5631

要點:1.箭頭函式 2.this繫結

一.箭頭函式

1.es6新增乙個使用(=>)箭頭符號定義函式的語法特徵

let fn=name=>name;

console.log(fn('mr.lee')); //

翻譯成函式**為:

let fn=function

(name)

2.箭頭函式也可以傳遞兩個或以上的引數,並實現運算後返回

let fn=(x,y)=>x+y;

console.log(fn(10,20)); //

翻譯成函式**:

let fn=function

(x,y)

3.若定義的函式,不需要傳參,可用()括號方式直接返回

let fn=()=>'mr.lee';

console.log(fn()); //

翻譯成函式:

let fn=function

()

4.函式體需要更複雜的操作,可以將箭頭符號右邊使用傳統函式體

let fn=(x,y)=>

console.log(fn(10,20));

5.若箭頭符號右邊是物件,返回的是物件,則需要用圓括號包含著

let fn=name=>();

console.log(fn('mr.lee').name); //

翻譯成函式

let fn=function

(name)

}; console.log(fn('mr.lee').name);

6.若箭頭符號左邊是物件作為引數,右邊是物件的屬性運算,也支援

let fn=()=>name+','+age;

console.log(fn());

7.自我立即執行函式,也可以使用箭頭函式來建立

((name)=>)('mr.lee'); //

翻譯成函式**

(function

(name))('mr.lee');

二.繫結this

1.es6之前有個this指向的問題

let obj=,500)

let that=this

; settimeout(()=>,500)

}} obj.fn();

2.上例,this全域性指向window,在某個物件內部指向當前物件

3.當obj物件下包含類似settimeout函式內部,this指向出問題

4.web環境下,它指向window,node環境下它指向settimeout

5.通俗做法,將this在 settimeout外部進行賦值儲存

6.箭頭函式的出現,徹底解決this在內部的指向問題,直接指向我們所需要的

7.箭頭函式中this是最外層定義的函式繫結,不受內部影響

let obj=,500)

}} obj.fn();

ES6 06 物件的擴充套件

目錄 一 物件的簡化寫法 二 object.is 用來比較兩個值是否相等 nan能判斷其相等,0和 0不等 三 object.assign 合併 複製物件 陣列也可以 let name ty let age 15 let json 不要使用箭頭函式 console.log json let a le...

ES6 函式 箭頭函式 箭頭函式中的this

1,es6中,函式新增哪些特性 支援引數有預設值,支援剩餘引數,支援引數展開運算,新建箭頭函式 ie不支援箭頭函式 2,支援引數預設值 在為傳引數值或傳遞的引數值是undefined的情況下,引數取預設值。引數b有預設值 hello function test a,b hello 未傳引數給引數b ...

es6箭頭函式

本例是在了解es6知識後在原來定義函式的基礎上進行理解var searchvalue 查詢匹配物件 var button var input var select button if searchvalue.input undefined button.click else 重新整理 tableli...