关于setTimeout和console.log执行顺序

最近为了用bootstrap 的modal 模态框重写confirm确认框做了一些实验，在追求阻塞的路上，悲剧的都失败了。在悲愤之际我决定写一个简单粗暴的递归程序来强行阻塞我的程序，然鹅，在使用setTimeout 和console.log 做实验的时候，出现了更加复杂和深刻的问题。

首先，代码1：

function _confirm( text) {

flag = - 1 ; // flag初始值

$("#modal-confirm").modal('show') // 显示模态框

$("#modal-confirm .modal-body").text(text); //修改模态框提示内容

$( "#modal-confirm .btn-default"). off( "click");

$("#modal-confirm .btn-default").on("click",function(){ //点击取消按钮，输出cancle！,flag设为0

console. log( "cancel!");

flag = 0;

});

$( "#modal-confirm .btn-primary"). off( "click");

$("#modal-confirm .btn-primary").on("click",function(){ //点击确认按钮，输出sure，flag设为1

console. log( "sure!");

flag = 1;

});

while ( flag < 5 ) {

flag = flag + 1;

console. log( flag);

}

};

_confirm( "dgtest!");

输出：

无视警告。

问题1：为什么console.log输出两遍？

代码2

其余同代码1：

while ( flag < 5 ) {

flag = flag + 1;

setTimeout( function(){ console. log( "{" + flag + "}");}, 0);

console. log( flag);

}

输出：

问题2： 为什么

setTimeout(function(){console.log("{" +flag +"}");}, 0);

立即执行，但在console.log之后输出？

代码3：

while ( flag < 5 ) {

flag = flag + 1;

setTimeout( function(){ console. log( "{" + flag + "}");}, 3000);

console. log( flag);

}

点击确认。

输出：