溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
都說 JavaScript 是一種很靈活的語言，這其實也可以說它是一個混亂的語言。它把 函數式編程 和 面向對象編程 糅合一起，再加上 動態語言 特性，簡直強大無比（其實是不能和C++比的，^_^ ）。
JS 里的 this
目錄
* 一個特例
* 開始判斷
* 法則一：對象方法中的this指向對象本身（箭頭函數形式的除外）
* 法則二：多層嵌套函數中的this指向等同于包含該this的最近一個function的this
* 法則三：箭頭函數以及非指向對象方法中的function的情況下this指向window
* 習題集
* 普通函數中的this
* 函數執行后返回另外一個函數中的this（普通函數中）
* 多層嵌套函數中的this（定時器&箭頭函數）1
* 多層嵌套函數中的this（定時器&箭頭函數）2
一個特例
在正式開始之前，我們先來說一個特例。
// 構造函數
function Student(name) {
this.name = name
}
// 創建小明和小紅兩個實例
var XM = new Student('xiaoming')
var XH = new Student('xiaohong')
// 輸出信息
console.log(XM) // Student {name: "xiaoming"}
console.log(XH) // Student {name: "xiaohong"}
在構造函數中，this上的值會在創建實例的時候被綁定到新創建的實例上。不適用于下面的判斷方法，所以特此說明。
開始判斷
下面是一個典型例子，我們的分析從這里開始。
var x = {
name: 'bw2',
getName1: function() {
console.log(this)
},
getName2: function() {
setTimeout(() => {
console.log(this)
},0)
},
getName31: () => {
console.log(this)
},
getName32: function() {
return function() {
console.log(this)
}
}
}
x.getName1() // {name: "bw2", getName1: ƒ}
x.getName2() // {name: "bw2", getName1: ƒ}
x.getName31() // Window {stop: ƒ, open: ƒ, alert: ƒ, confirm: ƒ, prompt: ƒ, …}
x.getName32()() // Window {stop: ƒ, open: ƒ, alert: ƒ, confirm: ƒ, prompt: ƒ, …}
法則一：對象方法中的this指向對象本身（箭頭函數形式的除外）
var x = {
name: 'bw2',
getName1: function() {
console.log(this)
}
}
x.getName1() // {name: "bw2", getName1: ƒ}
法則二：多層嵌套函數中的this指向等同于包含該this的最近一個function的this
箭頭函數沒有獨立的this作用域，所以繼續往外層走，走到了getName: function(){}。那么就是他了，this指向等同于這個function內部的this指向。根據法則一，this指向對象本身。
var x = {
name: 'bw2',
getName2: function() {
console.log(this) // 等同于此處的this
setTimeout(() => {
console.log(this) // 原始的this位置
},0)
}
}
x.getName2() // {name: 'bw2', getName1: ƒ}
我們可以試著在瀏覽器中運行，看看結果。
法則三：箭頭函數以及非指向對象方法中的function的情況下this指向window
根據法則二，this是指向最近的function，因此，這里的this等同于返回的函數中的this，不是對象方法中的this，所以，指向全局。
是不是感覺有點奇怪？不過實踐證明確實如此。
var x = {
name: 'bw2',
getName31: () => {
console.log(this)
},
getName32: function() {
return function() {
console.log(this)
}
}
}
x.getName31() // Window {stop: ƒ, open: ƒ, alert: ƒ, confirm: ƒ, prompt: ƒ, …}
x.getName32()() // Window {stop: ƒ, open: ƒ, alert: ƒ, confirm: ƒ, prompt: ƒ, …}
習題集
歡迎大家按照法則一到三依次判斷，猜測結果，并在瀏覽器下測試。測試結果也可以回復，大家一起討論。
因本人能力有限，該系列法則可能在部分情況下失效。歡迎大家一起討論。
下面是做題時間。
普通函數中的this
function x() {
console.log(this)
}
x()
函數執行后返回另外一個函數中的this（普通函數中）
function xx(){
return function() {
console.log(this)
}
}
xx()()
多層嵌套函數中的this（定時器&箭頭函數）1
var x = {
name: 'bw2',
getName: () => {
setTimeout(() => {
console.log(this)
},0)
}
}
x.getName()
多層嵌套函數中的this（定時器&箭頭函數）2
var x = {
name: 'bw2',
getName: () => {
setTimeout(function() {
console.log(this)
},0)
}
}
x.getName()
再次說明，該法則為實驗性法則，未進行大范圍的測試，不保證在所有情況下都有一致的結果。如果你發現了法則判斷失敗的情況，歡迎留言，一起探討。
總結
以上所述是小編給大家介紹的Mysql 5.7.19 winx64 ZIP Archive 安裝及使用教程，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
