ขนาดวิดีโอ: 1280 X 720853 X 480640 X 360
แสดงแผงควบคุมโปรแกรมเล่น
เล่นอัตโนมัติ
เล่นใหม่
【補充資訊】要理解本章節，需要先有以下知識比較容易理解影片內容。stack與queue都是資料結構中會學到的概念，而call stack通常會在學習比較低階的程式語言，或是大一大二計算機基礎的課程中會提到。如果沒有相關背景知識，可以參考以下連結。【stack】stack為一種資料結構，需要支援push與pop兩種操作。stack特性為先進後出。詳細可參考以下連結： ithelp.ithome.com.tw/articles/10265265【queue】queue為一種資料結構，需要支援enqueue與dequeue兩種操作。queue特性為先進先出。詳細可參考以下連結： ithelp.ithome.com.tw/articles/10266980【call stack】在程式執行的時候，會在記憶體中有一個區塊，用來記錄函數的呼叫與返回。這個區塊稱為call stack。詳細可參考以下連結： www.lagagain.com/post/這些那些你可能不知道我不知道的web技術細節12/程式語言課程：jameskool.com/p/javascript-course-v2副頻道：www.youtube.com/@james-clipsig：instagram.com/jameskool.official/Patreon會員專屬影片：www.patreon.com/user?u=99360097
雖然非新手 但還是想支持一下跟加強js底子當然主因是這詳細的動畫圖解 看得出來下很多功夫！
@@Yu_blackhole 感謝支持！
想問個課程問題:課程是無時限的嗎?由於目前要考研沒空看的原因，考慮買來考完研後再看
@@dragonfly1487對， 無時限哦～
挺好的，就是有很多细节还不明白，例如setTimeout 的时间到了，而stack还堆着没有执行的指令，那是接着执行Stack里剩下的指令还是把Queue里的指令拿出来立刻执行呢
這個剪輯強到我都沒辦法專心看內容了😂😂😂
真的，動畫愈作愈厲害...
被程式耽誤的動畫師(誤
我真是太震撼了，從很久以前開始看 james 的影片，這一支製作之精良簡直無可挑剔
第一次這麼清晰地理解js 的 stack跟queue
Promise 是基於 Marco Task & Micro Task 演變出來, 而最重要是 State 的觸法條件。每一次將 Task 放入特處理的 Marco Task 內, 每一組 Marco Task 執行, 那組每一個 Task 就是 Micro Task。就是 Stack & Queue 基礎概念。上一組 Micro Task 還沒跑完, Queue 進去的新 Task 會 Stack 到下一輪 Marco Task 等待下一個 Cycle 執行。當時還沒有 Promise, 則把 callback / variable 用另一個 callback 包著再執行, 然後傳入兩個 callback 分別為 resolve 跟 reject 去接收 callback 執行結果。而 then 則是把 callback 塞到 Marco Task 等待 resolve 後, 把 Marco Task 抽出一組迴圈成每一個 Mirco Task 包裝成 Promise, 把結果傳進去執行一直下去
這次的影片動畫特效太強了吧！！！
好厲害的影片，清晰易懂，感謝🙏
竟然出技術內容了，推
超用心。希望能看到更深度的內容
推推，還用影片呈現也太用心
这就是js 里面最重要的一个机制：回调函数 的原理。通过使用回调函数机制，js 即便是单线程也可以执行异步动作。通过这个机制，也可以产生所谓的伪多线程的程序效果。
好精緻的影片 辛苦了～
這個配音, 剪輯 好讚
又幫複習了一次感謝哥
其實就是JS雖然是單執行緒 但瀏覽器是多執行緒 異步任務會由瀏覽器的多執行執行完
最近為了要實現作業的一些功能剛好卡在這個點上這真是一場及時雨呀 🤣
Great work!在中文教程中算頂的
超級清楚!!! 感謝
謝謝分享！影片很精緻，但是好像有幾支影片的音樂都蓋過人聲，讓人需要很專心才可以聽得清楚在說什麼，觀賞上有些困擾。
很棒，受教
nice 很讚
教學動畫真精緻👍可以分享一下是用什麼軟體製作的嗎
使用manim搭配Davinci resolve 做的
製作這個影片一定很麻煩，給你一個讚！！
請問第三個範例中，如果用 await fetch() 的話，stack 中的 fetch 會馬上被 pop 出來嗎？
希望可以再做一集講宏任務和微任務 ~
就想成一個工人，要把現在這張單子做好，那單子上要等的東西，就放在旁邊單子弄好後，放在旁邊的工作在重新開始做跟 C# 比 JS算簡單，C# 一下async await 曾經看過，async 有5層(被汙染了)，然後真的Await現在是哪個都不知道，弄到後面想哭最後直接不管，強制一段做完在呼叫下一段，反正寫遊戲Loading，不怕浪費時間其實真覺得，程式語言要有個退役時間，時間到就該讓他退退不然累積的技術債問題真的很大......
非同步本來就有傳播性，await 哪個不知道是寫的人的問題而不是語言問題。
退役這件事情代表成本管理的部分你沒想到，如果能退役就退役那前提是你要先有成本去重寫相關程式碼，技術債是一定會堆疊，公司營運沒有像寫程式一樣又簡單、又單純的
想問個問題，要怎麼知道自己已經會某些概念了？比如這次談到的單執行緒，我能夠很快的回答出正確答案，感覺我會了，但又同時覺得我還不會😢 很矛盾
期待未來出linux課程
當真是要多執行緒的時候就用worker，可以把cpu跑滿100% (x
支持一下
多執行緒也不代表同時, 除非是多核
這集突然覺得剪輯比程式還有趣
World怎麼聽起來像是well
影片很精緻，字幕有點...
很工程師的字幕😂
Hello~World~
BGM有點大聲
BGM太大。 1:20
為什麼你的中英文發音都可以讓字幕君想自殺?
讓子彈飛一會
queue與stack 是什麼😥
queue跟stack都是資料結構喔。他們都支援push跟pop兩種運算。push會把一個item加到裡面，pop會把元素拿出來。queue的特性是先進先出，意思是第一個push進去的東西也會第一個出來。stack為先進後出，第一個push進去的東西會最後出來。
我也好奇，之前只有學過function call時，會把變數跟program counter push到stack。但queue是什麼？
@@james-kool 我所知道的只有text, data, bss, heap, stack而已 (參考wiki en.wikipedia.org/wiki/Code_segment )那queue是在哪個部份？
@@Yin-Hsun_Hung callback queue是event loop的一個部分
@@Yin-Hsun_Hungstack跟queue都只是一種抽象的資料結構。實作上差別只是增加資料跟取出資料的起始位置是在頭還是尾而已。本質上都是一串連續的資料。
【補充資訊】
要理解本章節，需要先有以下知識比較容易理解影片內容。stack與queue都是資料結構中會學到的概念，而call stack通常會在學習比較低階的程式語言，或是大一大二計算機基礎的課程中會提到。如果沒有相關背景知識，可以參考以下連結。
【stack】
stack為一種資料結構，需要支援push與pop兩種操作。stack特性為先進後出。詳細可參考以下連結： ithelp.ithome.com.tw/articles/10265265
【queue】
queue為一種資料結構，需要支援enqueue與dequeue兩種操作。queue特性為先進先出。詳細可參考以下連結： ithelp.ithome.com.tw/articles/10266980
【call stack】
在程式執行的時候，會在記憶體中有一個區塊，用來記錄函數的呼叫與返回。這個區塊稱為call stack。詳細可參考以下連結： www.lagagain.com/post/這些那些你可能不知道我不知道的web技術細節12/
程式語言課程：jameskool.com/p/javascript-course-v2
副頻道：www.youtube.com/@james-clips
ig：instagram.com/jameskool.official/
Patreon會員專屬影片：www.patreon.com/user?u=99360097
雖然非新手 但還是想支持一下跟加強js底子
當然主因是這詳細的動畫圖解 看得出來下很多功夫！
@@Yu_blackhole 感謝支持！
想問個課程問題:
課程是無時限的嗎?
由於目前要考研沒空看的原因，考慮買來考完研後再看
@@dragonfly1487對， 無時限哦～
挺好的，就是有很多细节还不明白，例如setTimeout 的时间到了，而stack还堆着没有执行的指令，那是接着执行Stack里剩下的指令还是把Queue里的指令拿出来立刻执行呢
這個剪輯強到我都沒辦法專心看內容了😂😂😂
真的，動畫愈作愈厲害...
被程式耽誤的動畫師(誤
我真是太震撼了，從很久以前開始看 james 的影片，這一支製作之精良簡直無可挑剔
第一次這麼清晰地理解js 的 stack跟queue
Promise 是基於 Marco Task & Micro Task 演變出來, 而最重要是 State 的觸法條件。每一次將 Task 放入特處理的 Marco Task 內, 每一組 Marco Task 執行, 那組每一個 Task 就是 Micro Task。就是 Stack & Queue 基礎概念。上一組 Micro Task 還沒跑完, Queue 進去的新 Task 會 Stack 到下一輪 Marco Task 等待下一個 Cycle 執行。當時還沒有 Promise, 則把 callback / variable 用另一個 callback 包著再執行, 然後傳入兩個 callback 分別為 resolve 跟 reject 去接收 callback 執行結果。而 then 則是把 callback 塞到 Marco Task 等待 resolve 後, 把 Marco Task 抽出一組迴圈成每一個 Mirco Task 包裝成 Promise, 把結果傳進去執行一直下去
這次的影片動畫特效太強了吧！！！
好厲害的影片，清晰易懂，感謝🙏
竟然出技術內容了，推
超用心。希望能看到更深度的內容
推推，還用影片呈現也太用心
这就是js 里面最重要的一个机制：回调函数 的原理。通过使用回调函数机制，js 即便是单线程也可以执行异步动作。通过这个机制，也可以产生所谓的伪多线程的程序效果。
好精緻的影片 辛苦了～
這個配音, 剪輯 好讚
又幫複習了一次感謝哥
其實就是JS雖然是單執行緒 但瀏覽器是多執行緒 異步任務會由瀏覽器的多執行執行完
最近為了要實現作業的一些功能
剛好卡在這個點上
這真是一場及時雨呀 🤣
Great work!
在中文教程中算頂的
超級清楚!!! 感謝
謝謝分享！影片很精緻，但是好像有幾支影片的音樂都蓋過人聲，讓人需要很專心才可以聽得清楚在說什麼，觀賞上有些困擾。
很棒，受教
nice 很讚
教學動畫真精緻👍可以分享一下是用什麼軟體製作的嗎
使用manim搭配Davinci resolve 做的
製作這個影片一定很麻煩，給你一個讚！！
請問第三個範例中，如果用 await fetch() 的話，stack 中的 fetch 會馬上被 pop 出來嗎？
希望可以再做一集講宏任務和微任務 ~
就想成一個工人，
要把現在這張單子做好，那單子上要等的東西，就放在旁邊
單子弄好後，放在旁邊的工作在重新開始做
跟 C# 比 JS算簡單，C# 一下async await 曾經看過，
async 有5層(被汙染了)，然後真的Await現在是哪個都不知道，弄到後面想哭
最後直接不管，強制一段做完在呼叫下一段，
反正寫遊戲Loading，不怕浪費時間
其實真覺得，程式語言要有個退役時間，時間到就該讓他退退
不然累積的技術債問題真的很大......
非同步本來就有傳播性，await 哪個不知道是寫的人的問題而不是語言問題。
退役這件事情代表成本管理的部分你沒想到，如果能退役就退役那前提是你要先有成本去重寫相關程式碼，技術債是一定會堆疊，公司營運沒有像寫程式一樣又簡單、又單純的
想問個問題，要怎麼知道自己已經會某些概念了？比如這次談到的單執行緒，我能夠很快的回答出正確答案，感覺我會了，但又同時覺得我還不會😢 很矛盾
期待未來出linux課程
當真是要多執行緒的時候就用worker，可以把cpu跑滿100% (x
支持一下
多執行緒也不代表同時, 除非是多核
這集突然覺得剪輯比程式還有趣
World怎麼聽起來像是well
影片很精緻，字幕有點...
很工程師的字幕😂
Hello~
World~
BGM有點大聲
BGM太大。 1:20
為什麼你的中英文發音都可以讓字幕君想自殺?
讓子彈飛一會
queue與stack 是什麼😥
queue跟stack都是資料結構喔。他們都支援push跟pop兩種運算。push會把一個item加到裡面，pop會把元素拿出來。
queue的特性是先進先出，意思是第一個push進去的東西也會第一個出來。
stack為先進後出，第一個push進去的東西會最後出來。
我也好奇，之前只有學過function call時，會把變數跟program counter push到stack。但queue是什麼？
@@james-kool 我所知道的只有text, data, bss, heap, stack而已 (參考wiki en.wikipedia.org/wiki/Code_segment )
那queue是在哪個部份？
@@Yin-Hsun_Hung callback queue是event loop的一個部分
@@Yin-Hsun_Hungstack跟queue都只是一種抽象的資料結構。實作上差別只是增加資料跟取出資料的起始位置是在頭還是尾而已。本質上都是一串連續的資料。