目录
1. 防抖和节流
防抖：单位时间内，频繁触发事件，只执行最后一次。
比如点击按钮，2秒后调用函数，结果在1.5秒的时候又点了，则会重新计算2秒后在调用函数。
应用场景：搜索框、输入框
思路：利用定时器，每次触发先清除定时器（）
节流：单位时间内，频繁触发事件，只执行一次
应用场景比较多的是：快速点击、鼠标滑动、scroll事件、下拉刷新
思路：利用定时器，等定时器结束再开启定时器
2. js闭包
什么是闭包：闭包就是能够读取其他函数内部变量的函数
function a() {
let a1 = 1;
return function() {
return a1
}
}
闭包存在意义：
可以延长变量的生命周期4可以创建私有的环境
闭包好处：
可以读取其他函数的内部变量
将变量始终保存在内存中
可以封装对象的私有属性和方法
坏处：消耗内存、使用不当会造成内存溢出问题
vue中的data为什么是一个函数？（面试常问）
Vue 中的 data 必须是个函数，因为当 data 是函数时，组件实例化的时候这个函数将会被调用，返回一个对象，计算机会给这个对象分配一个内存地址，实例化几次就分配几个内存地址，他们的地址都不一样，所以每个组件中的数据不会相互干扰，改变其中一个组件的状态，其它组件不变。
简单来说，就是为了保证组件的独立性和可复用性，如果 data 是个函数的话，每复用一次组件就会返回新的 data，类似于给每个组件实例创建一个私有的数据空间，保护各自的数据互不影响
3. ES6面试题
3.1 var let const 区别
var： 存在变量提升；存在变量覆盖，已经被定义且赋值的变量，如果再次被赋值，则以后一次值为准；没有块级作用域；
const：定义的是常量，声明之后必须赋值；定义的值不能去修改，否则报错；有块级作用域；不存在变量提升和变量覆盖；对于数组和对象的元素修改，不算做对常量的修改，不会报错。
let： 有块级作用域；不存在变量提升和变量覆盖；let不允许在相同的作用域中重复声明，注意是相同作用域，不同作用域重复声明不会报错
3.2 解构赋值
let a = 1; let b = 2; 如果在不声明第三个变量的前提下，使a=2, b=1？
答案：[a, b] = [b, a]
3.3 如何利用es6快速的去重？
let arr = [23, 12, 13, 33, 22, 12, 21]
let item = [...new Set(arr)]
3.4 Promise 面试题 以下代码的执行结果是？
const promise = new Promise((resolve, reject) => {
console.log(1)
resolve()
console.log(2)
})
promise.then(() => {
console.log(3)
})
console.log(4)
答案：1,2,4,3
解释：以上考察的是关于promise的原理，promise的构造函数是同步执行的，当new Promise的一瞬间，1,2 就立刻被执行，而 .then方法是异步执行的，当执行完1和2之后，会执行输出4，最后执行输出3
4. Vue相关
4.1 MVC和MVVM的区别
MVC：M（model数据）、V（view视图），C（controlle控制器）缺点是前后端无法独立开发，必须等后端接口做好了才可以往下走；前端没有自己的数据中心，太过依赖后台
MVVM：M（model数据）、V（view视图）、VM（viewModel控制数据的改变和控制视图）
html部分相当于View层，可以看到这里的View通过通过模板语法来声明式的将数据渲染进DOM元素，当ViewModel对Model进行更新时，通过数据绑定更新到View。 Vue实例中的data相当于Model层，而ViewModel层的核心是Vue中的双向数据绑定，即Model变化时VIew可以实时更新，View变化也能让Model发生变化
MVVM与MVC最大的区别就是：它实现了View和Model的自动同步，也就是当Model的属性改变时，我们不用再自己手动操作Dom元素，来改变View的显示，而是改变属性后该属性对应View层显示会自动改变
4.2 v-model 原理
是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调从而达到数据和视图同步。
4.3 vue中的data为什么是一个函数？（面试常问）
实际上就是一个闭包，因为vue是单页面应用，是由很多组件构成，每一个组件中都有一个data，所以通过闭包给每一个组件创建了一个私有的作用域，这样就不会相互影响。
4.4 v-if 和 v-show的区别
v-if是通过添加和删除元素来进行显示或者隐藏
v-show是通过操作DOM修改display样式来修改元素的显示和隐藏
如果需要频繁的进行元素的显示和隐藏使用v-show性能更好
4.5 v-for中为什么要有key
key 可以提高虚拟DOM的更新效率。
在vue中，默认“就地复用”的策略，在DOM操作的时候，如果没有key 就会造成选项错乱
key 只能是字符串或者number，其他类型不可以
1. 虚拟DOM中key的作用：
key是虚拟DOM对象的标识，当数据发生变化时，Vue会根据【新数据】生成【新的虚拟DOM】，随后Vue进行【新的虚拟DOM】与【旧的虚拟DOM】差异比较比较规则如下：
2. 比较规则：
1）旧虚拟DOM找到了与新虚拟DOM相同的key：
若虚拟DOM中内容没变，直接使用之前的真实DOM
若虚拟DOM中内容变了，则生成新的真实DOM，随后替换掉页面中之前的真实DOM
3. 用index作为key可能会引发的问题：
1）若对数据进行：逆序添加、逆序删除等破坏顺序的操作，会产生没有必要的真实DOM更新==>界面效果没问题，但效率低
2）如果结构中还包含输入类的DOM，会产生错误的DOM更新 ==> 界面有问题
4.6 打包后 dist 目录过大，解决办法？
1. dist打包生成的文件中有 .map 文件，可以删除。在 vue.config.js文件中配置：productionSourceMap: false
2. 组价和路由使用懒加载、按需引入等
3. 对于文件和图片进行压缩。 安装压缩组件： compression-webpack-plugin
安装后进行导入配置：
最小化代码 minisize: true
分割代码： splitChunksl
超过限定值的文件进行压缩，threshold: 文件大小（字节为单位）
最低0.47元/天 解锁文章
扫一扫
4131
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
