做前端開發已經半年之多了，前幾天看見apply時心生疑惑，于是查閱了好多資料但還是不太理解，只知道是源于this的問題，今天偶然看到了阮一峰大佬的講解js中的this問題（http://www.ruanyifeng.com/blog/javascript/）感覺豁然開朗啊！于是自己做一下筆記如下：

一、原理

this指的是函數運行時所在的環境

例子：

var obj = {foo: function () { console.log(this.bar) },bar: 1 };var foo = obj.foo; var bar = 2;obj.foo() // 1 foo運行在obj環境，所以this指向obj foo() // 2 foo運行在全局環境，所以this指向全局環境

很多書上，博客都是這樣講的；但是卻沒有講為什么為這樣呢？這就要說到JavaScript的數據結構設計（阮一峰大佬的講解（http://www.ruanyifeng.com/blog/2018/06/javascript-this.html）了。

obj.foo()是通過obj找到foo，所以就是在obj環境執行。一旦var foo = obj.foo，變量foo就直接指向函數本身，所以foo()就變成在全局環境執行。

一、用法

情況一：純粹的函數調用

這是函數的最通常用法，屬于全局性調用，因此this就代表全局對象。請看下面這段代碼，它的運行結果是1。

var x = 1; function test() {console.log(this.x); } test(); // 1

情況二：作為對象方法的調用

函數還可以作為某個對象的方法調用，這時this就指這個上級對象。

function test() {console.log(this.x); }var obj = {}; obj.x = 1; obj.m = test;obj.m(); // 1

情況三 作為構造函數調用

所謂構造函數，就是通過這個函數，可以生成一個新對象。這時，this就指這個新對象。

function test() {this.x = 1; }; var obj = new test(); console.log(obj.x) // 1
//驗證this是不是在全局環境 var x = 2 function test() {this.x = 1; }var obj = new test();console.log(obj.x) // 1 console.log(x) // 2 可以看到x 還是2

情況四 call、apply 調用

call()、apply()是函數的一個方法，作用是改變函數的調用對象。它的第一個參數就表示改變后的調用這個函數的對象。因此，這時this指的就是這第一個參數。

var x = 0; function test() {console.log(this.x); }var obj = {x: 1,m: test };obj.m.apply() // 0

apply()的參數為空時，默認調用全局對象。因此，這時的運行結果為0，證明this指的是全局對象。

如果把最后一行代碼修改為

obj.m.apply(obj); //1

運行結果就變成了1，證明了這時this代表的是對象obj

----------------------------------------------------------------------------

補充：

?

轉載于:https://www.cnblogs.com/yangchin9/p/10725200.html

總結

以上是生活随笔為你收集整理的JS-this的使用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。