vue基础总结 (全局组件和全局指令 v

vue基础总结 (全局组件和全局指令 v

**

全局组件:

如何让组件,设置为全局的组件:

在入口文件里面引入这个组件
Vuepoent("组件名",     组件名)

**

全局指令

**

在一个简单的命令,重复使用的情况下
比如输入框的自动聚焦

Vue.durective(  "'focus'"  ,{inserted(el){el.focus()
}}      )

使用自定义属性    >      定义事件类型   >     inserted  (el){el.focus()}

**

v-model 语法糖 (面试题)

**

****在父组件通过 子组件标签设置 v-model 传值给子组件,子组件props接收 在子组件设置自定义事件 this.$emit(“自定义事件”,数据)
的方式传回了 父组件 里面的子组件标签 这里已经不需要在父组件里面设置函数接受了
因为双向传导的方式 v-model 已经监听到了数据的变化

一个指令实现两个功能 : 父传子 子传父

在基础里面 父组件传值给子组件的方式:
在子组件的标签里面使用 :name: "变量名"
子传父的方式: 子组件定义点击事件 在methods里面 使用this.$emit( “自定义事件名字” ,数据 )
这样的话 两种方式的代码都会写在 子组件的标签里面 代码冗余 v-model 的使用就是由此而来****

**

vue2响应式的缺点

**
响应式: 数据 驱动试图

对象的新增没有响应式

虽然使用 this.obj.b=12 在调试工具里面 可以看到 在试图里面没有

**

如何让新增对象显示在视图里面

**

**

数组的部分属性没有响应式

**

这七个api会修改原数组

**

事件循环 eventloop - 面试

**
js运行在宿主环境中。

宿主环境有： 浏览器， nodejs

提到事件循环时，是指宿主环境的事件循环，而不是js中的事件循环。为啥？ 我们常见的事件，点击事件，鼠标事件等等是不是在浏览器中提到的？

浏览器本身是一个复杂的系统，它要做的事情非常多，例如： 执行js代码，请求图片资源，解析css，渲染页面，响应鼠标的点击等等。在实现层面，浏览器内部会用不同的功能模块去完成不同的事情。这些不同的模块就体现为进程。

进一步把进程进行划分：

1. 主进程。用来协调控制其他子进程。
2. GPU进程。用于3D绘制等。
3. 渲染进程。就是我们说的浏览器内核，负责具体页面的渲染，脚本执行，事件处理等。浏览器的每个tab页背后就有一个渲染进程。

进程这个单位还是比较大，它进一步拆分多个线程。可以理解为一个页面上的事还是比较多，要多找些小弟来完成。具体来说，一个渲染进程包括：

1. 主线程。统一调度其他线程
2. GUI渲染线程。负责渲染页面，布局和绘制。与JS引擎互斥。
3. JS引擎线程。负责处理解析和执行javascript脚本程序。与GUI渲染线程互斥的
4. 事件触发线程。用来控制事件循环（鼠标点击、setTimeout、ajax等）。当事件满足触发条件时，将事件放入到JS引擎所在的执行队列中。
5. setInterval与setTimeout所在的线程。定时任务并不是由JS引擎计时的，是由定时触发线程来计时的。计时完毕后，通知事件触发线程
6. 异步http请求线程。浏览器有一个单独的线程用于处理AJAX请求，当请求完成时，若有回调函数，通知事件触发线程。
7. io线程。用来接收其他进程的消息。

每个渲染进程（一个tab页）都有一个主线程，并且主线程非常繁忙，既要处理 DOM，又要计算样式，还要处理布局，同时还需要处理 JavaScript 任务以及各种输入事件。要让这么多不同类型的任务在主线程中有条不紊地执行，这就需要一个系统来统筹调度这些任务，这个统筹调度系统就是消息队列和事件循环。

任务有很多，人只有一个

**

微任务

**

执行逻辑: 立刻执行 微任务 宏任务
主进程会区分 : 代码执行的优先级 一般 立刻执行 微任务 宏任务会对上面的三种情况进行排序
执行栈会首先执行 立刻执行的代码 识别微任务 添加到队列 再去识别宏任务 添加完以后 开始执行 微任务 执行 这样一次往下

重上倒下 开始筛选 立刻执行 peomise 前半部分是立即执行的函数 后半部分是微任务异步 继续往下筛选 队列添加完毕以后 开始执行微任务 微任务执行完毕以后 开始执行宏任务