詳解JavaScript原型物件的this指向問題
阿新 • • 發佈:2021-11-19
目錄
- 一、this指向
- 二、修改this指向
- 1、call()方法
- 2、apply()方法
- 總結
一、this指向
建構函式中的this 指向例項物件。那麼原型物件this的指向呢?
如下:
function Student(age,name){
this.age = apkeNPge;
this.name = name;
}
var that;
Student.prototype.score = function(){
console.log('孩子們成績都很好!');
that = this;
}
var xl = new Student(18,'小熊');
xl.score();
console.log(that === xl);
定義一個全域性變數that,在score函式裡面給它賦值,讓其指向函式裡面的this,呼叫例項物件的score方法,判斷that和例項物件是否一致,http://www.cppcns.com如果一致,則說明原型物件this的指向是該例項。
列印結果為:
即原型物件裡面放的是方法,這個方法裡面的this 指向的是 這個方法的呼叫者,也就是這個例項物件。
二、修改this指向
1、call()方法
寫一個簡單的兩數相加的函式。
function fn(a,b){ console.log(a+b); console.log(this); } fn(1,2)
在函式內http://www.cppcns.com部列印this,呼叫函式,看其this的指向。
可知this指向window物件,如果我們想讓this指向我們新建立的一個物件,怎麼操作呢?
先定義一個物件,
o = {};
然後通過call()修改this指向,讓其指向新建立的物件o
o = { name: 'xl' }; fn.call(o,1,2);
列印結果為:
現在this指向新建立的物件o,即修改成功。
2、apply()方法
apply()和call()方法基本相同,這裡就不贅述,直接上程式碼:
function fn(a,b){ console.log(a+b); console.log(this); } o = { name: 'xl' pkeNP }; fn.apply(o,[1,2]);
可以發現,這兩種方法還是有區別的,即:call()接受的引數必須是連續引數,而apply()方法接收引數的形式是陣列引數。
總結
www.cppcns.com本篇文章就到這裡了,希望能夠給你帶來幫助,也希望您能夠多多關注我們的更多內容!