css:
1. 分析比较 opacity: 0、visibility: hidden、display: none 优劣和适用场景?
display:none: 会让元素完全从渲染树中消失，渲染的时候不占据任何空间, 不能点击，
visibility: hidden:不会让元素从渲染树消失，渲染元素继续占据空间，只是内容不可见，不能点击
opacity: 0: 不会让元素从渲染树消失，渲染元素继续占据空间，只是内容不可见，可以点击
2. BFC ?块级格式化上下文，是一个独立的渲染区域，让处于 BFC 内部的元素与外部的元素相互隔离，使内外元素的定位不会相互影响。什么情况下会触发？
触发条件: 根元素，position: absolute/fixed， display: inline-block / table， float 元素， ovevflow !== visible
3、transition和animation的区别 ?
Animation和transition大部分属性是相同的，他们都是随时间改变元素的属性值，他们的主要区别是transition需要触发一个事件才能改变属性， 而animation不需要触发任何事件的情况下才会随时间改变属性值，并且transition为2帧，从from .... to，而animation可以一帧一帧的。
4. 为什么css放在顶部而js写在后面 ?
1.浏览器预先加载css后，可以不必等待HTML加载完毕就可以渲染页面了
2.其实HTML渲染并不会等到完全加载完在渲染页面，而是一边解析DOM一边渲染。
3.js写在尾部，主要是因为js主要扮演事件处理的功能，一方面很多操作是在页面渲染后才执行的。另一方面可以节省加载时间，使页面能够更加的加载，提高用户的良好体验
js:
5. GET/POST: HTTP 协议从未规定 GET/POST 的请求长度限制是多少。对get请求参数的限制是来源与浏览器或web服务器，浏览器或web服务器限制了url的长度。一般 get可用于缓存，post需要与数据库交互，不能缓存。
6. a.b.c.d 和 a['b']['c']['d']，哪个性能更高？
要考虑 [ ] 中是变量的情况，再者，从两种形式的结构来看，显然编译器解析前者要比后者容易些，自然也就快一点.
7. link 与 @import 的区别 ？
link功能较多，可以定义 RSS，定义 Rel 等作用，而@import只能用于加载 css
当解析到link时，页面会同步加载所引的 css，而@import所引用的 css 会等到页面加载完才被加载
@import需要 IE5 以上才能使用
link可以使用 js 动态引入，@import不行
8. 模块化,require与import的区别?
require支持 动态导入，import不支持，正在提案 (babel 下可支持)
require是 同步 导入，import属于 异步 导入
require是 值拷贝，导出值变化不会影响导入值；import指向 内存地址，导入值会随导出值而变化
5. babel编译原理 ？
babylon 将 ES6/ES7 代码解析成 AST
babel-traverse 对 AST 进行遍历转译，得到新的 AST
新 AST 通过 babel-generator 转换成 ES5
6. call, apply哪个的性能好一点？
由于apply中定义的参数格式（数组），使得被调用之后需要做更多的事，需要将给定的参数格式改变（步骤8）。 同时也有一些对参数的检查（步骤2），在call中却是不必要的。
7. setTimeout、Promise、Async/Await 的区别 ？ settimeout的回调函数放到宏任务队列里，等到执行栈清空以后执行；
promise.then里的回调函数会放到相应宏任务的微任务队列里，等宏任务里面的同步代码执行完再执行；async函数表示函数里面可能会有异步方法，await后面跟一个表达式，async方法执行时，遇到await会立即执行表达式，然后把表达式后面的代码放到微任务队列里，让出执行栈让同步代码先执行。
8. Promise 构造函数是同步执行还是异步执行，那么 then 方法呢？promise构造函数是同步执行的，then方法是异步执行的
9. 原型链？
只有函数对象才存在prototype，所有对象(除了Object.prototype)都存在__proto__；普通对象都是通过函数创建的；普通对象__proto__指向当前函数对象的原型。
10. 事件委托？
通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件
原理: 利用冒泡的原理，把事件加到父级上，触发执行效果。
vue:
0. Vue 的父组件和子组件生命周期钩子执行顺序是什么?
加载渲染过程父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted
子组件更新过程父beforeUpdate->子beforeUpdate->子updated->父updated
父组件更新过程父beforeUpdate->父updated
销毁过程父beforeDestroy->子beforeDestroy->子destroyed->父destroyed
1. React / Vue 项目时为什么要在列表组件中写 key，其作用是什么？
key的作用就是更新组件时判断两个节点是否相同。相同就复用，不相同就删除旧的创建新的。key的唯一性 更快，更准确。
2. 什么是virtual dom？
virtual dom就是原生dom在内存中的js对象映射，但不是完全复制，它比真实dom节点在属性上简化了，是更加轻量级，相当于是数据和原生dom的一层缓存。
3. virtual dom操作比原生dom快？
先说原生dom，dom发生变化后，就需要重新布局，绘制，渲染等等，一般说的原生dom慢，主要是说重新渲染，绘制的消耗。
对于初始渲染，其实没有大的差别，毕竟virtual dom最终也是要渲染成原生dom的。主要的差异体现在后续的变更上。js计算肯定要比DOM操作快。
3. Virtual DOM 真的比操作原生 DOM 快吗？
性能 vs. 可维护性的取舍。框架的意义在于为你掩盖底层的 DOM 操作，让你用更声明式的方式来描述你的目的，从而让你的代码更容易维护。没有任何框架可以比纯手动的优化 DOM 操作更快。
4.1 虚拟dom的实现原理 ？
用 JavaScript 对象模拟真实 DOM 树，对真实 DOM 进行抽象；
diff 算法 — 比较两棵虚拟 DOM 树的差异；
patch 算法 — 将两个虚拟 DOM 对象的差异应用到真正的 DOM 树。
4. 为什么 Vuex 的 mutation 和 Redux 的 reducer 中不能做异步操作？
因为所有异步函数是不能追踪的，由于vuex需要通过mutation记录每次store的变化，因此mutation中不允许有异步操作就像redux中的reducer中的操作必须也是同步的一样。同时异步操作是成功还是失败不可预测，什么时候进行异步操作也不可预测；当异步操作成功或失败时，如果不 commit(mutation) 或者 dispatch(action)，Vuex 和 Redux 就不能捕获到异步的结果从而进行相应的操作。
5. Vue 的响应式原理中 Object.defineProperty 有什么缺陷？为什么在 Vue3.0 采用了 Proxy，抛弃了 Object.defineProperty？
Object.defineProperty无法监控到数组下标的变化，导致通过数组下标添加元素，不能实时响应；
Object.defineProperty只能劫持对象的属性，从而需要对每个对象，每个属性进行遍历，如果，属性值是对象，还需要深度遍历。Proxy可以劫持整个对象，并返回一个新的对象。
Proxy不仅可以代理对象，还可以代理数组。还可以代理动态增加的属性。
6. react项目中，constructor(){ this.target = this.func.bind(this); },JSX里onChange={this.target}的写法，
为什么要比非bind的func = () => {}的写法效率高, 原理?
bind之后锁定了上下文，免去了向上查找执行上下文的过程, 再初始化的时候指定作用域this,只会执行一次，还会避免子组件的一些无畏的渲染。
8. react 受控组件+非受控组件的区别？使用场景等？
受控元素，一般用在需要动态设置其初始值的情况；例如某些form表单信息编辑时，input表单元素需要初始显示服务器返回的某个值然后进行编辑。
非受控元素， 一般用于无任何动态初始值信息的情况； 例如form表单创建信息时，input表单元素都没有初始值，需要用户输入的情况
7. 组件中 data 为什么是一个函数？
因为组件是用来复用的，且 JS 里对象是引用关系，如果组件中 data 是一个对象，那么这样作用域没有隔离，子组件中的 data 属性值会相互影响，如果组件中 data 选项是一个函数，那么每个实例可以维护一份被返回对象的独立的拷贝，组件实例之间的 data 属性值不会互相影响；而 new Vue 的实例，是不会被复用的，因此不存在引用对象的问题
8. 对 Vue 项目进行哪些优化？
1. 长列表性能优化； 2.事件的销毁；3. 图片资源懒加载； 4. 路由懒加载； 5 . 第三方插件的按需引入; 6. Webpack 对图片进行压缩; 7. 减少 ES6 转为 ES5 的冗余代码; 8. 提取公共代码; 9. 模板预编译; 10. 提取组件的 CSS
9. 对于即将到来的 vue3.0 特性你有什么了解的吗？
监测机制的改变=》3.0 将带来基于代理 Proxy 的 observer 实现，提供全语言覆盖的反应性跟踪。这消除了 Vue 2 当中基于 Object.defineProperty 的实现所存在的很多限制：
1.只能监测属性，不能监测对象; 2. 检测属性的添加和删除；3. 检测数组索引和长度的变更；4. 支持 Map、Set、WeakMap 和 WeakSet。
模板方面没有大的变更，只改了作用域插槽，
1. Object.defineProperty -> proxy : defineProperty会作用于对象的的属性-get/set ， 而Proxy是直接在对象本身上架构一层拦截，颗粒度变大了，由属性到对象。
10. 使用 Vue 框架踩过最大的坑是什么？怎么解决的？
11. 动态路由-权限控制？方案大致有两种：
一是静态注册好所有的路由，在登录后根据登录的角色所拥有的权限去一个个对比，控制哪些页面进行隐藏和显示，这种方法实现的逻辑通俗易懂，便于理解，但仅适用于微小型项目使用，如果项目中页面有几十个，不建议使用这种方案。
二是初始化路由时只注册登录、注册这种不需要权限就可以访问的路由，在登录时请求接口更根据后台返回的菜单进行处理后动态添加到路由中
注意：main.js中写上刷新时再去执行以下动态添加路由的方法。确保刷新数据后还有路由存在。要把404添加在动态路由之后。
vue-router:
1.vue-router 有哪几种导航守卫? => 全局守卫; 路由独享守卫(beforEnter);路由组件内的守卫
2. $route和 $router的区别是什么？
router为VueRouter的实例，是一个全局路由对象，包含了路由跳转的方法、钩子函数等。
route 是路由信息对象||跳转的路由对象，每一个路由都会有一个route对象，是一个局部对象，包含path,params,hash,query,fullPath,matched,name等路由信息参数。
GIT:
git branch -vv 本地与远程分支的关系（是否关联）
git branch --set-upstream branch-name origin/branch-name 关联本地与远程分支
git stash push -m '备注信息’ / git stash pop
git blame ‘文件名称' 查看文件由哪次提交修改, 还可以限定范围：git blame -L 2,5 index.html，显示2-5行内容
git clone -b 分支名仓库地址， clone指定分支
