Đồng bộ (sync) - bất đồng bộ (async) - EVENT LOOP trong JavaScript

Поділитися
Вставка
  • Опубліковано 21 жов 2024
  • Đồng bộ (sync) - bất đồng bộ (async) - EVENT LOOP trong JavaScript
    ---------------------
    Website: firelop.com
    ----------------------------------------
    Đăng ký kênh UA-cam
    youtube.firelop...
    =====
    THEO DÕI TÔI:
    ⚡ 𝗧𝗶𝗸𝘁𝗼𝗸: / firelop.com
    ⚡ 𝗙𝗮𝗰𝗲𝗯𝗼𝗼𝗸: / firelop
    ⚡ 𝗕𝗹𝗼𝗴: firelop.com/blog
    =====
    #shorts #javascript #frontend

КОМЕНТАРІ • 75

  • @vulinhtruong9734
    @vulinhtruong9734 3 місяці тому +2

    Sao ông Firelop này vẫn có thể ít người đăng ký được nhỉ? Giảng tuyệt vời thế này mà !!!! Mong anh ra thêm nhiều video hơn nữa ạ!!!!

  • @manhhungpham1294
    @manhhungpham1294 2 роки тому +2

    sync và async là hai trong số những cái khó hình dung nhất đấy nên qua video này mình cũng hiểu hơn một chút rồi cảm ơn bạn.

  • @VuLe-rs1mm
    @VuLe-rs1mm 4 місяці тому +1

    dễ hiểu nhất trong tất cả các video mình đã xem, cảm ơn a nhiều, +1 subscribe cho a

  • @alexmine6862
    @alexmine6862 2 роки тому +3

    Đỉnh thực sự. Mong a ra thêm clip giải thích về closure ạ

  • @nguyenthanhnam8061
    @nguyenthanhnam8061 Рік тому

    video giảng rất dễ hiểu và dễ tiếp cận cho người mới như mình. Thực sự cảm ơn ad nhiều

  • @anhhoccoder5358
    @anhhoccoder5358 2 роки тому

    em xem anh bên tiktok nghiện quá chạy qua youtube xem luôn

  • @chuoigamming1700
    @chuoigamming1700 2 роки тому +1

    Hay ạ e chờ Promise and Fetch những video sắp tới ạ
    🤩🤩

  • @lamvh23
    @lamvh23 2 місяці тому

    Video rất dễ hiểu, cám ơn bạn.

  • @samlai2920
    @samlai2920 Рік тому

    với một đứa đi làm 1 năm nhìn vô thấy dễ hiểu quá trời :D, mong anh ra thêm nhiều video giúp newbie dễ hình dung từng cơ chế trong js. Tuyệt với cho 1 sub

  • @PhamAnhHao-zw4ff
    @PhamAnhHao-zw4ff Рік тому

    Từ bên tiktok qua đây. Anh giải thích rất dễ hiểu ạ!!!

  • @KhoaNguyen-dr1vd
    @KhoaNguyen-dr1vd Рік тому

    cảm ơn anh mong ad ra nhiều video ngắn như này

  • @athatien8303
    @athatien8303 Рік тому

    Đỉnh quá a ơi a giảng quá dễ hiểu

  • @thanhduynguyen6253
    @thanhduynguyen6253 2 роки тому

    channel quá tốt cho người mới học tập. Cảm ơn bạn nhé

  • @briannguyen1488
    @briannguyen1488 2 роки тому

    A dạy cực dễ hiểu cho những đứa newbie như e mong a ra nhiều clip hơn nữa biết a qua tiktok mà sang bên youtube này ít vid quá

  • @kysomaio7207
    @kysomaio7207 2 роки тому +2

    hay qá anh ơii .. mong anh làm thêm về closure function ạ

  • @tranlongvu6017
    @tranlongvu6017 2 роки тому +1

    quá dễ hiểu luôn ạ. cảm ơn anh

  • @KasOfficial04
    @KasOfficial04 Рік тому

    Hy vọng a ra thêm nhiều video

  • @nishigitakakata
    @nishigitakakata 6 місяців тому

    Rất dễ hiểu, cảm ơn anh rất nhiều

  • @anhduy8416
    @anhduy8416 2 роки тому

    video rất đỉnh mong anh ra thêm nhiều vid về JS

  • @nguyenthien107
    @nguyenthien107 2 роки тому

    Quá chất lượng, xem 1 lần hiểu luôn

  • @truonggiaihung7703
    @truonggiaihung7703 2 роки тому

    Đỉnh, 8 phút video mà anh làm được bằng node document người ta viết cả chục trang ❤❤

  • @inhlinhvunguyen1915
    @inhlinhvunguyen1915 2 роки тому +1

    Hay và dễ hiểu quá anh ơi

    • @firelop
      @firelop  2 роки тому

      Cảm ơn bạn

  • @phamanan6183
    @phamanan6183 Рік тому

    đưa ra ví dụ dễ hiểu quá :D

  • @HieuTranTrung-ds4sk
    @HieuTranTrung-ds4sk 2 роки тому

    Rất dễ hiểu, cảm ơn bạn

  • @atnguyenthanh1227
    @atnguyenthanh1227 2 роки тому

    Video rất hay và dễ hiểu

  • @trieuphamly6816
    @trieuphamly6816 2 роки тому +2

    Hay quá anh ơi. Anh làm thêm ví dụ đầu tiên làm sao in ra 0 1 đợi 2s in số 2 sau đó in số 3 đi anh

    • @firelop
      @firelop  2 роки тому +1

      Đơn giản mà, nhét console.log("số 3") vô trong thằng setTimeout luôn là nó sẽ log theo thứ tự thôi. Còn nếu muốn cách khác thì p học Promise.

  • @kytosai
    @kytosai Рік тому +5

    Nếu được bạn bổ sung thêm event loop nhưng có kết hợp lồng giữa promise + settimeout phức tạp hơn 1 chút để demo rõ ràng hơn nữa thì tuyệt vời ! ^^

  • @lordsaurondevoffical363
    @lordsaurondevoffical363 2 роки тому

    bạn nào muốn theo nghề , thì chọn các trung tâm đào tạo hẳn hoi mà học , chứ tự học sẽ có thời điểm code là niềm đâu,
    ad làm video rất là hay
    hi

  • @mrpea7775
    @mrpea7775 8 місяців тому

    Hay quá, cảm ơn anh ạ

  • @BinhTran-yw3tl
    @BinhTran-yw3tl 2 місяці тому

    quá đỉnh, nhưng hơi ít video

  • @longvan8506
    @longvan8506 23 години тому

    cam on ban

  • @dinhvanchuong5956
    @dinhvanchuong5956 3 місяці тому

    quá hay và dễ hiểu

  • @leo2_1
    @leo2_1 2 роки тому

    hay quá anh ơi, cảm ơn anh.

  • @bestta8155
    @bestta8155 2 роки тому

    Làm thêm nhiều video như v nha a hi

  • @hungangquang9233
    @hungangquang9233 3 місяці тому

    console.log('số 1')
    setTimeout(function () {
    console.log('số 2')
    },2000)
    console.log('số 3')
    setTimeout(function () {
    console.log('số 1')
    },3000)
    console.log('số 2')
    setTimeout(function () {
    console.log('số 3')
    },0)
    console.log('số 4')

  • @VuNguyen-zr1mn
    @VuNguyen-zr1mn 2 роки тому +1

    Coi ông tây k hiểu gì , qua coi a dễ hiểu ghê

    • @firelop
      @firelop  2 роки тому

      Kkkk. Coi ông tây nào v?

  • @noras9835
    @noras9835 2 роки тому

    Hay nhỉ, dể hiểu quá, lâu giờ chưa hiểu tại sao Js có bất động bộ nhưng bản chất nó cũng chỉ xử lý single flow, thanks

  • @TrườngVõ-t7y
    @TrườngVõ-t7y 6 місяців тому

    hay anh, e cám ơn

  • @reneenguyen8713
    @reneenguyen8713 2 роки тому

    quá hay luôn ạ

  • @VanTay-TomCon
    @VanTay-TomCon 2 роки тому

    Anh ơi em đang học html css anh làm video dễ hiểu lắm anh anh ra thêm video css đi anh

  • @HuyNguyen-zp8ju
    @HuyNguyen-zp8ju Рік тому

    Một ngôn ngữ single threaded nhưng vẫn có cách để handle asynchronous task = event loop. Đó là lí do mà NodeJs vẫn không thể bị đào thải được

  • @nghebao21
    @nghebao21 4 місяці тому

    Hay qua!

  • @thanhduynguyen6253
    @thanhduynguyen6253 7 місяців тому

    ae nào mà PVan FPT chắc nên xem video này :))

  • @phattan6713
    @phattan6713 2 роки тому +1

    Anh cho em hỏi là những clip anh làm là về lập trình của mảng nào vậy?
    Nó là 1 trong những ngôn ngữ lập trình ạ??
    Em mới tốt nghiệp và đang tìm hiểu để vào ngành công nghệ thông tin ạ mong anh rep

    • @firelop
      @firelop  2 роки тому

      Lập trình web nhé!

    • @firelop
      @firelop  2 роки тому

      Nội dung trong video này không dành cho người mới, nó là nội dung nâng cao của JavaScript

  • @Kevin-xi3nz
    @Kevin-xi3nz Рік тому

    Theo e thì sau khi console.log("3") execute xong thì global execution context cũng bị loại ra khỏi callstack. Ví dụ 3:11

  • @nvtentertainment4098
    @nvtentertainment4098 2 місяці тому

    quá dễ hiểu

  • @lordsaurondevoffical363
    @lordsaurondevoffical363 2 роки тому

    hay lắm anh giai

  • @chrisbuivn188
    @chrisbuivn188 7 місяців тому

    Hay bạn ơi :))))

  • @AnPham-my8oy
    @AnPham-my8oy 2 роки тому +2

    bạn ơi, cho mình hỏi asynchronus thì là chạy concurrent chứ sao lại song song, theo mình tìm hiểu thì là vậy, ai giải thích giúp mình với

  • @Quoccute854
    @Quoccute854 10 місяців тому

    đỉnh qué

  • @otis2512
    @otis2512 Рік тому

    hay a ơi

  • @NhacMuiTet
    @NhacMuiTet 2 роки тому

    Dễ hiểu vậy trời

  • @ming7469
    @ming7469 6 місяців тому

    Ví dụ trong trường hợp do đoạn code giữa settimeout thứ 1 và 2 quá nhiều nên khi gọi đến set thứ 2 thì cái settimeout 3s đã được đưa vào web api và đợi hết 3s rồi. Cho em hỏi như vậy settimeout nào được đưa vào callback queue trước ạ

  • @AMinh-fo3vn
    @AMinh-fo3vn 5 місяців тому

    Hay

  • @fantasy_0.5
    @fantasy_0.5 5 місяців тому

    hình như là tất cả các lệnh đều đồng bộ đều được đưa vào callstack mà anh , ngay cả khai báo biến

  • @DuyNguyen-nguyenkhuongduy
    @DuyNguyen-nguyenkhuongduy Рік тому

    Anh làm so sanh settimeout vs setintervor đi

  • @quocdattranquoc1832
    @quocdattranquoc1832 Рік тому

    micro task cũng là async task nhưng tại sao nó lại chạy trước thằng sync task được vậy a nhỉ.

  • @nguynthhng1
    @nguynthhng1 2 роки тому +1

    Thắc mắc: có trường hợp nào callstack luôn bận làm cho callback queue không đưa lệnh sang được không?

    • @Kevin-xi3nz
      @Kevin-xi3nz Рік тому +1

      1. setTimeout(()=>{console.log("callback queue"), 1000}
      while(true){
      console.log("call stack");
      }
      2. setTimeout(()=>{console.log("callback queue"), 1000}
      function recursion(){
      console.log("call stack");
      recursion();
      }

  • @n2tshoki926
    @n2tshoki926 2 роки тому

    LÀM LỘ TRÌNH WEB BACK END ĐI Ạ

  • @antonytran229
    @antonytran229 Рік тому

    Ai bảo là bất đồng bộ là chạy song song đấy :)). NodeJS là single thread và 100% k chạy song song nhé

  • @devbackend9672
    @devbackend9672 4 місяці тому

    Anh cho em hỏi nếu như trên video các hàm đồng bộ sẽ vào callStack xử lý thì await wait() ở dưới đã là đồng bộ mà sao console.log(1111) vẫn trả kết quả trước ạ.
    const run = async () => {
    setTimeout(() => {
    console.log(1111)
    }, 1000);
    await wait()
    console.log(2222)
    }
    const wait = () => {
    return new Promise(resolve => {
    setTimeout(() => {
    resolve(true)
    }, 10000);
    })
    }
    run()

    • @quangquyennguyen9390
      @quangquyennguyen9390 4 місяці тому +1

      bản chất của js là bất đồng bộ, bạn await tức là bạn đợi 1 promise trả về. Trong code của bạn đầu tiên là bạn gọi hàm run, hàm run sẽ chạy settimeout, sau đó nó sẽ đợi cái promise await của bạn và cuối cùng là console.log(2.2.2.2)
      còn về câu hỏi của bạn thì cái console.log(2222) nó không phải là top-level-code nên nó không được eventloop thực thi trước, nó nằm trong cái function run() của bạn mà

    • @devbackend9672
      @devbackend9672 4 місяці тому

      @@quangquyennguyen9390 bạn có thể ghi rõ lại trình tự vào callstack, web api và callback queue với đoạn code trên ko ạ, c.ơn bạn trước.

    • @quangquyennguyen9390
      @quangquyennguyen9390 4 місяці тому +1

      @@devbackend9672 nghe cách nói của bạn là mình hiểu bạn không biết về execution context rồi, mỗi hàm trong js sẽ được coi như 1 execution context. Các top-level code sẽ được thực thi trước, nó cũng là một execution context ta gọi nó là global execution context , ở đây là gọi hàm run() sau đó js tạo một execution context của hàm run, sau đó ta thực thi hàm run thì nó sẽ đợi một giây rồi mới log ra 1111, tiếp đó bạn sẽ gọi hàm await(), lý do bạn dùng await await() vì hàm await() là một promise và await đợi một promise cho đến khi nó trả về fulfil hay reject. Khi gọi hàm await() thì nó tạo ra một execution context của hàm await() tiếp đó nó đợi 10s để trả về promise fulfil. Sau khi trả về rồi thì xong, in ra và execution context của hàm await() kết thúc công việc của nó và bị đẩy khỏi stack. Tiếp tục phần cuối cùng là log 2222 ra, kết thúc. Execution context của hàm run() bị đẩy khỏi stack và bây giờ là global execution context cũng bị đẩy khỏi stack. Kết thúc thực thi.

    • @devbackend9672
      @devbackend9672 4 місяці тому

      @@quangquyennguyen9390 cảm ơn bạn nhiều nhé

    • @quangquyennguyen9390
      @quangquyennguyen9390 4 місяці тому

      @@devbackend9672 mình cũng đang ôn lại async (python) nên mình khá rảnh. Mình có phát triển code của bạn lên như này
      const run = async () => {
      setTimeout(() => {
      console.log(1111)
      }, 0);

      await wait()
      console.log(2222)
      }
      const wait = () => {
      return new Promise(resolve => {
      setTimeout(() => {
      console.log('entering promise')
      resolve(true)
      }, 5000);
      })
      }
      console.log('0000')
      run()
      console.log('3333')
      const run1 = async () => {
      setTimeout(() => {
      console.log(5555)
      }, 0);

      await wait1()
      console.log(6666)
      }
      const wait1 = () => {
      return new Promise(resolve => {
      setTimeout(() => {
      console.log('entering promise1')
      resolve(true)
      }, 5000);
      })
      }
      console.log('4444')
      run1()
      console.log('7777')
      đọc log xong rồi suy ngẫm nhé. Bạn sẽ hiểu sâu hơn cả về event-loop và async. Dùng Nodejs để chạy code này nhé. Mình là backend nên không hiểu js trên browser

  • @minhhoang576
    @minhhoang576 6 днів тому

    like

  • @khongtennguyen4863
    @khongtennguyen4863 Місяць тому

    hay vl

  • @LeNgoc-uc8cy
    @LeNgoc-uc8cy 6 місяців тому

    hiểu