學JS的心路歷程 函式(三)this

2021-09-24 16:00:32 字數 1678 閱讀 3850

this是什麼,取決於被呼叫的呼叫地點。

昨天有提到說,呼叫函式時候會傳遞隱含引數:arguments和this並講解了arguments,今天我們就來**this吧!

什麼是this

我們都會呼叫函式來使用,但有想過到底是從**呼叫到這個函式嗎?

this通常被稱作函式背景空間(function context),也就是說透過this我們可以知道到底是由誰呼叫這支函式(yjssqsdg)。我們無法在一開始定義它,只有函式呼叫時候才能確定。

函式的呼叫有四種方式:

作為函式呼叫

作為乙個(物件)的方法呼叫

作為乙個建構式函式呼叫

作為函式呼叫

function funa()

//true

可以看到這時候的this是obj物件,也是是說我們是透過obj去呼叫的。

但是要注意乙個小地方:

function funa(){

console.log(this);

console.log(this===obj);

var obj = {

a:funa

funa();

//window

//false

雖然你認為我已經讓obj參照funa了,但是當你直接執行funa時,還是由全域性環境去呼叫,這也呼應了我們開頭所說的「我們無法在一開始定義它,只有函式呼叫時候才能確定」。

我們可以利用作為方法呼叫來解決作為函式呼叫的問題:

function funa(){

this.count ++;

var obj = {

count:0,

sum:funa

obj.sum();

console.log(obj.count);//1

作為建構式呼叫

建構式的函式宣告就跟任何函式一樣,也可以用宣告和表達來建立新物件。

要作為建構式函式來呼叫函式,必須要在函式呼叫前加上new:

function myconstructor(){

this.count = 0;

this.sum = function(){

return this.count ++

var a = new myconstructor();

a.sum();

console.log(a.count);

也許有人會覺得,這跟作為方法呼叫很像,那用物件去寫就好何必這麼麻煩還要學建構式,用奇怪的new去呼叫函式。

這邊就來說明一下,使用new呼叫函式時,會發生什麼事:

建立乙個新物件。

此物件被當成this引數傳遞給建構式,因此成為建構式的函式背景空間(swrebar)。

回傳新建立的物件。

如果我們今天需要兩個相同的物件,如果用作為物件方法呼叫的話就必須建立兩個不同的物件,否則會參照到同樣的物件並修改。

但是建構式就不需要,因為每乙個都是乙個新的物件:

function myconstructor(){

this.count = 0;

this.sum = function(){

return this.count ++

var a = new myconstructor();

var b = new myconstructor();

a.sum();

console.log(b.count);//0

學JS的心路歷程 函式(二)arguments

引數 argument 與函式引數 parameter 在討論函式時,很多人都會把這兩個搞混,我自己也不例外。雖然講錯別人也聽得懂,但是我們還是要搞清楚這兩個的定義到底是什麼!引數是當我們呼叫函式時傳遞給它的值 引數是我們在函式定義中所列出的變數 看完還是有點不懂?沒關係,上圖!宣告式 declar...

學習JS的心路歷程 函式(一)

前幾天有間單提到該如何宣告函式及在hositing中會發生什麼事,但是函式的奧妙不僅於此。身為乙個使用js的工程師,我們一定要熟悉函式到比戀人還熟!這幾天將會把函式逐一扒開跟各位一起 其中的奧妙。函式是頭等物件 這句話代表著函式與任何js物件共存,也被當成乙個物件。函式可以被當成變數引用 用實值作宣...

Mars的心路歷程 失望

我就暫且稱自己為mars吧。我最近,對公司極為的失望,可謂是萬般無奈。我不是埋怨有多麼多麼的不好,好像怨婦一樣。而是,失望。失望,他們對遊戲的標準,遊戲的細緻程度,遊戲的玩法的創新。對,就是創新。我工作也兩年了吧。作為乙個標準的90後,如果見到我的真人,沒人會認為,我是乙個90後,看起來倒像是乙個8...