Ninja Javascript Part 5

2017-11-21

线程

在Web worker(?web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能)可用之前，++浏览器的所有Javascript代码都是在单线程中执行的++。异步事件的处理程序，如用户界面事件和定时器，在线程中没有代码执行的时候才执行，处理程序在执行时必须排队，并且一个处理程序不能中断另一个。

Javascript 是单线程的
1. Javascript 运行在浏览器中，是单线程的，每个windows一个线程。
2. 浏览器是事件驱动，很多行为异步的，会创建事件并放入执行队列中。
3. Javascript 引擎单线程处理它的任务队列，也就是普通函数和回调函数组成的队列。
4. 异步事件发生时，会把异步执行的callback放入队列，并等待当前代码执行完成。
浏览器不是单线程的
1. javascript 引擎线程
2. 界面渲染线程
3. 浏览器事件触发线程
4. http请求线程(Ajax)
Ajax 异步

Ajax请求确实是异步的，这请求是由浏览器新开一个线程请求，事件回调的时候是放入Event loop单线程事件队列等候处理。

利用定时器分解长时间任务
setTimeout(fun, 0)

var count = 2000;
var divide = 4;
var chunkSize = count/divide;
var iteration = 0;;
var table = document.createElement('tbody');
setTimeout(function generateRows() {
    var base = (chunkSize) * iteration;
    for (let i = 0; i < chunkSize; i++) {
        let tr = document.createElement('tr');
        for (let t = 0; t < 6; t++) {
            let td = document.createElement('td');
            td.appendChild(document.createTextNode((i + base) + "," + t + ',' + iteration));
            tr.appendChild(td);
        }
        table.appendChild(tr);
    }
    
    iteration++;
    if (iteration < divide) {
        setTimeout(generateRows, 0);
    }
}, 0);