解析js中的this物件

進入正題，this物件在js中是很常見，但是在這裡也經常會出錯，本文將對常見的this物件的情況做一些總結

this物件是在函式執行時，基於函式的執行環境繫結的。

其實這句話的本質就是，誰呼叫了函式，this就指向誰

具體的來說，通常有以下幾種情況：

在全域性環境中，this指向window

//例子1
function a() 
a();//window

上面的例子很簡單，函式a在全域性環境中執行，也就是全域性物件window呼叫了函式。此時this指向window

作為物件方法呼叫時，this指向呼叫該方法的物件

//例子2
var  b = 
}b.getthis()//b

到這裡我們舉的例子都比較簡單易懂，接下來來乙個有意思的：

//例子3
var c = 
}}  var cfun = c.getfunc()
cfun()//window

這個例子和前乙個例子不一樣，執行c.getfunc()時，首先返回的是乙個匿名函式，我們將這個函式賦值給cfun，接著在全域性環境中呼叫了cfun()，所以此時this指向的還是window。

如果我們一定要讓這裡返回的是c物件呢？在開頭我們說過，this物件是在函式執行時確定的，在例子3中，執行c.getfunc()時，this物件指向的還是c，所以我們只要保持住這個this就好了,對上面的**稍微改動：

//例子4
var c = 
}}  var cfun = c.getfunc()
cfun()//c

這也就是我們經常可以在一些**中看到var self = this或者var that = this之類的原因了。

此時this物件通常指向函式中指定的this值(注意這裡的通常2字，考試要考的)

fun.call(thisarg, arg1, arg2, ...)

這個方法怎麼用呢，看下面的例子：

//例子5
var d = 
}var e = 
d.getthis.call(e)//e

在這裡我們就可以看出call函式的意思了:指定乙個物件o1去呼叫其他物件o2的方法，此時this物件指向o1

好了，那為什麼前面我們說通常呢？因為，有2種例外的情況:

thisarg指定為null和undefined時，this指向window。

//例子6
var d = 
}  d.getthis.call(null)//window
d.getthis.call(undefined)//window
d.getthis.call(1) //number
d.getthis.call("hello") //string
d.getthis.call(true) //boolean

番外：基本包裝型別

既然講到包裝型別，那這裡順便補充介紹一下基本包裝型別：基本包裝型別（包括boolean,string,number）是一類特殊的引用型別，它們具有引用型別的基本特徵，還具有對應的基本型別的特殊行為，舉個例子：

//基本包裝型別
var str = "hello world";
var str2 = s1.substring(2);

首先，str是字串，字串是基本資料型別，但是在第二行**中，str.substring(2)呼叫了str的方法，我們知道，基本資料型別不是物件，本來是是不應該有方法的，但是實際上我們知道string，number型別都有對應的方法，因為從記憶體中訪問str時，訪問進入了一種讀取模式，在後台自動做了以下轉換：

建立乙個string型別的例項

在例項上呼叫相應方法

銷毀該例項

特點：自動建立的基本包裝型別的物件只存在於執行**的瞬間，然後立即銷毀。

那麼可以手動建立基本包裝型別嗎？當然可以：

var  str = new string("hello")//注意這裡是new乙個例項，而不是用string型別轉換函式
typeof(str)//object
var str2 = string(222)//如果使用型別轉換函式得到的還是型別
ypeof(str2)//string

此時的str就是乙個顯式建立的基本包裝型別物件，只是一般來說很少這樣去使用

es6中的箭頭函式現在也用的比較頻繁，但是有個需要注意的點是：

函式體內的this物件，就是定義時所在的物件，而不是使用時所在的物件。

其實出現這種情況的根本原因是:箭頭函式沒有this物件，所以箭頭函式的this就是外層**的this

//例子7
var f = 
}  f.getthis()//window

這個例子和前面例子2是基本一樣的，只是把普通函式改寫成箭頭函式，但是此時的this物件已經指向了外層的window。

考慮到這一點可能不好理解，我們再看幾個例子:

//例子8
var g = 
}}  var h = 
}  g.getthis()()//window
h.getthis()()//h

這個例子裡，g的getthis寫法就和之前的例子3一樣，由於函式在全域性環境中執行，所以此時this指向window；h的getthis使用了箭頭函式，所以this指向了外層**塊的this所以，此時this指向的是h。

小結一下，

解析js中的this物件

解析 js 中的 this 物件

JS中的arguments物件解析

js中的陣列物件中的方法解析

解析js中的this物件

解析 js 中的 this 物件

JS中的arguments物件解析

js中的陣列物件中的方法解析

相關推薦