JS中改變this指向的方法(call和apply、bind)
來源:易賢網(wǎng) 閱讀:1912 次 日期:2016-07-15 16:34:41
溫馨提示:易賢網(wǎng)小編為您整理了“JS中改變this指向的方法(call和apply、bind)”,方便廣大網(wǎng)友查閱!

this是javascript的一個(gè)關(guān)鍵字,隨著函數(shù)使用場(chǎng)合不同,this的值會(huì)發(fā)生變化。但是總有一個(gè)原則,那就是this指的是調(diào)用函數(shù)的那個(gè)對(duì)象。

this一般指向的是當(dāng)前被調(diào)用者,但也可以通過其它方式來改變它的指向,下面將介紹三種方式:

1.call用作繼承時(shí):

function Parent(age){

this.name=['mike','jack','smith'];

this.age=age;

}

function Child(age){

Parent.call(this,age);//把this指向Parent,同時(shí)還可以傳遞參數(shù)

}

var test=new Child(21);

console.log(test.age);//21

console.log(test.name);

test.name.push('bill');

console.log(test.name);//mike,jack,smith,bill

2.call和apply都可以改變this指向,不過apply的第二個(gè)參數(shù)是散列分布,call則可以是一個(gè)數(shù)組

console.log(Math.max.apply(null,[1,2,3,4]));//4

apply() 方法接收兩個(gè)參數(shù):一個(gè)是在其中運(yùn)行函數(shù)的作用域,另一個(gè)是參數(shù)數(shù)組。其中,第二個(gè)參數(shù)可以是 Array 的實(shí)例,也可以是arguments 對(duì)象。call() 方法與 apply() 方法的作用相同,它們的區(qū)別僅在于接收參數(shù)的方式不同。對(duì)于 call()

方法而言,第一個(gè)參數(shù)是 this 值沒有變化,變化的是其余參數(shù)都直接傳遞給函數(shù)。換句話說,在使用call() 方法時(shí),傳遞給函數(shù)的參數(shù)必須逐個(gè)列舉出來。

3.ES5還定義了一個(gè)方法:bind(),它會(huì)創(chuàng)建一個(gè)函數(shù)的實(shí)例,其this值會(huì)被綁定到傳給bind()函數(shù)的值。如

window.color='red';

var o={color:'blue'};

function sayColor(){

console.log(this.color);

}

var objectSaycolor=sayColor.bind(o);

//var objectSaycolor=sayColor.bind();

objectSaycolor();//blue

在這里sayColor()調(diào)用bind()并傳入對(duì)象o,創(chuàng)建了objectSayColor()函數(shù)。objectSayColor()函數(shù)的this值等于o,因此即使是在全局作用域中調(diào)用這個(gè)函數(shù),也會(huì)看到blue。

以上所述是小編給大家介紹的JS中改變this指向的方法(call和apply、bind),希望對(duì)大家以上幫助!

下面還有點(diǎn)時(shí)間給大家補(bǔ)充點(diǎn)基礎(chǔ)知識(shí)有關(guān):call()與apply()區(qū)別

一、方法的定義

call方法:

語(yǔ)法:call(thisObj,Object)

定義:調(diào)用一個(gè)對(duì)象的一個(gè)方法,以另一個(gè)對(duì)象替換當(dāng)前對(duì)象。

說明:

call 方法可以用來代替另一個(gè)對(duì)象調(diào)用一個(gè)方法。call 方法可將一個(gè)函數(shù)的對(duì)象上下文從初始的上下文改變?yōu)橛?thisObj 指定的新對(duì)象。 

如果沒有提供 thisObj 參數(shù),那么 Global 對(duì)象被用作 thisObj。

apply方法:

語(yǔ)法:apply(thisObj,[argArray])

定義:應(yīng)用某一對(duì)象的一個(gè)方法,用另一個(gè)對(duì)象替換當(dāng)前對(duì)象。

說明:

如果 argArray 不是一個(gè)有效的數(shù)組或者不是 arguments 對(duì)象,那么將導(dǎo)致一個(gè) TypeError。 

如果沒有提供 argArray 和 thisObj 任何一個(gè)參數(shù),那么 Global 對(duì)象將被用作 thisObj, 并且無法被傳遞任何參數(shù)。

代碼示例:

function Animal(name) {

   this.name = name;

   this.showName = function() {

     console.log(this.name);

   };

 }

 function Cat(name) {

   Animal.call(this, name);

 }

 Cat.prototype = new Animal();

 function Dog(name) {

   Animal.apply(this, name);

 }

 Dog.prototype = new Animal();

 var cat = new Cat("Black Cat"); //call必須是object

 var dog = new Dog(["Black Dog"]); //apply必須是array

 cat.showName();

 dog.showName();

 console.log(cat instanceof Animal);

 console.log(dog instanceof Animal);

模擬call, apply的this替換

function Animal(name) {

  this.name = name;

  this.showName = function() {

    alert(this.name);

  };

};

function Cat(name) {

  this.superClass = Animal;

  this.superClass(name);

  delete superClass;

}

var cat = new Cat("Black Cat");

cat.showName();

更多信息請(qǐng)查看網(wǎng)絡(luò)編程
易賢網(wǎng)手機(jī)網(wǎng)站地址:JS中改變this指向的方法(call和apply、bind)
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門公布的正式信息和咨詢?yōu)闇?zhǔn)!

2025國(guó)考·省考課程試聽報(bào)名

  • 報(bào)班類型
  • 姓名
  • 手機(jī)號(hào)
  • 驗(yàn)證碼
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢 | 簡(jiǎn)要咨詢須知 | 新媒體/短視頻平臺(tái) | 手機(jī)站點(diǎn) | 投訴建議
工業(yè)和信息化部備案號(hào):滇ICP備2023014141號(hào)-1 云南省教育廳備案號(hào):云教ICP備0901021 滇公網(wǎng)安備53010202001879號(hào) 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號(hào)
云南網(wǎng)警備案專用圖標(biāo)
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號(hào):hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報(bào)警專用圖標(biāo)