JavaScript中的this關鍵詞指向
1、es5中的this的指向
this
是JavaScript
的一個關鍵字,他是函數(shù)執(zhí)行過程中,自動生成的一個內(nèi)部對象,指當前的對象,只在當前函數(shù)內(nèi)部使用。- 在
es5
中this
的指向取決于函數(shù)運行時的環(huán)境。 - 沒有直接掛載者(或稱調(diào)用者)的函數(shù)中
this
,非嚴格模式下指向window
,在use strict
嚴格模式下,默認為undefined。以下都是在非嚴格模式下討論
var name = 'hello window!'; var obj = { name: 'hello obj!', fn: function() { console.log(this.name); } }; var fn = obj.fn; fn(); // hello window! obj.fn(); // hello obj!
obj.fn()
在執(zhí)行時,fn
中的this
指向的是當前的調(diào)用對象obj
。fn()
執(zhí)行時,this
指向的是window
對象。
var fn = obj.fn; // 等價于 window.fn = obj.fn; fn(); // 等價于 window.fn();
匿名函數(shù)的執(zhí)行環(huán)境是全局的
var name = 'hello window!'; var obj = { name: 'hello obj!', fn: function() { console.log(this.name); // 'hello obj!' return function() { console.log(this.name); // 'hello window!' }; } }; obj.fn()();
2、es6中的this
es6
箭頭函數(shù)的特點
- 箭頭函數(shù)沒有自己的
this
- 函數(shù)體內(nèi)的
this
對象,就是定義時所在的對象,而不是使用時所在的對象,即外層代碼的this
引用。 - 不可以當作構造函數(shù),也就是說,不可以使用
new
命令,否則會拋出一個錯誤。 - 沒有
arguments
對象。如果要用,可以用Rest
參數(shù)代替。 - 不可以使用
yield
命令,因此箭頭函數(shù)不能用作Generator
函數(shù)
示例說明,修改上述示例代碼中的函數(shù)為箭頭函數(shù):
// 示例代碼1 var name = 'hello window!'; var obj = { name: 'hello obj!', fn: () => { console.log(this.name); // 這里的this指向的外層的this,即window對象,想當于上打印的是console.log(window.name); } }; var fn = obj.fn; fn(); // hello window! obj.fn(); // hello window! // 示例代碼2 var name = 'hello window!'; var obj = { name: 'hello obj!', fn: function() { console.log(this.name); // hello obj! return () => { console.log(this.name); // hello obj! // this指向外層的this,即obj對象 }; } }; obj.fn()();
總結:
es5
中的this
主要看運行的環(huán)境,指向的是調(diào)用它的對象。- 箭頭函數(shù)中的
this
是在一開始就固定的,并不受調(diào)用對象
到此這篇關于JavaScript中的this關鍵詞指向的文章就介紹到這了,更多相關js的this指向內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
createElement動態(tài)創(chuàng)建HTML對象腳本代碼
利用createElement動態(tài)創(chuàng)建鏈接,div等代碼2008-11-11js this函數(shù)調(diào)用無需再次抓獲id,name或標簽名
this就是你當前要執(zhí)行的js所抓獲的節(jié)點,這樣在js里就可以不用document.getElement之類的寫法來抓獲id,name或標簽名,具體示例如下2014-03-03js按條件生成隨機json:randomjson實現(xiàn)方法
下面小編就為大家?guī)硪黄猨s按條件生成隨機json:randomjson實現(xiàn)方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-04-04基于JavaScript實現(xiàn)點擊頁面任何位置返回
這篇文章主要介紹了基于JavaScript實現(xiàn)點擊頁面任何位置返回的實例代碼,需要的朋友可以參考下2016-08-08預防解決你不知道的JavaScript正在泄漏內(nèi)存
這篇文章主要為大家介紹了你不知道的JavaScript正在泄漏內(nèi)存預防及解決方法實例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪<BR>2023-10-10BootstrapTable refresh 方法使用實例簡單介紹
本文就bootstrapTable refresh 方法如何傳遞參數(shù)做簡單舉例說明,非常不錯,具有參考借鑒價值,需要的朋友參考下吧2017-02-02深入理解JavaScript系列(3) 全面解析Module模式
Module模式是JavaScript編程中一個非常通用的模式,一般情況下,大家都知道基本用法,本文嘗試著給大家更多該模式的高級使用方式2012-01-01