概念 什麼是js非同步
何時需要非同步
1 需要等待的情況
2 在等待過程中不能像alert一樣阻塞程式執行
3 等待的情況需要非同步
使用場景:
1 定時任務settimeout, setinterval
console.log(1002 網路請求 ajax 動態); settimeout(function(),
1000); //
非同步執行，非阻塞並不妨礙後續**執行
console.log(300
);//
執行順序為100 300 200
載入
console.log("
start");
var img=document.createelement("
img"
); img.onload=function()
img.src="
";console.log(
"end");
//執行順序是 start end loaded 的載入時非同步的
3 事件繫結
console.log("
start");
document.getelementbyid(
"btn
").addeventlistener("
click
",function());
console.log(
"end");
//執行順序是start ,end 如果點選才執行clicked 如果不點永遠不執行 也是非同步的
典型的同步載入的例子：
console.log(100同步或非同步，表明著是否需要將整個流程按順序地完成); alert(
200);
console.log(
300); //
同步列印100，彈出200，列印300，取決於按下『確定』框的時間，不按就一直卡頓在那
阻塞或非阻塞，意味著你呼叫的函式會不會立刻告訴你結果
你有乙個函式和一段程式。
//呼叫這個」copybigfile()」函式，將乙個大檔案複製到另乙個檔案上，將耗時１小時。意味著這個函式的將在乙個小時之後返回。這是乙個阻塞式函式, 將乙個檔案複製到另乙個檔案上
function copybigfile(afile, bfile)
//以上的程式就是乙個同步阻塞的例子，因為copyfilesync函式返回值的過程需要漫長的時間，所以執行緒也無法繼續執行下去，只能等待。這是一段程式
console.log("
start copying ...
");
var a = copybigfile('
a.txt
', '
b.txt
'); //
這行程式將耗時1小時
console.log("
finished
"); //
這行程式將在一小時後執行
console.log("
處理一下別的事情
"); //
這行程式將在一小時後執行
console.log("
hello world, 整個程式已載入完畢，請享用
"); //
這行程式將在一小時後執行
//呼叫這個函式將立刻返回結果，然後你的程式就可以寫成這是乙個非阻塞式函式
//如果複製已完成，則返回 true, 如果未完成則返回 false
function copybigfile(afile,bfile)
console.log("
start copying ...
");
while( a = copybigfile('
a.txt
', '
b.txt
')) ;
console.log(
"finished
"); //
這行程式將在一小時後執行
console.log("
hello world, 整個程式已載入完畢，請享用
"); //
這行程式將在一小時後執行
乙個非阻塞式的函式，給你的程式設計帶來了更多的便利，你可以在長io操作的同時，寫點其他的程式，提高效率。執行結果如下
start copying ...
在這之間還可以處理別的事情
在這之間還可以處理別的事情
在這之間還可以處理別的事情
...finished
hello world, 整個程式已載入完畢，請享用
//這個函式不同於上乙個同步非阻塞函式的地方在於，它具有通知功能，也就是說，它能夠在完成操作之後主動地通知程式，「我完成了」。於是有程式如下,非阻塞式的有非同步通知能力的函式
//以下不需要看懂，只用知道這個函式會在完成copy操作之後，執行success
function copybigfile(afile,bfile, callback));
var isfinished = !copying;
return !isfinished;
}
console.log("
start copying ...
");
copybigfile(
"a.txt
","b.txt
", function())
console.log(
"幹別的事情
");
console.log(
"做一些別的處理
");
程式在呼叫copybigfile函式之後，可以立即獲得返回值，執行緒沒有被阻塞住，於是還可以去幹些別的事情，然後當copybigfile完成之後，會執行指定的函式。所以程式的輸出應為,
start copying ...在這種情況下，程式更容易控制，流程更為清晰。一些「別的事情」可以在函式還未通知之前進行處理，充分地提高了執行緒的利用效率。幹別的事情
做一些別的處理
finished
hello world, 整個程式已載入完畢，請享用
理解js非同步的概念
js引擎在執行的時候是單執行緒的，這是大家都知道的。我們先來看一段 console.log async console.log sync settimeout function 1000 大家覺得執行順序是什麼？輸出 10000 0 sync async settimout run 從執行可以看出，...
非同步載入JS之async defer
繼前面了解的js載入時間線，然後對js的非同步載入的方式進行了更深一步的了解 預設情況下，js檔案是同步載入的，當頁面載入到js檔案時，頁面就會被阻斷在這個地方，阻斷了html css的載入線 為什麼不非同步載入js呢？因為，js會修改html css 又因為js是同步載入的，所以對於不會修改頁面的...
JS高階高階之征服非同步程式設計
問大家乙個問題，js為什麼是單執行緒？也許有些人知道，但是我要說的是有趣的事情，創造js的網景公司拒絕別人向瀏覽器裡加入執行緒的提議，原因是如果加入了執行緒，這門語言的推廣就沒有那麼成功了，js之所以這麼流行，某種程度上是因為菜鳥程式設計師也能上手，他們不必擔心死鎖和競爭問題。總結 加入多執行緒，我...