摘要:寫法不同的寫法箭頭函數(shù)的寫法的指向不同在中,指向的是調(diào)用該函數(shù)的對(duì)象使用定義的函數(shù)而在箭頭函數(shù)中,永遠(yuǎn)指向定義函數(shù)的環(huán)境。變量提升存在變量提升,可以定義在調(diào)用語(yǔ)句后箭頭函數(shù)以字面量形式賦值,是不存在變量提升的
1.寫法不同
// function的寫法 function fn(a, b){ return a+b; }
// 箭頭函數(shù)的寫法 let foo = (a, b) =>{ return a + b }2.this的指向不同
在function中,this指向的是調(diào)用該函數(shù)的對(duì)象;
//使用function定義的函數(shù) function foo(){ console.log(this); } var obj = { aa: foo }; foo(); //Window obj.aa() //obj { aa: foo }
而在箭頭函數(shù)中,this永遠(yuǎn)指向定義函數(shù)的環(huán)境。
//使用箭頭函數(shù)定義函數(shù) var foo = () => { console.log(this) }; var obj = { aa:foo }; foo(); //Window obj.aa(); //Window
function Timer() { this.s1 = 0; this.s2 = 0; // 箭頭函數(shù) setInterval(() => { this.s1++; console.log(this); }, 1000); // 這里的this指向timer // 普通函數(shù) setInterval(function () { console.log(this); this.s2++; // 這里的this指向window的this }, 1000); } var timer = new Timer(); setTimeout(() => console.log("s1: ", timer.s1), 3100); setTimeout(() => console.log("s2: ", timer.s2), 3100); // s1: 3 // s2: 03.箭頭函數(shù)不可以當(dāng)構(gòu)造函數(shù)
//使用function方法定義構(gòu)造函數(shù) function Person(name, age){ this.name = name; this.age = age; } var lenhart = new Person(lenhart, 25); console.log(lenhart); //{name: "lenhart", age: 25}
//嘗試使用箭頭函數(shù) var Person = (name, age) =>{ this.name = name; this.age = age; }; var lenhart = new Person("lenhart", 25); //Uncaught TypeError: Person is not a constructor
另外,由于箭頭函數(shù)沒(méi)有自己的this,所以當(dāng)然也就不能用call()、apply()、bind()這些方法去改變this的指向。
4.變量提升function存在變量提升,可以定義在調(diào)用語(yǔ)句后;
foo(); //123 function foo(){ console.log("123"); }
箭頭函數(shù)以字面量形式賦值,是不存在變量提升的;
arrowFn(); //Uncaught TypeError: arrowFn is not a function var arrowFn = () => { console.log("456"); };
console.log(f1); //function f1() {} console.log(f2); //undefined function f1() {} var f2 = function() {}
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/109161.html
摘要:下例實(shí)現(xiàn)了一個(gè)數(shù)組的迭代器在中,可迭代數(shù)據(jù)結(jié)構(gòu)比如數(shù)組都必須實(shí)現(xiàn)一個(gè)名為的方法,該方法返回一個(gè)該結(jié)構(gòu)元素的迭代器。原話是還可以傳遞返回值。 前記 按照規(guī)劃,明年年中,ECMAScript 6(ES6)就要正式發(fā)布了。 最近抽空看了Dr. Axel Rauschmayer的幾篇文章和演講PPT,對(duì)新特性有了些了解。 趁沒(méi)忘,抓緊記錄下,夾雜自己的感受。 計(jì)劃分三部分: 新語(yǔ)法...
摘要:請(qǐng)看對(duì)應(yīng)版本干了什么可知,相當(dāng)于以前在構(gòu)造函數(shù)里的行為。這種寫法會(huì)與上文中寫法有何區(qū)別我們?cè)诃h(huán)境下運(yùn)行一下,看看這兩種構(gòu)造函數(shù)的有何區(qū)別打印結(jié)果打印結(jié)果結(jié)合上文中關(guān)于原型的論述,仔細(xì)品味這兩者的差別,最好手動(dòng)嘗試一下。 ES6 class 在ES6版本之前,JavaScript語(yǔ)言并沒(méi)有傳統(tǒng)面向?qū)ο笳Z(yǔ)言的class寫法,ES6發(fā)布之后,Babel迅速跟進(jìn),廣大開發(fā)者也很快喜歡上ES6帶...
摘要:有傳聞?wù)f,箭頭函數(shù)的語(yǔ)法,是受到了的影響,并且它與中的語(yǔ)法一樣,共享上下文。箭頭函數(shù)是新增加的一個(gè)特性。箭頭函數(shù)沒(méi)有自己的值,其值是通過(guò)繼承其它傳入對(duì)象而獲得的通常來(lái)說(shuō)是上一級(jí)外部函數(shù)的的指向。 箭頭函數(shù) 1. 簡(jiǎn)單的定義: 胖箭頭函數(shù) Fat arrow functions,又稱箭頭函數(shù),是一個(gè)來(lái)自ECMAScript 2015(又稱ES6)的全新特性。有傳聞?wù)f,箭頭函數(shù)的語(yǔ)法=>,...
摘要:箭頭函數(shù)簡(jiǎn)單的定義胖箭頭函數(shù),又稱箭頭函數(shù),是一個(gè)來(lái)自又稱的全新特性。箭頭函數(shù)是新增加的一個(gè)特性。使用箭頭函數(shù)的注意點(diǎn)箭頭函數(shù)在參數(shù)和箭頭之間不能換行。值得注意的一點(diǎn)就是對(duì)象的指向是可變的,但在箭頭函數(shù)內(nèi)是固定的。 箭頭函數(shù) 1. 簡(jiǎn)單的定義: 胖箭頭函數(shù) Fat arrow functions,又稱箭頭函數(shù),是一個(gè)來(lái)自ECMAScript 2015(又稱ES6)的全新特性。有傳聞?wù)f,...
摘要:特性介紹箭頭函數(shù)是新增的特性之一,它為這門語(yǔ)言提供了一種全新的書寫函數(shù)的語(yǔ)法。用生成的函數(shù)會(huì)定義一個(gè)自己的,而箭頭函數(shù)沒(méi)有自己的,而是會(huì)和上一層的作用域共享。 本文同步自我得博客:http://www.joeray61.com JS中的箭頭 箭頭在JS里并不算是個(gè)新鮮的玩意兒,一直以來(lái),JS都支持-->這樣的箭頭。 很早的時(shí)候有些瀏覽器還不支持JS,當(dāng)時(shí)的人們?yōu)榱思嫒葸@些瀏覽器,需要這...
閱讀 653·2021-11-25 09:43
閱讀 1926·2021-11-17 09:33
閱讀 839·2021-09-07 09:58
閱讀 2072·2021-08-16 10:52
閱讀 493·2019-08-30 15:52
閱讀 1735·2019-08-30 15:43
閱讀 1005·2019-08-30 15:43
閱讀 2938·2019-08-29 16:41