{"id":3044,"date":"2020-09-02T08:51:00","date_gmt":"2020-09-02T08:51:00","guid":{"rendered":"http:\/\/the-codest.localhost\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/"},"modified":"2026-04-24T11:34:04","modified_gmt":"2026-04-24T11:34:04","slug":"setkani-asynchronniho-a-jednovlaknoveho-javascriptu-se-smyckou-udalosti","status":"publish","type":"post","link":"https:\/\/thecodest.co\/cs\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/","title":{"rendered":"Asynchronn\u00ed a jednovl\u00e1knov\u00fd JavaScript?"},"content":{"rendered":"<ul class=\"wp-block-list\">\n<li><strong>Runtime<\/strong><\/li>\n<\/ul>\n\n\n\n<p><a href=\"https:\/\/thecodest.co\/cs\/blog\/hire-javascript-developer\/\">JavaScript<\/a> je interpretovan\u00fd, nikoli kompilovan\u00fd jazyk. To znamen\u00e1, \u017ee pot\u0159ebuje interpretr, kter\u00fd p\u0159ev\u00e1d\u00ed <a href=\"https:\/\/thecodest.co\/cs\/blog\/hire-vue-js-developers\/\">JS<\/a> <a href=\"https:\/\/thecodest.co\/cs\/dictionary\/what-is-code-refactoring\/\">k\u00f3d<\/a> do strojov\u00e9ho k\u00f3du. Existuje n\u011bkolik typ\u016f p\u0159eklada\u010d\u016f (tzv. motor\u016f). Nejobl\u00edben\u011bj\u0161\u00edmi enginy prohl\u00ed\u017ee\u010d\u016f jsou V8 (Chrome), Quantum (Firefox) a WebKit (Safari). Mimochodem, V8 se pou\u017e\u00edv\u00e1 tak\u00e9 v popul\u00e1rn\u00edm b\u011bhov\u00e9m prost\u0159ed\u00ed, kter\u00e9 nen\u00ed ur\u010deno pro prohl\u00ed\u017ee\u010de, <a href=\"https:\/\/thecodest.co\/cs\/blog\/find-your-node-js-expert-for-hire-today\/\">Node.js<\/a>.<\/p>\n\n\n\n<p>Ka\u017ed\u00fd engine obsahuje pam\u011b\u0165ovou haldu, z\u00e1sobn\u00edk vol\u00e1n\u00ed, smy\u010dku ud\u00e1lost\u00ed, frontu zp\u011btn\u00fdch vol\u00e1n\u00ed a rozhran\u00ed WebAPI s po\u017eadavky HTTP, \u010dasova\u010di, ud\u00e1lostmi atd., v\u0161e implementov\u00e1no vlastn\u00edm zp\u016fsobem pro rychlej\u0161\u00ed a bezpe\u010dn\u011bj\u0161\u00ed interpretaci k\u00f3du JS.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/runtime-architecture.png\" alt=\"V\u00fdvoj JavaScript\" title=\"V\u00fdvoj JavaScript\"\/><\/figure>\n\n\n\n<p><em>Z\u00e1kladn\u00ed architektura b\u011bhu JS. Autor: Alex Zlatkov<\/em><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Jedno vl\u00e1kno<\/strong><\/h2>\n\n\n\n<p>Jednovl\u00e1knov\u00fd jazyk je jazyk s jedin\u00fdm z\u00e1sobn\u00edkem vol\u00e1n\u00ed a jedinou pam\u011b\u0165ovou hromadou. To znamen\u00e1, \u017ee v jednom okam\u017eiku b\u011b\u017e\u00ed pouze jedna v\u011bc.<\/p>\n\n\n\n<p>A&nbsp;<code>z\u00e1sobn\u00edk<\/code>&nbsp;je souvisl\u00e1 oblast pam\u011bti, kter\u00e1 alokuje lok\u00e1ln\u00ed kontext pro ka\u017edou prov\u00e1d\u011bnou funkci.<\/p>\n\n\n\n<p>A&nbsp;<code>hromada<\/code>&nbsp;je mnohem v\u011bt\u0161\u00ed oblast, kde je ulo\u017eeno v\u0161e, co je dynamicky alokov\u00e1no.<\/p>\n\n\n\n<p>A&nbsp;<code>z\u00e1sobn\u00edk vol\u00e1n\u00ed<\/code>&nbsp;je <a href=\"https:\/\/thecodest.co\/cs\/blog\/app-data-collection-security-risks-value-and-types-explored\/\">data<\/a> struktura, kter\u00e1 v podstat\u011b zaznamen\u00e1v\u00e1, kde se v programu nach\u00e1z\u00edme.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Z\u00e1sobn\u00edk vol\u00e1n\u00ed<\/strong><\/h3>\n\n\n\n<p>Napi\u0161me si jednoduch\u00fd k\u00f3d a sledujme, co se d\u011bje na z\u00e1sobn\u00edku vol\u00e1n\u00ed.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/stack.gif\" alt=\"V\u00fdvoj softwaru JavaScript\" title=\"V\u00fdvoj softwaru JavaScript\"\/><\/figure>\n\n\n\n<p>Jak vid\u00edte, funkce jsou p\u0159id\u00e1v\u00e1ny do z\u00e1sobn\u00edku, prov\u00e1d\u011bny a pozd\u011bji maz\u00e1ny. Jedn\u00e1 se o takzvan\u00fd zp\u016fsob LIFO - Last In, First Out. Ka\u017ed\u00e1 polo\u017eka v z\u00e1sobn\u00edku vol\u00e1n\u00ed se naz\u00fdv\u00e1&nbsp;<code>r\u00e1m z\u00e1sobn\u00edku<\/code>.<\/p>\n\n\n\n<p>Znalost z\u00e1sobn\u00edku vol\u00e1n\u00ed je u\u017eite\u010dn\u00e1 p\u0159i \u010dten\u00ed stop z\u00e1sobn\u00edku chyb. P\u0159esn\u00e1 p\u0159\u00ed\u010dina chyby je zpravidla naho\u0159e v prvn\u00edm \u0159\u00e1dku, a\u010dkoli po\u0159ad\u00ed prov\u00e1d\u011bn\u00ed k\u00f3du je zdola nahoru.<\/p>\n\n\n\n<p>N\u011bkdy se m\u016f\u017eete vypo\u0159\u00e1dat s obl\u00edbenou chybou, na kterou v\u00e1s upozorn\u00ed\u00a0<code>P\u0159ekro\u010den\u00ed maxim\u00e1ln\u00ed velikosti z\u00e1sobn\u00edku vol\u00e1n\u00ed<\/code>. Toho lze snadno dos\u00e1hnout pomoc\u00ed rekurze:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">funkce foo() {\n    foo()\n}\nfoo()<\/code><\/pre>\n\n\n\n<p>a n\u00e1\u0161 prohl\u00ed\u017ee\u010d nebo termin\u00e1l zamrzne. Ka\u017ed\u00fd prohl\u00ed\u017ee\u010d, dokonce i jeho r\u016fzn\u00e9 verze, m\u00e1 jin\u00fd limit velikosti z\u00e1sobn\u00edku vol\u00e1n\u00ed. V naprost\u00e9 v\u011bt\u0161in\u011b p\u0159\u00edpad\u016f jsou dostate\u010dn\u00e9 a probl\u00e9m je t\u0159eba hledat jinde.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Blokovan\u00fd z\u00e1sobn\u00edk vol\u00e1n\u00ed<\/strong><\/h3>\n\n\n\n<p>Zde je p\u0159\u00edklad blokov\u00e1n\u00ed vl\u00e1kna JS. Zkusme p\u0159e\u010d\u00edst&nbsp;<code>foo<\/code>&nbsp;a soubor&nbsp;<code>bar<\/code>&nbsp;pomoc\u00ed <a href=\"https:\/\/thecodest.co\/cs\/dictionary\/what-is-node-js-used-for\/\">Uzel<\/a>synchronn\u00ed funkce .js&nbsp;<code>readFileSync<\/code>.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/blocking.gif\" alt=\"K\u00f3d JavaScript\" title=\"K\u00f3d JavaScript\"\/><\/figure>\n\n\n\n<p>Jedn\u00e1 se o zacyklen\u00fd GIF. Jak vid\u00edte, JS engine \u010dek\u00e1 na prvn\u00ed vol\u00e1n\u00ed v polo\u017ece&nbsp;<code>readFileSync<\/code>&nbsp;je dokon\u010dena. To se v\u0161ak nestane, proto\u017ee neexistuje \u017e\u00e1dn\u00fd&nbsp;<code>foo<\/code>&nbsp;tak\u017ee druh\u00e1 funkce nebude nikdy zavol\u00e1na.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Asynchronn\u00ed chov\u00e1n\u00ed<\/strong><\/h2>\n\n\n\n<p>JS v\u0161ak m\u016f\u017ee b\u00fdt i neblokuj\u00edc\u00ed a chovat se, jako by byl v\u00edcevl\u00e1knov\u00fd. To znamen\u00e1, \u017ee ne\u010dek\u00e1 na odezvu <a href=\"https:\/\/thecodest.co\/cs\/blog\/compare-staff-augmentation-firms-that-excel-in-api-team-staffing-for-financial-technology-projects\/\">API<\/a> vol\u00e1n\u00ed, ud\u00e1losti I\/O atd. a m\u016f\u017ee pokra\u010dovat ve vykon\u00e1v\u00e1n\u00ed k\u00f3du. To je mo\u017en\u00e9 d\u00edky motor\u016fm JS, kter\u00e9 pou\u017e\u00edvaj\u00ed (pod kapotou) skute\u010dn\u00e9 v\u00edcevl\u00e1knov\u00e9 jazyky, jako je C++ (Chrome) nebo Rust (Firefox). Ty poskytuj\u00ed <a href=\"https:\/\/thecodest.co\/cs\/blog\/why-us-companies-are-opting-for-polish-developers\/\">n\u00e1s<\/a> s <a href=\"https:\/\/thecodest.co\/cs\/blog\/find-your-ideal-stack-for-web-development\/\">Web<\/a> API pod kapotami prohl\u00ed\u017ee\u010d\u016f nebo nap\u0159. I\/O API pod Node.js.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/callback-queue.gif\" alt=\"Programovac\u00ed jazyk JavaScript\" title=\"Programovac\u00ed jazyk JavaScript\"\/><\/figure>\n\n\n\n<p>Na obr\u00e1zku GIF v\u00fd\u0161e vid\u00edme, \u017ee prvn\u00ed funkce je p\u0159esunuta na z\u00e1sobn\u00edk vol\u00e1n\u00ed a.&nbsp;<code>Ahoj<\/code>&nbsp;se okam\u017eit\u011b provede v konzole.<\/p>\n\n\n\n<p>Pak zavol\u00e1me&nbsp;<code>setTimeout<\/code>&nbsp;funkce poskytovan\u00e1 rozhran\u00edm WebAPI prohl\u00ed\u017ee\u010de. P\u0159ejde do z\u00e1sobn\u00edku vol\u00e1n\u00ed a jeho asynchronn\u00ed zp\u011btn\u00e9 vol\u00e1n\u00ed&nbsp;<code>foo<\/code>&nbsp;funkce p\u0159ejde do fronty WebApi, kde \u010dek\u00e1 na vol\u00e1n\u00ed, kter\u00e9 je nastaveno na 3 sekundy.<\/p>\n\n\n\n<p>Mezit\u00edm program pokra\u010duje v k\u00f3du a my vid\u00edme.&nbsp;<code>Ahoj. Nejsem zablokovan\u00fd<\/code>&nbsp;v konzole.<\/p>\n\n\n\n<p>Po vyvol\u00e1n\u00ed p\u0159ejde ka\u017ed\u00e1 funkce ve front\u011b WebAPI do fronty.&nbsp;<code>Fronta zp\u011btn\u00fdch vol\u00e1n\u00ed<\/code>. V n\u011bm funkce \u010dekaj\u00ed, dokud nen\u00ed z\u00e1sobn\u00edk vol\u00e1n\u00ed pr\u00e1zdn\u00fd. Kdy\u017e se tak stane, jsou tam p\u0159esunuty jedna po druh\u00e9.<\/p>\n\n\n\n<p>Tak\u017ee kdy\u017e na\u0161e&nbsp;<code>setTimeout<\/code>&nbsp;\u010dasova\u010d dokon\u010d\u00ed odpo\u010d\u00edt\u00e1v\u00e1n\u00ed, na\u0161e&nbsp;<code>foo<\/code>&nbsp;funkce p\u0159ejde do fronty zp\u011btn\u00fdch vol\u00e1n\u00ed, po\u010dk\u00e1, a\u017e se zp\u0159\u00edstupn\u00ed z\u00e1sobn\u00edk vol\u00e1n\u00ed, p\u0159ejde tam, provede se a my vid\u00edme&nbsp;<code>Ahoj z asynchronn\u00edho zp\u011btn\u00e9ho vol\u00e1n\u00ed<\/code>&nbsp;v konzole.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Smy\u010dka ud\u00e1lost\u00ed<\/strong><\/h3>\n\n\n\n<p>Ot\u00e1zkou je, jak runtime pozn\u00e1, \u017ee je z\u00e1sobn\u00edk vol\u00e1n\u00ed pr\u00e1zdn\u00fd, a jak je vyvol\u00e1na ud\u00e1lost ve front\u011b zp\u011btn\u00fdch vol\u00e1n\u00ed? Seznamte se se smy\u010dkou ud\u00e1lost\u00ed. Je sou\u010d\u00e1st\u00ed j\u00e1dra JS. Tento proces neust\u00e1le kontroluje, zda je z\u00e1sobn\u00edk vol\u00e1n\u00ed pr\u00e1zdn\u00fd, a pokud ano, sleduje, zda ve front\u011b zp\u011btn\u00fdch vol\u00e1n\u00ed nen\u00ed ud\u00e1lost, kter\u00e1 \u010dek\u00e1 na vyvol\u00e1n\u00ed.<\/p>\n\n\n\n<p>To jsou v\u0161echna kouzla v z\u00e1kulis\u00ed!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Z\u00e1v\u011br teorie<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Soub\u011b\u017enost a paralelismus<\/strong><\/h3>\n\n\n\n<p><code>Sou\u010dasnost<\/code>&nbsp;znamen\u00e1 prov\u00e1d\u011bn\u00ed v\u00edce \u00faloh najednou, ale ne sou\u010dasn\u011b. Nap\u0159. dv\u011b \u00falohy pracuj\u00ed v p\u0159ekr\u00fdvaj\u00edc\u00edch se \u010dasov\u00fdch \u00fasec\u00edch.<\/p>\n\n\n\n<p><code>Paralelismus<\/code>&nbsp;znamen\u00e1 prov\u00e1d\u011bn\u00ed dvou nebo v\u00edce \u00faloh sou\u010dasn\u011b, nap\u0159. prov\u00e1d\u011bn\u00ed v\u00edce v\u00fdpo\u010dt\u016f najednou.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Vl\u00e1kna a procesy<\/strong><\/h3>\n\n\n\n<p><code>Vl\u00e1kna<\/code>&nbsp;jsou posloupnost\u00ed prov\u00e1d\u011bn\u00ed k\u00f3du, kter\u00e9 lze prov\u00e1d\u011bt nez\u00e1visle na sob\u011b.<\/p>\n\n\n\n<p><code>Proces<\/code>&nbsp;je instance b\u011b\u017e\u00edc\u00edho programu. Program m\u016f\u017ee m\u00edt v\u00edce proces\u016f.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Synchronn\u00ed a asynchronn\u00ed syst\u00e9m<\/strong><\/h3>\n\n\n\n<p>Na adrese&nbsp;<code>synchronn\u00ed<\/code>&nbsp;programov\u00e1n\u00ed se \u00falohy prov\u00e1d\u011bj\u00ed jedna po druh\u00e9. Ka\u017ed\u00e1 \u00faloha \u010dek\u00e1 na dokon\u010den\u00ed p\u0159edchoz\u00ed \u00falohy a teprve pot\u00e9 je provedena.<\/p>\n\n\n\n<p>Na adrese&nbsp;<code>asynchronn\u00ed<\/code>&nbsp;programov\u00e1n\u00ed, kdy\u017e je jedna \u00faloha provedena, m\u016f\u017eete p\u0159ej\u00edt na jinou \u00falohu, ani\u017e byste \u010dekali na dokon\u010den\u00ed t\u00e9 p\u0159edchoz\u00ed.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Synchronn\u00ed a asynchronn\u00ed v jednovl\u00e1knov\u00e9m a v\u00edcevl\u00e1knov\u00e9m prost\u0159ed\u00ed<\/strong><\/h3>\n\n\n\n<p><code>Synchronn\u00ed s jedn\u00edm vl\u00e1knem<\/code>: \u00dalohy se prov\u00e1d\u011bj\u00ed jedna po druh\u00e9. Ka\u017ed\u00e1 \u00faloha \u010dek\u00e1 na proveden\u00ed p\u0159edchoz\u00ed \u00falohy.<\/p>\n\n\n\n<p><code>Synchronn\u00ed s v\u00edce vl\u00e1kny<\/code>: \u00dalohy jsou prov\u00e1d\u011bny v r\u016fzn\u00fdch vl\u00e1knech, ale \u010dekaj\u00ed na dal\u0161\u00ed prov\u00e1d\u011bn\u00e9 \u00falohy v jin\u00e9m vl\u00e1kn\u011b.<\/p>\n\n\n\n<p><code>Asynchronn\u00ed s jedn\u00edm vl\u00e1knem<\/code>: \u00dalohy se za\u010dnou prov\u00e1d\u011bt bez \u010dek\u00e1n\u00ed na dokon\u010den\u00ed jin\u00e9 \u00falohy. V dan\u00e9m okam\u017eiku m\u016f\u017ee b\u00fdt provedena pouze jedna \u00faloha.<\/p>\n\n\n\n<p><code>Asynchronn\u00ed s v\u00edce vl\u00e1kny<\/code>: \u00dalohy se prov\u00e1d\u011bj\u00ed v r\u016fzn\u00fdch vl\u00e1knech, ani\u017e by \u010dekaly na dokon\u010den\u00ed jin\u00fdch \u00faloh, a dokon\u010duj\u00ed se nez\u00e1visle.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Klasifikace JavaScript<\/strong><\/h2>\n\n\n\n<p>Pokud se pod\u00edv\u00e1me na to, jak JS engine funguje pod kapotou, m\u016f\u017eeme JS klasifikovat jako asynchronn\u00ed a jednovl\u00e1knov\u00fd interpretovan\u00fd jazyk. Slovo \"interpretovan\u00fd\" je velmi d\u016fle\u017eit\u00e9, proto\u017ee znamen\u00e1, \u017ee jazyk bude v\u017edy z\u00e1visl\u00fd na dob\u011b b\u011bhu a nikdy nebude tak rychl\u00fd jako kompilovan\u00e9 jazyky s integrovan\u00fdm v\u00edcevl\u00e1knov\u00fdm \u0159\u00edzen\u00edm.<\/p>\n\n\n\n<p>Za zm\u00ednku stoj\u00ed, \u017ee Node.js m\u016f\u017ee dos\u00e1hnout skute\u010dn\u00e9ho v\u00edcevl\u00e1knov\u00e9ho zpracov\u00e1n\u00ed za p\u0159edpokladu, \u017ee ka\u017ed\u00e9 vl\u00e1kno je spu\u0161t\u011bno jako samostatn\u00fd proces. Existuj\u00ed pro to knihovny, ale Node.js m\u00e1 vestav\u011bnou funkci tzv.&nbsp;<a href=\"https:\/\/nodejs.org\/api\/worker_threads.html#worker_threads_worker_threads\">Vl\u00e1kna pracovn\u00edk\u016f<\/a>.<\/p>\n\n\n\n<p>V\u0161echny soubory GIF smy\u010dky ud\u00e1lost\u00ed poch\u00e1zej\u00ed ze souboru&nbsp;<a href=\"https:\/\/github.com\/latentflip\/loupe\">Lupa<\/a>&nbsp;vytvo\u0159enou Philipem Robertsem, kde m\u016f\u017eete testovat asynchronn\u00ed sc\u00e9n\u00e1\u0159e.<\/p>\n\n\n\n<p><b>P\u0159e\u010dt\u011bte si v\u00edce:<\/b><\/p>\n\n\n\n<p><a href=\"https:\/\/thecodest.co\/blog\/why-you-should-probably-use-typescript\">Pro\u010d byste (pravd\u011bpodobn\u011b) m\u011bli pou\u017e\u00edvat Typescript?<\/a><\/p>\n\n\n\n<p><a href=\"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/\">Kvalita na prvn\u00edm m\u00edst\u011b! 5 snadn\u00fdch krok\u016f k od\u0159\u00e1dkov\u00e1n\u00ed k\u00f3du pomoc\u00ed pracovn\u00edch postup\u016f GitHubu v projektu JavaScript<\/a><\/p>\n\n\n\n<p><a href=\"https:\/\/thecodest.co\/blog\/how-to-improve-vue-js-apps-some-practical-tips\/\">Jak vylep\u0161it aplikace Vue.js? N\u011bkolik praktick\u00fdch tip\u016f<\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>JavaScript je jednovl\u00e1knov\u00fd jazyk a z\u00e1rove\u0148 neblokuj\u00edc\u00ed, asynchronn\u00ed a soub\u011b\u017en\u00fd. Tento \u010dl\u00e1nek v\u00e1m vysv\u011btl\u00ed, jak se to d\u011bje.<\/p>","protected":false},"author":2,"featured_media":3045,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[8],"tags":[],"class_list":["post-3044","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-software-development"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.3 (Yoast SEO v27.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Asynchronous and Single-threaded JavaScript? - The Codest<\/title>\n<meta name=\"description\" content=\"JavaScript is a single-threaded language and, at the same time, also non-blocking, asynchronous and concurrent. This article will explain to you how it happens.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/thecodest.co\/cs\/blog\/setkani-asynchronniho-a-jednovlaknoveho-javascriptu-se-smyckou-udalosti\/\" \/>\n<meta property=\"og:locale\" content=\"cs_CZ\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Asynchronous and Single-threaded JavaScript?\" \/>\n<meta property=\"og:description\" content=\"JavaScript is a single-threaded language and, at the same time, also non-blocking, asynchronous and concurrent. This article will explain to you how it happens.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/thecodest.co\/cs\/blog\/setkani-asynchronniho-a-jednovlaknoveho-javascriptu-se-smyckou-udalosti\/\" \/>\n<meta property=\"og:site_name\" content=\"The Codest\" \/>\n<meta property=\"article:published_time\" content=\"2020-09-02T08:51:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-24T11:34:04+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-16.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"thecodest\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"thecodest\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minut\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/\"},\"author\":{\"name\":\"thecodest\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/person\\\/7e3fe41dfa4f4e41a7baad4c6e0d4f76\"},\"headline\":\"Asynchronous and Single-threaded JavaScript?\",\"datePublished\":\"2020-09-02T08:51:00+00:00\",\"dateModified\":\"2026-04-24T11:34:04+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/\"},\"wordCount\":1058,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-16.jpg\",\"articleSection\":[\"Software Development\"],\"inLanguage\":\"cs\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/\",\"url\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/\",\"name\":\"Asynchronous and Single-threaded JavaScript? - The Codest\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-16.jpg\",\"datePublished\":\"2020-09-02T08:51:00+00:00\",\"dateModified\":\"2026-04-24T11:34:04+00:00\",\"description\":\"JavaScript is a single-threaded language and, at the same time, also non-blocking, asynchronous and concurrent. This article will explain to you how it happens.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#breadcrumb\"},\"inLanguage\":\"cs\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"cs\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#primaryimage\",\"url\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-16.jpg\",\"contentUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-16.jpg\",\"width\":1920,\"height\":1080},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/thecodest.co\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Asynchronous and Single-threaded JavaScript?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#website\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"name\":\"The Codest\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/thecodest.co\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"cs\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\",\"name\":\"The Codest\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"cs\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/03\\\/thecodest-logo.svg\",\"contentUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/03\\\/thecodest-logo.svg\",\"width\":144,\"height\":36,\"caption\":\"The Codest\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/pl.linkedin.com\\\/company\\\/codest\",\"https:\\\/\\\/clutch.co\\\/profile\\\/codest\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/person\\\/7e3fe41dfa4f4e41a7baad4c6e0d4f76\",\"name\":\"thecodest\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"cs\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"caption\":\"thecodest\"},\"url\":\"https:\\\/\\\/thecodest.co\\\/cs\\\/author\\\/thecodest\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Asynchronn\u00ed a jednovl\u00e1knov\u00fd JavaScript? - The Codest","description":"JavaScript je jednovl\u00e1knov\u00fd jazyk a z\u00e1rove\u0148 neblokuj\u00edc\u00ed, asynchronn\u00ed a soub\u011b\u017en\u00fd. Tento \u010dl\u00e1nek v\u00e1m vysv\u011btl\u00ed, jak se to d\u011bje.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/thecodest.co\/cs\/blog\/setkani-asynchronniho-a-jednovlaknoveho-javascriptu-se-smyckou-udalosti\/","og_locale":"cs_CZ","og_type":"article","og_title":"Asynchronous and Single-threaded JavaScript?","og_description":"JavaScript is a single-threaded language and, at the same time, also non-blocking, asynchronous and concurrent. This article will explain to you how it happens.","og_url":"https:\/\/thecodest.co\/cs\/blog\/setkani-asynchronniho-a-jednovlaknoveho-javascriptu-se-smyckou-udalosti\/","og_site_name":"The Codest","article_published_time":"2020-09-02T08:51:00+00:00","article_modified_time":"2026-04-24T11:34:04+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-16.jpg","type":"image\/jpeg"}],"author":"thecodest","twitter_card":"summary_large_image","twitter_misc":{"Written by":"thecodest","Est. reading time":"6 minut"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#article","isPartOf":{"@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/"},"author":{"name":"thecodest","@id":"https:\/\/thecodest.co\/#\/schema\/person\/7e3fe41dfa4f4e41a7baad4c6e0d4f76"},"headline":"Asynchronous and Single-threaded JavaScript?","datePublished":"2020-09-02T08:51:00+00:00","dateModified":"2026-04-24T11:34:04+00:00","mainEntityOfPage":{"@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/"},"wordCount":1058,"commentCount":0,"publisher":{"@id":"https:\/\/thecodest.co\/#organization"},"image":{"@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#primaryimage"},"thumbnailUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-16.jpg","articleSection":["Software Development"],"inLanguage":"cs","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/","url":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/","name":"Asynchronn\u00ed a jednovl\u00e1knov\u00fd JavaScript? - The Codest","isPartOf":{"@id":"https:\/\/thecodest.co\/#website"},"primaryImageOfPage":{"@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#primaryimage"},"image":{"@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#primaryimage"},"thumbnailUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-16.jpg","datePublished":"2020-09-02T08:51:00+00:00","dateModified":"2026-04-24T11:34:04+00:00","description":"JavaScript je jednovl\u00e1knov\u00fd jazyk a z\u00e1rove\u0148 neblokuj\u00edc\u00ed, asynchronn\u00ed a soub\u011b\u017en\u00fd. Tento \u010dl\u00e1nek v\u00e1m vysv\u011btl\u00ed, jak se to d\u011bje.","breadcrumb":{"@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#breadcrumb"},"inLanguage":"cs","potentialAction":[{"@type":"ReadAction","target":["https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/"]}]},{"@type":"ImageObject","inLanguage":"cs","@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#primaryimage","url":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-16.jpg","contentUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-16.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/thecodest.co\/blog\/asynchronous-and-single-threaded-javascript-meet-the-event-loop\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/thecodest.co\/"},{"@type":"ListItem","position":2,"name":"Asynchronous and Single-threaded JavaScript?"}]},{"@type":"WebSite","@id":"https:\/\/thecodest.co\/#website","url":"https:\/\/thecodest.co\/","name":"The Codest","description":"","publisher":{"@id":"https:\/\/thecodest.co\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/thecodest.co\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"cs"},{"@type":"Organization","@id":"https:\/\/thecodest.co\/#organization","name":"The Codest","url":"https:\/\/thecodest.co\/","logo":{"@type":"ImageObject","inLanguage":"cs","@id":"https:\/\/thecodest.co\/#\/schema\/logo\/image\/","url":"https:\/\/thecodest.co\/app\/uploads\/2024\/03\/thecodest-logo.svg","contentUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/03\/thecodest-logo.svg","width":144,"height":36,"caption":"The Codest"},"image":{"@id":"https:\/\/thecodest.co\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/pl.linkedin.com\/company\/codest","https:\/\/clutch.co\/profile\/codest"]},{"@type":"Person","@id":"https:\/\/thecodest.co\/#\/schema\/person\/7e3fe41dfa4f4e41a7baad4c6e0d4f76","name":"thecodest","image":{"@type":"ImageObject","inLanguage":"cs","@id":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","caption":"thecodest"},"url":"https:\/\/thecodest.co\/cs\/author\/thecodest\/"}]}},"_links":{"self":[{"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/posts\/3044","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/comments?post=3044"}],"version-history":[{"count":6,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/posts\/3044\/revisions"}],"predecessor-version":[{"id":7721,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/posts\/3044\/revisions\/7721"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/media\/3045"}],"wp:attachment":[{"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/media?parent=3044"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/categories?post=3044"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thecodest.co\/cs\/wp-json\/wp\/v2\/tags?post=3044"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}