改變JavaScript中函式的內部this指向!
阿新 • • 發佈:2020-12-14
改變JavaScript中函式的內部this指向!
第一種方法 call
call 可以 呼叫函式 + 改變函式內的this指向!
var obj = {
name: 'lvhang'
}
function fun(a, b) {
console.log(this);
console.log(a + b)
}
// 需求, 讓fun函式中的this指向obj物件!還可以進行引數傳遞!
fun(obj, 4, 6);
call 主要作用可以實現繼承!
// call 主要作用可以實現繼承! function Father(uname, age, gender) { this.uname = uname; this.age = age; this.gender = gender; } function Son(uname, age, gender) { Father.call(this, uname, age, gender); } var son = new Son('name', 'age', 'gender'); console.log(son)
第二種方法 apply 方法
1 apply 呼叫函式 + 改變函式內的this指向!
2 第二個引數是一個數組!偽陣列!你必須以一個數組的形式傳過去才可以!
3 apply 的主要應用比如說我們可以利用apply 藉助於數學內建物件求最大值和最小值!
// apply 方法!應用 運用的意思! // 第一個引數還是this的指向! var obj2 = { name: 'lvchengxin' } function fun2(arr) { console.log(this); console.log(arr); } fun2.apply(obj2, ['lvhang']) // 1 apply 呼叫函式 + 改變函式內的this指向! // 2 第二個引數是一個數組!偽陣列!你必須以一個數組的形式傳過去才可以! // 3 apply 的主要應用比如說我們可以利用apply 藉助於數學內建物件求最大值和最小值! // Math.MAX(); var arr = [12,44,6,565,334]; // var res = Math.max.apply(null, arr) // 但是this指向為空是不太合適的!應該是誰呼叫他就指向誰!Math var res = Math.max.apply(Math, arr); var res2 = Math.min.apply(Math, arr); console.log(res, res2);
他和call 的不同之處就在於 他接受的引數必須是一個數組!
第三種方法 bind 方法
不會呼叫函式, 但是能夠改變函式內部的this指向!
引數是和call一樣的!
返回值是指定的this初始值和初始化引數改造的原函式拷貝!也就是返回的是原函式改變this之後產生的新函式!
// bind 方法 var obj3 = { name: 'lvchengxin' } function fun3(a, b) { console.log(this); console.log(a + b); } var f = fun3.bind(obj3, 3, 4) f(); // 不會呼叫函式, 但是能夠改變函式內部的this指向! // 引數是和call一樣的! // 返回值是指定的this初始值和初始化引數改造的原函式拷貝!也就是返回的是原函式改變this之後產生的新函式! // 但是bind 和apply 和 call 不同的是 他不會呼叫函式!
但是bind 和apply 和 call 不同的是 他不會呼叫函式!