Cnkrru

1. 单线程特性

项目	内容
定义	JavaScript 语言的一大特点就是单线程，也就是说，同一个时间只能做一件事
原因	JavaScript 是为处理页面中用户的交互，以及操作 DOM 而诞生的。比如对某个 DOM 元素进行添加和删除操作，不能同时进行，应该先进行添加，之后再删除
问题	单线程意味着所有任务需要排队，前一个任务结束，才会执行后一个任务。如果 JS 执行的时间过长，会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉
解决方案	利用多核 CPU 的计算能力，HTML5 提出 Web Worker 标准，允许 JavaScript 脚本创建多个线程

2. 同步与异步及任务类型

类型	定义	示例
同步	前一个任务结束后再执行后一个任务，程序的执行顺序与任务的排列顺序是一致的、同步的	做饭的同步做法：先烧水煮饭，等水开了（10分钟之后），再去切菜、炒菜
异步	在做一件事情时，因为这件事情会花费很长时间，在做这件事的同时，还可以去处理其他事情	做饭的异步做法：在烧水的同时，利用这10分钟去切菜、炒菜

任务类型结构

任务类型
├── 同步任务
│   ├── 执行方式：在主线程上执行
│   └── 特点：形成一个执行栈
└── 异步任务
    ├── 执行方式：通过回调函数实现
    ├── 特点：相关添加到任务队列中（任务队列也称为消息队列）
    └── 类型：
        ├── 普通事件：click、resize 等
        ├── 资源加载：load、error 等
        └── 定时器：setInterval、setTimeout 等

3. 执行机制

3.1 执行流程

先执行执行栈中的同步任务
异步任务放入任务队列中
一旦执行栈中的所有同步任务执行完毕，系统就会按次序读取任务队列中的异步任务，于是被读取的异步任务结束等待状态，进入执行栈，开始执行

3.2 事件循环

由于主线程不断的重复获得任务、执行任务、再获得任务、再执行，所以这种机制被称为事件循环（event loop）。

JS 执行机制
├── 开始
│   └── 执行栈
│       ├── 主线程执行完毕，读取任务队列
│       └── 重复执行
├── 任务队列（消息队列）
│   ├── 任务队列1: onload、onclick 等
│   ├── 任务队列2: setTimeout、setInterval 等
│   └── 任务队列3: 网络请求等
└── Web API（异步处理）
    ├── ajax（网络请求）
    ├── DOM事件（DOM 操作）
    └── timer（定时器）

4. 执行栈与任务队列

概念	描述	示例
执行栈	同步任务执行的地方，按照顺序执行	console.log(1); console.log(2);
任务队列	异步任务等待执行的地方，按照顺序排队	setTimeout(fn, 0);

4.1 示例分析

console.log(1);
setTimeout(function() {
    console.log(2);
}, 0);
console.log(3);

执行顺序：

执行 console.log(1)（同步任务）
执行 setTimeout（异步任务），将回调函数放入任务队列
执行 console.log(3)（同步任务）
执行栈为空，从任务队列中取出回调函数，执行 console.log(2) 输出结果：1, 3, 2

异步，给IO用的，JavaScript天生支持异步，写代码时候注意一点就行，可能会出现这个函数需要另一个函数的返回值，但是都是IO型的，导致数据在该函数执行完后才输出