箭頭函式 (arrow functions)也稱「胖箭頭函式」,是es6全新的特性。是個簡寫的函式表示式,擁有詞法作用域的this
。此外,箭頭函式總是匿名的。(詞法作用域就是乙個變數的作用在定義的時候就已經被定義好,當在本作用域中找不到變數,就會一直向父作用域中查詢,直到找到為止。)
1、typeof運算子和普通的函式一樣
let commfunc = () => {};
console.log(typeof commfunc);
輸出為function
。
let arrowfunc = () => {};
console.log(typeof arrowfunc);
輸出也為function
。
從此可以看出箭頭函式的型別和普通的函式一樣都為function
。
2、instanceof
也返回true
,表明是function的例項
let func = () => {};
console.log(func instanceof function);
輸出為true
,由此可以看出箭頭函式也是function的例項
3、箭頭函式中的this
繼承外圍作用域
let person =
};person.say();
this
的值為」{}」或window
,this.name
的值為undefined
或」「(空字串)。將上面的這段**寫在檔案中,在node環境中執行,this
的值輸出為」{}」,這個空物件就是exports
,因為沒有寫exports
,exports
就預設指向module.exports
,而module.exports
就是個空物件。但是在命令列中執行上面**(依然是node環境中),則this
指向global
物件(這些有可能偏離中心,但是大家可以試試,在這段**前加上exports.name = "susan"
,此時的this
指向
物件,this.name
的值就是susan
)
let person =
};person.speak();
this
的值為person物件,this.name
的值為galler。
小結:箭頭函式本身沒有this
,根據詞法作用域,於是向上查詢this
,則發現this
指向window
物件(瀏覽器環境)或者{}(node環境中),由於window
和{}物件沒有name
屬性,則this.name
為」「(瀏覽器環境)或者undefined
(node環境)
4、返回物件用小括號括起來
let person = () =>
console.log(person());
輸出為undefined
。此時的」{}」表明函式的起始位置和結束位置,由於該函式沒有返回值,所以被呼叫時值為undefined
let person = () => ();
console.log(person());
輸出為
。 此時」{}」表示定義乙個物件。用」()」括起來表示是乙個表示式,預設返回該物件。
5、箭頭函式中不能使用new
let person = (name) => ;
let one = new person("galler");
執行該程式,則出現typeerror: person is not a constructor
6、arguments
function person()
person(1);
一般的函式使用arguments
,在瀏覽器中輸出為乙個陣列:[1]
,在node環境中輸出為乙個物件:
let person = () => ;
person("galler");
箭頭函式使用arguments
,在瀏覽器環境中,則出現referenceerror
,在node環境中輸出,……}
。
由此可以得出,箭頭函式與普通函式的再乙個區別:不能使用arguments
物件。
7、沒有原型
let person = () => {}
console.log(person.prototype);
輸出為undefined
。由此可以看出箭頭函式沒有原型。
注意:箭頭函式內容實體中不能使用statement作為表示式expression。
事物都是有兩面性的,所以箭頭函式的優點即缺點。**太過簡單,導致不好閱讀,this
提前定義。
es6箭頭函式
本例是在了解es6知識後在原來定義函式的基礎上進行理解var searchvalue 查詢匹配物件 var button var input var select button if searchvalue.input undefined button.click else 重新整理 tableli...
es6 箭頭函式
1.單引數 function cheng a 3 let cheng a 3 a a console.log cheng 9 2.多引數 function add a,b let add a,b a b 預設返回值 console.log add 3,9 3.無返回值 function add a,...
ES6 箭頭函式
es6 中,箭頭函式就是函式的一種簡寫形式,使用括號包裹數,跟隨乙個 緊接著是函式體 var getprice function 箭頭函式 var getprice 9.15 箭頭函式不僅僅是讓 變得簡潔,函式中 this 總是繫結總shi 指向物件自身 function person 1000 使...