2021前端面试题汇总

中级前端面试题
1.双向绑定的原理

1.js数组去重

let arr = [1,1,2,3,4,5,5,6,6];

var array = []
for(i=0;i<arr.length;i++){
    if(array.indexOf(arr[i]) === -1){
        array.push(arr[i])
    }
}
console.log(array)

2.call和apply的区别

共同之处：
改变this指向，都可以用来调用一个对象的一个方法，以另一个对象替换当前对象。
call 传的参数是单个，apply是数组

3.computed和watch的区别和运用的场景

computed：有缓存
当我们需要进行数值计算，并且依赖与其他数据时，应该使用computed

没有缓存，更多的是‘观察’的作用，类似于某些数据的监听回调，当我们需要在数据变化时执行异步或开销较大的操作时，应使用watch。使用watch选项允许我们执行异步操作，限制我们执行该操作的频率，并在我们得到最终结果前，设置中间状态。这些都是计算属性无法做到的

4.vue组件中data为什么必须是函数

每一个vue组件都是一个vue实例，通过new Vue()实例化，引用同一个对象，如果data直接是一个对象的话，那么一旦修改其中一个组件的数据，其他组件相同数据就会被改变。
而data是函数的话，每个vue组件的data都因为函数有了自己的作用域，互不干扰。
5.foreach和map的区别

forEach()返回值是undefined，不可以链式调用。
map()返回一个新数组，原数组不会改变。