Detaillierte Erläuterung von nativem JS asynchron und Single-Threaded

Was ist asynchron (im Vergleich zu synchron)? In diesem Artikel wird hauptsächlich die detaillierte Erklärung von nativem JS asynchron und Single-Threaded erläutert.

//异步
console.log(100);
setTimeout(function(){
console.log(200);
},1000);
console.log(300);
//同步
console.log(100);
alert(200);
console.log(300);//同步会阻塞等待

Wann ist Asynchronität erforderlich?

--Wann kann es zu Wartezeiten kommen

--Während des Wartevorgangs kann die Ausführung des Programms nicht wie eine Warnung blockiert werden

--Alle „Wartesituationen“ erfordern also asynchrone

Szenarien, in denen das Front-End asynchrone

Geplante Aufgaben verwendet:

setTimeout/setInterval
console.log(100);
setTimeout(function(){
console.log(200)
},1000);
console.log(300);
//同步
console.log(100);
alert(200);
console.log(300);
网络请求：ajax请求，动态<img>加载
//ajax
console.log(&#39;start&#39;);
$.get(&#39;xxx&#39;,function(){
console.log(data);
})
console.log(&#39;end&#39;);//startenddata
//img
console.log(&#39;start&#39;);
var img = document.creatElement(&#39;img&#39;);
img.onload = function(){
console.log(loaded);
}
img.src = &#39;xxxxxxxxxxxxxxxx&#39;;
console.log(&#39;end&#39;)//startendloaded
事件绑定
console.log(&#39;start&#39;);
var btn1 = document.getElementById(&#39;btn1&#39;);
btn1.addEventListener(&#39;click&#39;,function(){
console.log(&#39;clicked&#39;);
})
console.log(&#39;end&#39;)
异步和单线程
同步和异步的区别？分别举一个同步和异步的例子
同步会阻塞代码执行，而异步不会
alert是同步，setTimeout是异步
一个关于setTimeout的笔试题
console.log(1);
setTimeout(function(){
console.log(2)
},0);
console.log(3);
setTimeout(function(){
console.log(4);
},1000);
console.log(5);
//13524

Die Szenarien, in denen Die Front-End-Anwendungen sind asynchron: Welche

geplante Aufgaben: setTimeout, setInterval

Ajax-Anfrage, IMG-Laden

Ereignisbindung

Verwandte Empfehlungen:

Detaillierte Erklärung der asynchronen JS-Programmierung mit Beispielen

Mehrere Probleme im Zusammenhang mit dem asynchronen Laden von JavaScript

Detaillierte Erklärung einzelner -threaded JS-Ausführungsprobleme

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung von nativem JS asynchron und Single-Threaded. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!