面试问题记录

1.谈一谈对闭包的理解

回答：闭包是函数执行时产生的一个私有的作用域，作用域中的私有变量和外界的变量互不干扰，作用域不销毁，这些私有变量也不会销毁。保护和保存了变量，避免全局变量的污染，但是一定情况下占用了内存。

特点：　①函数嵌套函数

　　　　②内部函数可以访问外部函数变量

　　　　③内部函数的参数和变量不会被垃圾回收机制回收

2.箭头函数和普通函数的区别

回答：

　　①箭头函数是匿名函数，不能作为构造函数，不能使用new操作符；

　　②箭头函数不绑定arguments，取而代之使用rest参数...解决；

　　③箭头函数不绑定this，会捕获上下文的this作为自己的this值，普通函数的this指向永远是指向调用它的对象；

　　④箭头函数没有原型属性；

　　⑤箭头函数无法使用bind()、call()、apply()改变this指向；

3.对象的继承

回答：一个对象继承另一个对象，就能使用它的属性和方法。每个函数都有一个prototype属性，指向一个对象，只要修改原型对象，所有实例对象也会发生改变。

任何一个对象，都可以充当其他对象的原型，由于原型对象也是对象，所以它也有自己的原型。因此，就会形成一个“原型链”。

读取对象的某个属性时，JavaScript 引擎先寻找对象本身的属性，如果找不到，就到它的原型去找，如果还是找不到，就到原型的原型去找。如果直到最顶层的Object.prototype还是找不到，则返回undefined。

4.promise的理解 

回答：promise是JS 中进行异步编程的新的解决方案，promise 对象用来封装一个异步操作并可以获取其结果。使用promise时，会有三种状态：①pending，代表初始状态，既不表示成功，也不代表失败；②fulfill满足状态，当我们调用resolve()时，处于该状态，并会回调then()；③reject拒绝状态，主动回调了reject时，就处于该状态，并且会回调.then()或者.catch()；

5.数组常用方法

部分

不改变元素组：

①concat()链接两个数组或多个数组，返回一个合并后的数组；

②join()将数组内的元素连接成字符串，连接符为()内的值，返回连接后的字符串；

③slice(start,end)复制数组内容，start代表开始位置，如果时负值，则代表从尾部第几个开始，end代表从何处结束，值为下标，如果时负值，那么代表是从尾部开始算起的元素，如果没有传递该参数，则代表从start开始到末尾最后一个元素；

④toString()没有参数，会将数组转换成字符串，以逗号进行分割；

改变原数组：

①pup()没有参数，从末尾处删除一个元素，返回值时被删除的元素，如果是空数组则不改变原数组，返回值时undefined；

②push()在数组末尾添加一个或多个元素，返回值是添加后数组的新长度；

③shift()没有参数，从头部删除一个元素，返回值是被删除的元素；

④unshift()在数组头部添加一个或多个元素，返回值是添加后数组的新长度；

⑤splice()向数组添加或删除项目，第一个参数代表要添加或者删除的起始位置，当为负值时代表从数组末尾开始；第二个参数，代表要删除的数量，如果为0，则代表不删除；第三个参数，代表要添加的内容，可以不写，代表不添加；

⑥reverse()颠倒数组的排列顺序；

6.对flex的理解

弹性布局方式，为盒状模型提供最大的灵活性，可以控制元素的排列方式，可以控制整行或者整列的排序方式，或者某一元素在行内或列内的排序方式

7.绝对定位、相对定位、固定定位的区别

绝对定位：以已有相对定位的第一个父元素的左上角为坐标原点进行移动，如果没有父元素或者父元素没有设置相对定位，以浏览器左上角为坐标原点，脱离文档流(子绝)

相对定位：以自身原本坐标为原点移动，占据原有位置，不脱离文档流，行内元素使用相对定位不能转换成行内块(父相)

固定定位：以浏览器视图左上角为坐标原点，脱离文档流，不占据原有位置

8.跨域的解决方法

①通过jsonp跨域

②document.domain + iframe跨域

③location.hash + iframe

④window.name + iframe跨域

⑤postMessage跨域

⑥跨域资源共享（CORS

⑦nginx代理跨域

⑧nodejs中间件代理跨域

⑨WebSocket协议跨域

详细解决方法内容可以看网址 https://segmentfault.com/a/1190000011145364

9.v-if和v-show的区别

都可以控制元素的显示和隐藏

不同点： v-show 只是简单的控制元素的 display 属性来实现元素的显示和隐藏，而 v-if 才是条件渲染，条件为真时进行渲染，条件为假时销毁元素；

　　　　v-show只编译一次，后面其实就是控制css，而v-if不停的销毁和创建，故v-show性能更好一点。

　　　　v-if更适合于带有权限的操作，渲染时判断权限数据，有则展示该功能，没有则删除。v-show更适合于日常使用，可以减少数据的渲染，减少不必要的操作。

10.computed和watch的区别

computed：①支持缓存，只有数据发生变化时，才会重新计算；

　　　　　 ②不支持异步

watch：　   ①不支持缓存，数据发生变化时，立即出发相应的操作；

　　　　　  ②支持异步操作

　　　　　  ③监听数据必须是data中声明过或者父组件传递过来的props中的数据，当数据变化时，触发其他操作，函数有两个参数immediate和deep

　　　　　　　　immediate：组件加载立即触发回调函数执行

　　　　　　　　deep: 深度监听，为了发现对象内部值的变化，复杂类型的数据时使用

11.hash模式和history模式的区别

①url中hash模式有/#，history模式没有

②hash 模式下，仅 hash 符号之前的内容会被包含在请求中，对于后端来说，即使没有做到对路由的全覆盖，也不会返回 404 错误。history 模式下，前端的 URL 必须和实际向后端发起请求的 URL 一致，如果缺少路由处理，会发生404错误

12.Vue组件之间的通信

①父组件向子组件传递数据是通过prop传递，子组件传递数据给父组件通过$emit触发事件来实现

②路由传参，在路由跳转的时候将对应的参数以对象的形式写入，但URL会变得很长，而且如果不是使用路由跳转的界面无法使用对应的取值，在页面刷新时，参数会消失，用查询则不会有这个问题。

③eventbus，非父子组件之间传值，详细内容地址 https://www.cnblogs.com/tanshao/p/9446900.html

13.事件内修饰符

① .stop，阻止事件冒泡

②.prevent，阻止默认事件的发生

③.capture，捕获冒泡，即有冒泡发生时，有该修饰符的dom元素会先执行，如果有多个，从外到内依次执行，然后再按自然顺序执行触发的事件。

④.self，将事件绑定到自身，只有自身才能触发，用于避免冒泡事件的影响

⑤.once，设置事件只能触发一次

14.Vuex状态管理和五个属性

vuex是vue的状态管理工具。它采用了一种集中管理数据的思想，将整个项目中所有的公共数据放在一个统一的仓库中。然后所有组件都可以从这个仓库中读取数据，也可以通过仓库提供的方法修改数据。

五个属性：

　　①state：vuex的基本数据，用来存储变量

　　②getters：从基本数据(state)派生的数据，相当于state的计算属性

　　③mutations：提交更新数据的方法，必须是同步的(如果需要异步使用action)。每个 mutations 都有一个字符串的 事件类型(type) 和 一个 回调函数 (handler)。 回调函数就是我们实际进行状态更改的地方，并且它会接受 state作为第一个参数，提交载荷作为第二个参数。

　　④actions：和mutation的功能大致相同，不同之处在于 Action 提交的是 mutation，而不是直接变更状态。 Action 可以包含任意异步操作

　　⑤modules：模块化vuex，可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰，方便管理。

存储数据的方法：

　　①dispatch：异步操作，写法： this.$store.dispatch(‘mutations方法名’,值)

　　②commit：同步操作，写法：this.$store.commit(‘mutations方法名’,值)