JavaScript Execution Context: Detailed Breakdown 1. Everything in JavaScript Happens Inside an Execution Context * All JavaScript code runs within an execution context, which provides an environment for the code execution. 2. Global Execution Context (GEC) : * When JavaScript code runs, it first creates a Global Execution Context (GEC). * The GEC acts like a container with two main components: => Memory Component (Variable Environment) => Code Component (Thread of Execution) 3. Phases of Execution Context Creation : * The GEC undergoes two phases: => Creation Phase (Memory Creation Phase) => Execution Phase (Code Execution Phase)
4. Memory Creation Phase : * JavaScript code is processed line by line. * During the Memory Creation Phase, it allocates memory for variables and functions: * Variables are stored as key-value pairs. * Initially, variables are assigned a value of undefined. * Functions are stored in their entirety, including their code. 5. Execution Phase * In this phase, the actual code executes line by line. * Variables are assigned their actual values, replacing undefined. 6. Function Execution Context : * When a function is invoked (called), a new execution context is created within the GEC. * This new context undergoes the same phases: => Memory Creation Phase : Allocates memory for parameters and local variables, initially setting them to undefined. => Execution Phase : Executes the function code line by line, assigning actual values to variables. * Once the function completes execution, its context is removed, and control returns to the GEC. 7. Call Stack : * The Call Stack manages the order of execution contexts. * The GEC is the first entry in the Call Stack. * When a new execution context is created (e.g., a function is called), it is added to the top of the Call Stack. * Once execution is completed, the context is removed from the stack, and control returns to the previous context. * When the entire program completes, the Call Stack becomes empty. 8. Different Names for the Call Stack : * The Call Stack, a LIFO (Last In, First Out) data structure, is also known as: => Call Stack => Execution Context Stack => Program Stack => Machine Stack => Control Stack 9. JavaScript Code Analysis : * Before execution, JavaScript code is analyzed and broken into parts known as tokens (tokenization). * An Abstract Syntax Tree (AST) is created from these tokens. * The JavaScript engine uses the AST to convert the code into machine code. 10. Global Execution Context Without Code : * Even if no code is present, JavaScript still creates a Global Execution Context. * The initial state of the GEC contains: => window (Global Object) => this keyword, which refers to the global object in the global context * console.log(window === this); => Output : true Thanks @tapascript-bangla
আপনার সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করছি... এরকম জটিল বিষয়গুলো সহজভাবে বুঝানোর জন্য ধন্যবাদ... আমি আশাকরি js class , module এগুলার উপরে ভিডিও নিয়ে আসবেন, আমার কাছে এই বিষয়টি জটিল মনে হয় ,
Dada apnar video gula onk easy to understand.❤ Please make a video on this keyword. Please i watchd tones of videos and stills it confuses me while solving tricky questions plz. Ai related akta complete video den🥹
আপনাকে অসংখ্য ধন্যবাদ "Execution Context" মত একটা টপিককে ডাল ভাতের মতো করে বোঝানোর জন্য | JavaScript এই ধরনের আরো কিছু কনসেপ্ট আছে সেগুলো নিয়ে ভিডিও বানালে আমরা অনেক বেশি উপকৃত হবো। ধন্যবাদ
Javascript engine er modhe ki hoche setar jonno onek video dekhechi kintu puropuri bujte pari ni tai javascript er upor valo laga kaj kare ni apner video dekhe onektai bujte parchi vetore ki hoche. Dhonno bad dada ei rokum content dear jonno ❤.javascript er upor aro video chai basic core bisoyer upor eto din ondhokare dil churar mato amar obosta chilo.
Truly nice explanation dada 😍 Hope that, you will be consistent about this basic concept like how javascript garbage works, events & event loop, error handling, etc.
Another awesome creation by Tapas Dada. Ah, the first 26 minutes laid down the foundation for Callstack, and Dada, you just breezed through it flawlessly!! Loved every bit of it! 😍 Note: Most TH-camrs kick things off from the callstack (after that initial 26 minutes of this video), but there's some extra sauce on top that only Dada knows.
Dada tomar English channel tar subscribe ami, khub bhalo laglo ai channel ta suggestions dekha pore. Dada khub bhalo kaj korcho Tumi Bengali community jonno jara Bangla bhalo bhabe bujhte pare. Please dada JavaScript eeee series ektu joldi video diyeao. Thank you Dada for this Wonderful channel.
Prosenjit, thank you vai... amar english channeler subscriber hoyar jonyo and support korar jonyo. Asha kori, oi content gulo tomar kaje ashe 🙂 Bangla community and developer der jonyo kichu korte pere ami gorbito. 2 to channel e cholbe soman bhabe... vai, tomader jana suna der modhye amar channel dutor kotha share koro 🙏 JavaScript er series ar baki vido aro taratari asbe June theke... amar course ta pray sesher pothe... tarpore ami free. Thanks!
@@tapascript-bangla Sotti bolchi dada ami j ki khusi holam ai channel ta subscribe kore se ar bolle bojhate parbo naa dada. Acha dada tumi ki Porao Private eee JavaScript
for (let i = 0; i < 5; i++) { setTimeout(() => { console.log(i); }, 1000); } দাদা আপনি যে ভাবে কোড বুজিয়ে দেন আর কেউ এবাবে বুজিয়ে দেয় না, তাই একটা অনুরোদ উপরের কোডটা আমি Execution Context দিয়ে ভিসুয়ালি বুঝতে চাচ্ছি let and var দিয়ে। প্লিস আমাকে একটি ভিডিও লিংক দিন নয়তো আপনি একটি ভিডিও বানান আপনার বাংলা চ্যানেলে। আমি খুব উপকৃত হবো.
I will be waiting for the event loop and closure, these look easy but are hard to understand and execute properly. Please consider these topics also in the next video.
Javascript niye bhoy petam but ajker por theke ar noy 😂😂😂 Ebhabe explain korle se je keu hok na keno bujhte parbe ❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤
আলহামদুলিল্লাহ অনেক ভালো হয়েছে, আপনার ইউটিউবের সবগুলা ভিডিও কমপ্লিট করার চেষ্টা করব
After some days I am seeing your videos..Your video is to much good.I understand clearly.
thank you .
দাদা, খুব সুন্দর বুঝিয়েছেন। ধন্যবাদ। ❤❤
কিন্তু কিভাবে যে এই জটিল জিনিসটা javascript enterpreter মুহুর্তের মধ্যে করে ফেলে। তাই চিন্তা করি।
Awesome :)
JavaScript Execution Context: Detailed Breakdown
1. Everything in JavaScript Happens Inside an Execution Context
* All JavaScript code runs within an execution context, which provides an environment for the code execution.
2. Global Execution Context (GEC) :
* When JavaScript code runs, it first creates a Global Execution Context (GEC).
* The GEC acts like a container with two main components:
=> Memory Component (Variable Environment)
=> Code Component (Thread of Execution)
3. Phases of Execution Context Creation :
* The GEC undergoes two phases:
=> Creation Phase (Memory Creation Phase)
=> Execution Phase (Code Execution Phase)
4. Memory Creation Phase :
* JavaScript code is processed line by line.
* During the Memory Creation Phase, it allocates memory for variables and functions:
* Variables are stored as key-value pairs.
* Initially, variables are assigned a value of undefined.
* Functions are stored in their entirety, including their code.
5. Execution Phase
* In this phase, the actual code executes line by line.
* Variables are assigned their actual values, replacing undefined.
6. Function Execution Context :
* When a function is invoked (called), a new execution context is created within the GEC.
* This new context undergoes the same phases:
=> Memory Creation Phase : Allocates memory for parameters and local variables, initially setting them to undefined.
=> Execution Phase : Executes the function code line by line, assigning actual values to variables.
* Once the function completes execution, its context is removed, and control returns to the GEC.
7. Call Stack :
* The Call Stack manages the order of execution contexts.
* The GEC is the first entry in the Call Stack.
* When a new execution context is created (e.g., a function is called), it is added to the top of the Call Stack.
* Once execution is completed, the context is removed from the stack, and control returns to the previous context.
* When the entire program completes, the Call Stack becomes empty.
8. Different Names for the Call Stack :
* The Call Stack, a LIFO (Last In, First Out) data structure, is also known as:
=> Call Stack
=> Execution Context Stack
=> Program Stack
=> Machine Stack
=> Control Stack
9. JavaScript Code Analysis :
* Before execution, JavaScript code is analyzed and broken into parts known as tokens (tokenization).
* An Abstract Syntax Tree (AST) is created from these tokens.
* The JavaScript engine uses the AST to convert the code into machine code.
10. Global Execution Context Without Code :
* Even if no code is present, JavaScript still creates a Global Execution Context.
* The initial state of the GEC contains:
=> window (Global Object)
=> this keyword, which refers to the global object in the global context
* console.log(window === this);
=> Output : true
Thanks @tapascript-bangla
আপনার সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করছি... এরকম জটিল বিষয়গুলো সহজভাবে বুঝানোর জন্য ধন্যবাদ...
আমি আশাকরি js class , module এগুলার উপরে ভিডিও নিয়ে আসবেন, আমার কাছে এই বিষয়টি জটিল মনে হয় ,
অসাধারণ দাদা। Execution context নিয়ে যখন ঝামেলা ছিল সব ক্লিয়ার হয়ে গেল। অনেক ধন্যবাদ দাদা ❤
❤❤❤❤ very good video ❤❤❤
Best video in my life
undoubtedly , the best channel for learn programming fundamental😍😍
Take love dada
Thanks a lot
দাদা, সত্যিই আপনার ভিডিও অসাধারণ। থামবেন না প্লিজ। আমরা লার্নার রা অনেক উপকৃত হচ্ছি।
Dada apnar video gula onk easy to understand.❤ Please make a video on this keyword. Please i watchd tones of videos and stills it confuses me while solving tricky questions plz. Ai related akta complete video den🥹
পাতি বাংলাই বললে একদম মাখন ভাই। হিপের ব্যাপার্টা সেরা ছিল। অসংখ্য ধন্যবাদ। এখন গিয়া আগের ভিডিওটা দেখব ভেলু ও রেফারেন্স
আপনাকে অসংখ্য ধন্যবাদ "Execution Context" মত একটা টপিককে ডাল ভাতের মতো করে বোঝানোর জন্য | JavaScript এই ধরনের আরো কিছু কনসেপ্ট আছে সেগুলো নিয়ে ভিডিও বানালে আমরা অনেক বেশি উপকৃত হবো। ধন্যবাদ
Nischoy… amar lots of plan ache
video onek valo hoyese
very nice explanation. thanks for such a video. waiting for more.
Most welcome!
vayia javascript niye full series diben plz...vaiya apnar function r class dakhe ami apnar fan hoye gechi
Best video I ever seen for learning programming
wow, Pure Explination. kono daut nai vai.. khub balo babe protiti jinish bujesi, onek thanks @tapaScript bangla channel k ..
Sathe thakun vai... amar uddesso apnader career e help kora... onek concepts clear korabo in future,
@@tapascript-bangla i will wait for it. your every single video is very crucial as well as every sound. i like it .
@@hakikatsareebitan thanks! I treat each of the videos like my own kid ❤️
দাদা এর থেকে ভাল বোঝানো আর হয় না।সত্যি অসাধারণ ❤
Javascript engine er modhe ki hoche setar jonno onek video dekhechi kintu puropuri bujte pari ni tai javascript er upor valo laga kaj kare ni apner video dekhe onektai bujte parchi vetore ki hoche. Dhonno bad dada ei rokum content dear jonno ❤.javascript er upor aro video chai basic core bisoyer upor eto din ondhokare dil churar mato amar obosta chilo.
অনেক ধন্যবাদ ভাই। ভালো থাকবেন।
শুধু নতুন কিছুই শিখলাম না, অসাধারণ অনেক কিছুই শিখলাম এবং খুব সহজেই। কৃতজ্ঞতা এতটা শেখানোর জন্য...
Very nice ❤️
Alhamdulillah akdom clearly noton onk concept sikhalm, Jajakallah Khairan (ortho: Allah apnake uttom protidan dan korok)
অনেক ধন্যবাদ
JavaScript is fun. eta apnar video dekhe feel korchi. Thanks dada
You are right! JavaScript is real fun.
Truly nice explanation dada 😍 Hope that, you will be consistent about this basic concept like how javascript garbage works, events & event loop, error handling, etc.
অসাধারণ! এক বসায় পুরো ভিডিওটা দেখা শেষ করলাম। টাস্ক কমপ্লিট করলাম। অনেক অনেক ধন্যবাদ। অপেক্ষায় রইলাম পরের ভিডিওটার জন্য।
♥♥♥ mind blowing explanation. abstract think hard to explain but you did it very well. ♥♥♥
দাদা, সত্যিই আপনার ভিডিও অসাধারণ। এত সহজভাবে বুঝানোর ক্ষমতা আজ পর্যন্ত কারো কাছেই পাইনি। 🥰🥰
dhonyobad vai
অসাধারণ - একদম ক্লিয়ার ! কৃতজ্ঞতা জানাই...!
অনেক কিছুই বুঝলাম দাদা। হোয়েস্টিং এবং স্কোপ ভিডিওর জন্য অপেক্ষা করছি।🥰
Yes! Er pore asbe.
This video was very helpful. I learned a lot from it.💌
I'm so glad!
Thank you! It is of a great help
Awesome
omg... it's awesooooome
Another awesome creation by Tapas Dada.
Ah, the first 26 minutes laid down the foundation for Callstack, and Dada, you just breezed through it flawlessly!! Loved every bit of it! 😍
Note: Most TH-camrs kick things off from the callstack (after that initial 26 minutes of this video), but there's some extra sauce on top that only Dada knows.
Thank you, vai… fundamentals win.. 🏅
Awesome Explanation. Thanks for sharing.
দাদা আমি আপনার এই ভিডিও দেখে দেখে একটা নোট্স নিছি ব্লগ আকারে। আপনার ডিসকডে আমি জয়েন আছি কিন্তু কোন চ্যানেলে শেয়ার করবো বুঝতে পারছি না।
Watching full video was like an exciting journey.
Expecting more and more videos like this.
thank you
Most welcome
thanks sir
Nice, thanks a lot
Awesome....!! thank you so much sir.
Most welcome!
That's great. I love it. 💚
thank you ❤
Excellent!!!!!!!!!!
What an easy explanation! need more this type of videos.
Thanks Bro
অসাধারণ দাদা ভাই
wonderful video vai
Many many thanks
Great explanation❤
Please akta video banan, je kivave user frisname + emil/number show kora jai mobile side menu te.
Like Amazon mobile side manu te user profile info
Dada it's great, waiting Closures and others
Execution Context এর জয় হক
❤❤❤❤❤❤
দাদা❤❤❤❤❤
Learned something new.
Awesome explanation sir.
your teaching style is very very excelent
Thank you ❤️
Thank you Dada
অসাধারণ
Vai, thank you, খুব ভালো লাগলো 🤩. Take love ❤️
Goldmine!
Very nice explanation 😊❤
Thank you ❤️
Thanks a lot.
Most welcome!
Dada tomar English channel tar subscribe ami, khub bhalo laglo ai channel ta suggestions dekha pore. Dada khub bhalo kaj korcho Tumi Bengali community jonno jara Bangla bhalo bhabe bujhte pare. Please dada JavaScript eeee series ektu joldi video diyeao. Thank you Dada for this Wonderful channel.
Prosenjit, thank you vai... amar english channeler subscriber hoyar jonyo and support korar jonyo. Asha kori, oi content gulo tomar kaje ashe 🙂
Bangla community and developer der jonyo kichu korte pere ami gorbito. 2 to channel e cholbe soman bhabe... vai, tomader jana suna der modhye amar channel dutor kotha share koro 🙏
JavaScript er series ar baki vido aro taratari asbe June theke... amar course ta pray sesher pothe... tarpore ami free.
Thanks!
@@tapascript-bangla Sotti bolchi dada ami j ki khusi holam ai channel ta subscribe kore se ar bolle bojhate parbo naa dada. Acha dada tumi ki Porao Private eee JavaScript
@@prasenjitbasu6152 na ekhono na… public ei poray youtube e. But I will start mentoring session in June on topmate again… oita private hobe
@@tapascript-bangla Okay dada waiting. Please dada ekta short video baniyea duto channel eee date ta janiyea diyeao.
Your teaching method is amazing!!!
Thank you! 😃
sir Set , Map , debouncing ,throttling aglo aste aste add korben apnar playlist a.
Korbo vai
দাদা লেগে আছি কিন্তু আপনার সাথে
for (let i = 0; i < 5; i++) {
setTimeout(() => {
console.log(i);
}, 1000);
}
দাদা আপনি যে ভাবে কোড বুজিয়ে দেন আর কেউ এবাবে বুজিয়ে দেয় না, তাই একটা অনুরোদ উপরের কোডটা আমি Execution Context দিয়ে ভিসুয়ালি বুঝতে চাচ্ছি let and var দিয়ে। প্লিস আমাকে একটি ভিডিও লিংক দিন নয়তো আপনি একটি ভিডিও বানান আপনার বাংলা চ্যানেলে। আমি খুব উপকৃত হবো.
pls, bhai keep it up
Thank You! Your Support Helps.
What an articulation? Never seen before.
Thank you! ❤
I will be waiting for the event loop and closure, these look easy but are hard to understand and execute properly. Please consider these topics also in the next video.
@@anunayargha6064 surely 🙌
How calm when you are talking!!
Thank you, vai ❤️.
Shera Shera 🥵 🥵 🤑🤑
Thank you!
Please Upload a Python for Beginner tutorials
❤❤❤
How the let and const will work in execution context? Sir
That answer you will get in the scope video.
@@tapascript-bangla ok sir
স্যার , আপনার কাছে python programming শিখতে চাই ,
Dada promise nia ekta video chai
Asbe... JavaScript er series ta khub e deep hobe.
Sir LARAVEL tutorial cie
Javascript niye bhoy petam but ajker por theke ar noy 😂😂😂 Ebhabe explain korle se je keu hok na keno bujhte parbe ❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤
❤❤❤