系统API中this的指向分析

函数的this分析（部分）

1、setTimeout

 function hySetTimeout(fn, duration) {
    fn.call("abc")  
}

 hySetTimeout(function() {
     console.log(this) //window
 }, 3000)

setTimeout(function() {
    console.log(this) // 实际输出：window（非严格模式下，回调的this默认指向全局对象）
}, 3000)

this指向的内容是根据里边函数有关

2、事件监听**

const boxDiv = document.querySelector('.box')
boxDiv.onclick = function() {
    console.log(this)
}

boxDiv.addEventListener('click', function() {
    console.log(this)
    }
    boxDiv.addEventListener('click', function() {
    console.log(this)
    }
    boxDiv.addEventListener('click', function() {
    fn.call(boxDiv)//遍历数组
    console.log(this)
    }
}

如果把addEventListener换成onclick，后边的会把上边的覆盖，但是addEventListener不会，内部会把函数收集到一个数组当中，发生点击的时候，会从数组中遍历出来

3、数组 forEach/map/filter/find

var names = ["abc", "cba", "nba"]
names.forEach(function(item) {
    console.log(item, this)
})

this指向window

var names = ["abc", "cba", "nba"]
names.forEach(function(item) {
    console.log(item, this)
},"abc")

this指向"abc"

map/filter/find也相同