面试题汇总

static目录和src下的assets的区别？

assets下的文件会被loader()转译后存放在dist-static-img文件下，static下的文件会直接拷贝到dist-static下。
建议大的文件放到static下

vuex刷新后数据丢失问题。

在app.vue里面created生命周期函数内绑定一个beforeunload事件，在页面刷新前将vuex当前状态存在locastorage中，页面重新加载时在created生命周期函数内判断locastorage中如果有值，将当前值通过this.$store.replaceState(state: Object)存入state里。

export default {
  name: 'App',
  created () {
    //在页面加载时读取sessionStorage里的状态信息
    if (sessionStorage.getItem("store") ) {
        this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
    } 

    //在页面刷新时将vuex里的信息保存到sessionStorage里
    window.addEventListener("beforeunload",()=>{
        sessionStorage.setItem("store",JSON.stringify(this.$store.state))
    })
  }
}

computed和watch属性的区别？

computed的依赖属性其中之一发生了变化，当前computed属性都会更新。watch中能监听某一个属性，当属性变化时触发回调。
假如c = a(1) + b(2)，使用comuted属性时，当a或者b改变都会触发c，但是如果a=>2,b=>1,此时是不会触发c的watch回调。

解释一下Array响应式实现？

当我们初始化data属性是一个数组时，会将Array.prototype.push，pop，保存起来，同时重新给当前数组声明push,pop函数，这样它就不会调用原型链上的方法，这样就可以在自定义的函数将数据处理为可响应式的。

说明一下vue的响应式原理实现？

当我们初始化date时，会使用Object.defineProperty定义对象属性set,get描述符，在生成vnode时会获取对象的值，此时会调用属性的get方法，同时会收集依赖，当属性值改变时调用set方法，通知依赖进行更新。更新过程其实就是对比新的vnode和旧的vnode，基本上key和tag相同，说明是同一个节点，可能就是更新dom的textcontent，如果不相同则生成新的dom节点，删除旧的dom节点。

如果理解发布订阅模式？

定义了对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知，并自动更新。

那些会隐式转换为false

undefined,null,"",0,false,NaN,其它的都隐式转换为true。

• console.log(i++);
  也是需要先输出i，再进行++自增运算。
• . 和 new ,new xx() 运算符优先级

function Foo() {
    getName = function () { alert (1); };
    return this;
}
Foo.getName = function () { alert (2);};
Foo.prototype.getName = function () { alert (3);};
var getName = function () { alert (4);};
function getName() { alert (5);}
 
//请写出以下输出结果：
Foo.getName();
getName();
Foo().getName();
getName();
new Foo.getName();
new Foo().getName();
new new Foo().getName();

new Foo() >> . >> () 函数调用 >> new

为什么使用前端框架

• 组件化使工程易于维护、易于组合扩展
• UI与状态的同步，提高了开发效率