每天10道题，100天后，搞定所有前端面试的高频知识点，加油！！！，在看文章的同时，希望不要直接看答案，先思考一下自己会不会，如果会，自己的答案是什么？想过之后再与答案比对，是不是会更好一点，当然如果你有比我更好的答案，欢迎评论区留言，一起探讨技术 之美。
面试官：请你谈谈JS的this指向问题
1）我们要知道在全局的时候去得到这个this的话，this都会指向windows，因为我们在全局的情况下使用的东西都会被挂载到window上。
<script>
console.log(this) // 指向window
function a(){
console.log(this)
}
a() // 相当于 window.a()，指向的依旧是 window
</script>登录后复制
2）我要知道this的指向是会指向上一个调用者的，代码如下：
看完了代码，我们知道虽然本质上是由于a才调用了d函数，但是中间还是有一层是c调用了d函数，所以this指向上一级会有一个就近原则的，这点很重要！！！
<script>
var a = {
b:10,
c:{
b:12,
d:function(){
console.log(this)
}
}
}
a.c.d() // {b: 12, d: ƒ}
</script>登录后复制
3）我们要知道箭头函数是没有作用域的，也就是说是没有自己的this，它的this永远向的是上一级的this，下面给出一道某大厂的面试题，大家可以猜一下最后的打印结果是什么？
假设你已经仔细的看完了这道面试题，相信你心中已经有了答案是66了，为什么呢？，要知道箭头函数是没有自己的this的，所以需要其去上一级去寻找this，而上一级处于全局作用域，所以打印的便是全局已经挂载的id数66。
<script>
var id = 66
function a(){
setTimeout(()=>{
console.log(this.id)
},500)
}
a({id:22}) // 猜猜结果是什么？
</script>登录后复制
那我们如何改变this的指向，去控制this指向我们想要的结果呢？给出如下三种方法：
<script>
var id = 66
function a(){
setTimeout(()=>{
console.log(this.id || this)
},500)
}
// call => {} 改变之后并执行一次
a.call({id:22}) // 打印22
// apply => [] 改变之后并执行一次
a.apply([12]) // 打印 [12]
// bind() 不调用，只改变this指向
a.bind(a(id=32)) // 32
</script>登录后复制
面试官：说一说call apply bind的作用和区别？
面试官：请你谈谈对事件委托的理解
<body>
<ul id="ul">
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<button id="btn">点我添加一个li</button>
<script>
// 事件委托
let ul = document.getElementById("ul")
ul.addEventListener('click',(event)=>{
console.log(event)
event = event || window.event
let target = event.target
if(target.nodeName == 'LI'){
alert(target.innerHTML)
}
})
let btn = document.getElementById('btn')
btn.addEventListener('click',()=>{
let li = document.createElement('li')
li.textContent = ul.children.length
ul.appendChild(li)
})
</script>
</body>登录后复制
面试官：说一说promise是什么与使用方法？
面试官：说一说跨域是什么？如何解决跨域问题？
面试官：说一说JavaScript有几种方法判断变量的类型？
面试官：说一说JS实现异步的方法？
面试官：说一说数组去重都有哪些方法？
面试官：说一说es6中箭头函数？
面试官：说一说JS变量提升？
【推荐学习：javascript高级教程】
以上就是看看这些前端面试题，带你搞定高频知识点（七）的详细内容，更多请关注Work网其它相关文章！