JS學習(this關鍵字)

this關鍵字

this關鍵字是什麼

this關鍵字是JavaScript中最複雜的機制之一。它是一個很特別的關鍵字,被定義在全部函數的做用域中。可是即便是很是有經驗的JavaScript開發者也很難說清它到底指向什麼。
1.this被定義在全部函數的做用域中
2.this指向哪一個對象不取決於this被定義在哪裏,而是取決於調用的位置app

//定義一個全局變量
var v = 10;
//this常常被定義在函數的做用域中
function fn(){
    //this 老是要返回一個對象
    console .log(this . v);
}
fn();

綁定規則

默認綁定

在一個函數體中使用this,當該函數被獨立調用。能夠把這條規則看做是沒法應用其餘規則時的默認規則。函數

function foo(){
   console .log(this .a);
}
var a=2;
foo();//2

隱式綁定

隱式綁定的規則須要考慮的是調用位置是否有上下文對象,或者說是否被某個對象擁有或者包含。this

function foo(){
    console .log(this.a);
}
var obj = {
  a:2,
  foo:foo
};
obj.foo();//2

隱式綁定丟失

隱式綁定丟失是最多見的this綁定問題,指的就是被隱式綁定的函數會丟失綁定對象,也就是說它會應用默認綁定,從而把this綁定到全局對象。code

// 定義一個全局變量
var v = 100;
// 定義一個函數
function fn(){
    console.log(this.v);
}
// 定義一個對象
var obj = {
    v : 200,
    f : fn // 對象的f()方法指向fn()函數
}
// 定義一個全局變量,並被賦值爲對象obj的f()方法
var fun = obj.f;
// 將fun做爲一個函數進行調用
fun();

顯示綁定

顯示綁定就是明確在調用時,this所綁定的對象。JavaScript中提供了apply()方法和call()方法實現,這兩個方法的第一個參數接收是一個對象,會把這個對象綁定到this,接着在調用函數時指定這個this對象

// 定義一個全局變量
var v = 100;
// 定義一個函數
function fn(){
    console.log(this.v);
}
// 定義一個對象
var obj = {
    v : 200,
    f : fn // 對象的f()方法指向fn()函數
}
// 定義一個全局變量,並被賦值爲對象obj的f()方法
var fun = obj.f;
// 將fun做爲一個函數進行調用
fun.apply(obj);

new綁定

1.建立(或者說構造)一個全新的對象
2.這個新對象會綁定到函數調用的this
3.若是函數沒有返回其餘對象,那麼new表達式中的函數調用會自動返回這個新對象。ip

function Hero(name){
    this.name = name;
}
// this取決於函數調用的位置
var hero1 = new Hero('hhh');

var hero2 = new Hero('xxx');
相關文章
相關標籤/搜索