vue 面试题二

vue 面试题2

1. vue的 模板template会编译成什么？
   答案：
   vue的模板实际上被编译成了render渲染函数，
   webpack vue-template-compiler
   把模板转换为渲染函数
   渲染函数执行并返回虚拟dom节点

2. 请用js对象形式描述html标签（js模拟dom节点，虚拟dom）
   <p> <a>内容</a> <span>行内</span></p>

• 虚拟dom描述
  1. 标签名tag
  2. 属性 attrs/propertys
  3. 子节点 children

**vue中动态创建组件**
<component :is="">动态组件
render(createElement){
return createElement(标签，属性，子节点)
}
eg:
{
tag:"p",
propertys:{
  id:"best"
}
children:[
{}tag:"a",children:["内容"]}
{}tag:"span",children:["行内"]}
]
}

3. react 获取dom的方法
   ref = “myp” ref = {elem=>myp=elem}
   常规dom操作
   react 原生函数 findDoMNode获取dom

4. render

• createElement（创造一个虚拟dom节点）
  1. 标签名
  2. 属性
  3. 子节点，值
  4. 直接支持jsx语法

• 作用：动态创建组件，生成模板

5. react 跨层传参

   1. 通过中间组件转发
   2. redux
   3. context 上下

6. react 如何实现优化
   shouldComponentUpdate(nextProps,nextState){
   return true 渲染
   return false 不渲染
   }

7. vue中动态创建组件
   <component :is="">动态组件

render(createElement){
return createElement(标签，属性，子节点)
}

8. 对vue虚拟dom的理解
   1. vdom本质就是通过js去模拟dom节点，优化到dom渲染与操作
      2.通过diff算法，来查看现有dom节点与最新的dom节点有哪些差异
      3.通过patch方法对差异实现最小化更新渲染

• diff
  1.只比较同级的节点
  2.如果标签不同就删除重建
  3.如果标签相同，key相同就保持不变

9. 你用过的react生命周期有哪些?
   shouldComponentUpdate优化渲染更新
   componentDidMount
   可以获取dom，ajax, 初始化,定时器,
   componentWillMount
   componentWillUnmount移除定时器
   componentWillRecivedProps监听props