javscript中this初探

This

This是什麼:
this是一個特別的關鍵字,是自動定義在全部函數和全局的做用域中。this是在運行時綁定的,而不是聲明時綁定的。javascript

爲何要有this
假設不存在this關鍵字,那麼對於一個函數根據不一樣上下文背景下的複用就用傳入參數java

var obj = Object.create(null);

        obj.name = 'Nico';

        function speak(context) {
            console.log(context.name + " speaks a word");
        }

        speak(obj);

this指向的幾種狀況:
一、通常狀況下,this是指向當前執行時的對象app

var person = {
    name: 'nico',
    getName: function() {
        console.log(this.name)
    }
}

var name = 'siip';

person.getName(); //nico

person對象調用getName方法,因此當前this指向的是person對象函數

二、若是沒有明確對象時,this指向全局對象(在非嚴格模式下,在嚴格模式下,函數綁定undefined,也就是this指向undefined)this

var name = 'siip';

function className() {
    console.log(this.name);
}

className();//siip

其實這裏的className可類似於window.className,因此當前this指向window
三、setTimeout、setInterval、匿名函數this指向全局對象prototype

var person = {
    name: 'nico',
    fns: function() {
        setTimeout(function() {
            console.log(this.name)
        }, 100);//siip

        setInterval(function() {
            console.log(this.name)
        }, 100);//siip

        (function() {
            console.log(this.name)
        })()//siip
    }
}
var name = 'siip';
person.fns();

這些方法都比較容易理解this的指向,由於匿名函數或者定時器函數都是掛載window上的函數,調用者是window對象,這些函數裏聲明的函數,也指向調用者,相似於:code

function foo() {
            function bar() {
                console.log(this)
            }
            bar();
        }

        foo();

四、apply、call可以改變this指向(無參數時或者傳入null、undefined,指向window)對象

var person = {
        name: 'nico',
        applyFns: function() {
            console.log(this.name)
        }
    }
    var name = 'siip';
    person.applyFns();//nico
    person.applyFns.apply();//siip

有時候,ip

五、new Function 構造函數中的this指向該構造函數new出來的對象。作用域

由於new Function的過程大概:

  1. 建立一個新的空對象
  2. 空對象_proto_指向Function.prototype
  3. 空對象與當前函數調用的this綁定
  4. 返回新建立對象

因此new Function中的this指向return的對象。

小結

this的指向取決於函數執行時的塊級上下文

相關文章
相關標籤/搜索