button.onclick = function(){
console.log(this) //button 触发事件的元素
}
button.addEventListener('click', function(){
console.log(this) //button 该元素的引用
})
$('ul').on('click', 'li', function(){
console.log(this) // 看文档啊！
})
只有看文档才知道啊！ MDN
this就是call的第一个参数
再来一个有难度的
function X(){
return object = {
name: 'object',
f1(x){
x.f2()
},
f2(x){
console.log(this) //A
}
}
}
var options = {
name: 'options',
f1(){},
f2(){
console.log(this) //B
}
}
var x = X()
x.f1(options) //B
function X(){
return object = {
name: 'object',
f1(x){
x.f2.call(this)
},
f2(x){
console.log('这是object的f2')
console.log(this) //C object/options
}
}
}
var options = {
name: 'options',
f1(){},
f2(){
console.log('这是options的f2')
console.log(this) //D object/options
}
}
var x = X()
x.f1(options) //D object
function X(){
return object = {
name: 'object',
f1(x){
this.options = x
this.f2() //这是object的f2
},
f2(){
console.log('这是object的f2')
this.options.f2.call(this) //这是options的f2 name: object
}
}
}
var options = {
name: 'options',
f1(){},
f2(){
console.log('这是options的f2')
console.log(this)
}
}
var x = X()
x.f1(options) //这是object的f2 这是options的f2 name: object
