异步

setTimeout(function(){
    console.log('立即执行setTimeout');
}, 0); 

var d = new Date().getTime(); 

while(true) { 
	var dd = new Date().getTime(); 
	if( ( dd - d ) > 1000 *10 ) { 
		console.info( '主任务循环10s后结束' ); 
		break; 
	}  
} 

console.info('主任务结束'); //主任务

• 以上执行结果如下

VM446:10 主任务循环10s后结束
VM446:15 主任务结束
undefined
VM446:2 立即执行setTimeout

setTimeout(function(){
    console.log('立即执行setTimeout');
}, 0); 

var p = new Promise(function(resolve){
	resolve("promise回调产生");
});

p.then(function(value){
	console.info('异步Promise执行' + value);
});

var d = new Date().getTime(); 

while(true) { 
	var dd = new Date().getTime(); 
	if( ( dd - d ) > 1000 *10 ) { 
		console.info( '主任务循环10s后结束' ); 
		break; 
	}  
} 

console.info('主任务结束'); //主任务

• 以上执行结果

VM440:18 主任务循环10后结束
VM440:23 主任务结束
VM440:10 异步Promise执行promise回调产生
undefined
VM440:2 立即执行setTimeout

同步任务

• 主任务执行
• 将主任务执行过程的异步任务加入任务队列
• 主任务执行完成后，执行异步任务队列

异步任务

• javascript 事件循环并发模型

• setTimeout 和 promise都是异步任务

• 异步任务都是通过任务队列进行管理和调度

• 更多...

• 任务队列又分为 MacroTask Queue{宏任务} 和 MicroTask Queue{微任务}

• 宏任务:　setTimeout, setInterval , setImmediate, requestAnimationFrame , NodeJS中的I/O...

• 微任务： 独立回调任务 | 复合回调任务

• 微任务之独立回调任务 [ Promise ] 其成功与失败的回调函数相互独立

• 微任务之复合回调任务 [ Object.observe, MutationObserver 和NodeJs中的process.nextTick] 不同状态的回调函数在同一个函数体

执行过程

• 依次执行同步代码直至执行完毕
• 检查宏任务队列，若有触发的异步任务，则取第一个并调用器事件处理函数，然后跳转至第三步，若没有需要处理的异步任务，则直接第二步
• 检查微任务，然后执行所有已经触发的异步任务，一次执行事件处理回调函数，直至执行完毕，然后调到第二步，若没有需要处理的异步任务，则直接返回第二步，依次执行后续步骤
• 如此往复，若所有异步任务处理完毕，则结束;
• 微任务优于宏任务