建站
咨詢
售后
建站咨詢
新聞中心
這篇“JavaScript中this有幾種綁定規(guī)則”文章的知識點大部分人都不太理解，所以小編給大家總結了以下內(nèi)容，內(nèi)容詳細，步驟清晰，具有一定的借鑒價值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來看看這篇“JavaScript中this有幾種綁定規(guī)則”文章吧。
網(wǎng)站建設哪家好，找創(chuàng)新互聯(lián)！專注于網(wǎng)頁設計、網(wǎng)站建設、微信開發(fā)、微信小程序開發(fā)、集團企業(yè)網(wǎng)站建設等服務項目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了騰沖免費建站歡迎大家使用！
我們先說一個最簡單的this在全局指向的是什么呢？
這個問題很簡單在瀏覽器中測試this，全局指向的是window，不過在開發(fā)過程中this很少在全局使用，一般都是在函數(shù)內(nèi)的
this有幾種綁定規(guī)則？
綁定一：默認綁定
// 1.案例一：
function foo（） {
console.log（this）
}
foo（）//window
// 2.案例二：
function foo1（） {
console.log（this）
}
function foo2（） {
console.log（this）
foo1（）
}
function foo3（） {
console.log（this）
foo2（）
}
foo3（）//window
// 3.案例三：
var obj = {
name: "why",
foo: function（） {
console.log（this）
}
}
var bar = obj.foo
bar（） // window
綁定二：隱式綁定
// 1.案例一：
var obj = {
name: "why",
foo: foo
}
obj.foo（） // obj對象
// 2.案例二：
var obj = {
age: "哈哈哈",
eating: function （） {
console.log（this + "在吃東西"）
},
running: function （） {
console.log（this + "在跑步"）
}
}
obj.eating（）//obj對象
obj.running（）//obj對象
var fn = obj.eating
fn（）
//window,為什么是window呢因為把obj.eating這個函數(shù)賦值給了fn，fn在全局調用的所以指向的是window
// 3.案例三：
var obj1 = {
name: "obj1",
foo: function （） {
console.log（this）
}
}
var obj2 = {
name: "obj2",
bar: obj1.foo
}
obj2.bar（）//obj2對象
綁定三：顯示綁定
function foo（） {
console.log（"函數(shù)被調用了", this）
}
//1.foo直接調用和call/apply調用的不同在于this綁定的不同
//foo直接調用指向的是全局對象（window）
foo（）
var obj = {
name: "obj",
// age:foo//可以簡寫這一步
}
//call/apply是可以指定this的綁定對象
foo.call（obj）//obj對象
foo.apply（obj）//obj對象
foo.apply（"aaaa"）//aaaa
// 2.call和apply有什么區(qū)別？
function sum（num1, num2, num3） {
console.log（num1 + num2 + num3, this）
}
sum.call（"call", 20, 30, 40）//傳遞參數(shù)后面可以傳無限個數(shù)值，都是用逗號分割
sum.apply（"apply", [20, 30, 40]）//傳遞參數(shù)用數(shù)組接收，一樣可以傳無限個數(shù)值，用逗號分割
// 3.call和apply在執(zhí)行函數(shù)時，是可以明確的綁定this, 這個綁定規(guī)則稱之為顯示綁定
綁定四：new綁定
// 我們通過一個new關鍵字調用一個函數(shù)時（構造器）， 這個時候this是在調用這個構造器時創(chuàng)建出來的對象
// this = 創(chuàng)建出來的對象
// 這個綁定過程就是new 綁定
function Person（name, age） {
this.name = name
this.age = age
}
var p1 = new Person（"哈哈哈", 18）
console.log（p1.name, p1.age）//哈哈哈，18
var p2 = new Person（"呵呵呵", 30）
console.log（p2.name, p2.age）//呵呵呵，30
這些的案例可以給我們什么樣的啟示呢？
1.函數(shù)在調用時，JavaScript會默認給this綁定一個值；
2.this的綁定和定義的位置（編寫的位置）沒有關系；
3.this的綁定和調用方式以及調用的位置有關系；
4.this是在運行時被綁定的;
最后說一下默認綁定和顯示綁定bind沖突： 優(yōu)先級（顯示綁定）
以上就是關于“JavaScript中this有幾種綁定規(guī)則”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對大家有幫助，若想了解更多相關的知識內(nèi)容，請關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
文章名稱：JavaScript中this有幾種綁定規(guī)則
標題網(wǎng)址：http://ef60e0e.cn/article/podsci.html
