this指向的規則

1. 預設繫結
2. 隱式繫結
3. 顯示繫結
4. 建構函式繫結
5. new 繫結

1、預設繫結

預設即約定俗成，this指向全域性物件window，嚴格模式下this為undefined。

this.a === window.a // true

var a = 1;

this.a // 1

嚴格模式

use strict

this === window // false

this === undefined // true

2、隱式繫結

顧名思義，隱式繫結大體上可以理解為一個物件有一個屬性為函式，此時這個函式的this指向的是呼叫它的物件所處的自身，直接上程式碼：

例一

var name = 'windowName'

let obj = {

    name: 'name',
    
    getName: function() {
    
        console.log(this.name)
        
    }
};

obj.getName(); // name 此時是obj呼叫的getName方法，所以this指向obj

let obj2 = obj.getName;

obj2(); // windowName 此時是window呼叫的obj2方法，所以this指向window,即window.obj2()

複製程式碼

進階，在物件的函式裡再巢狀一層函式

例二

var name = 'windowName'

var obj = {

    name: 'name',
    
    getName: function() {
    
        return function() {
            console.log(this.name)
        }
        
    }
};

obj.getName()(); // windowName 

var obj2 = obj.getName;

obj2()(); // windowName
複製程式碼

咦？為什麼都是windowName呢？

原來，obj.getName()返回的是一個function

而function的this指向的是window，所以報出來的是windowName.obj2()

同理，例一 中的obj2也是同理，obj2 === obj.getName 返回的也是一個function，所以obj2的this指向的也是window

所以我們們可以得出，隱式繫結根據的是呼叫者的上下文環境。