您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關(guān)js中this的指向問題歸納的示例分析的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
this
this:上下文,會根據(jù)執(zhí)行環(huán)境變化而發(fā)生指向的改變.
1.單獨的this,指向的是window這個對象
alert(this); // this -> window
2.全局函數(shù)中的this
function demo() { alert(this); // this -> window } demo();
在嚴格模式下,this是undefined.
function demo() { 'use strict'; alert(this); // undefined } demo();
3.函數(shù)調(diào)用的時候,前面加上new關(guān)鍵字
所謂構(gòu)造函數(shù),就是通過這個函數(shù)生成一個新對象,這時,this就指向這個對象。
function demo() { //alert(this); // this -> object this.testStr = 'this is a test'; } let a = new demo(); alert(a.testStr); // 'this is a test'
4.用call與apply的方式調(diào)用函數(shù)
function demo() { alert(this); } demo.call('abc'); // abc demo.call(null); // this -> window demo.call(undefined); // this -> window
5.定時器中的this,指向的是window
setTimeout(function() { alert(this); // this -> window ,嚴格模式 也是指向window },500)
6.元素綁定事件,事件觸發(fā)后,執(zhí)行的函數(shù)中的this,指向的是當前元素
window.onload = function() { let $btn = document.getElementById('btn'); $btn.onclick = function(){ alert(this); // this -> 當前觸發(fā) } }
7.函數(shù)調(diào)用時如果綁定了bind,那么函數(shù)中的this指向了bind中綁定的元素
window.onload = function() { let $btn = document.getElementById('btn'); $btn.addEventListener('click',function() { alert(this); // window }.bind(window)) }
8.對象中的方法,該方法被哪個對象調(diào)用了,那么方法中的this就指向該對象
let name = 'finget' let obj = { name: 'FinGet', getName: function() { alert(this.name); } } obj.getName(); // FinGet ---------------------------分割線---------------------------- let fn = obj.getName; fn(); //finget this -> window
騰訊筆試題
var x = 20; var a = { x: 15, fn: function() { var x = 30; return function() { return this.x } } } console.log(a.fn()); console.log((a.fn())()); console.log(a.fn()()); console.log(a.fn()() == (a.fn())()); console.log(a.fn().call(this)); console.log(a.fn().call(a));
答案
1.console.log(a.fn());
對象調(diào)用方法,返回了一個方法。
# function() {return this.x}
2.console.log((a.fn())());
a.fn()返回的是一個函數(shù),()()這是自執(zhí)行表達式。this -> window
# 20
3.console.log(a.fn()());
a.fn()相當于在全局定義了一個函數(shù),然后再自己調(diào)用執(zhí)行。this -> window
# 20
4.console.log(a.fn()() == (a.fn())());
# true
5.console.log(a.fn().call(this));
這段代碼在全局環(huán)境中執(zhí)行,this -> window
# 20
6.console.log(a.fn().call(a));
this -> a
# 15
感謝各位的閱讀!關(guān)于“js中this的指向問題歸納的示例分析”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。