|
1 | 1 | ---
|
2 | 2 | layout: editorial
|
3 |
| -chapter: 27 |
4 |
| -pageNumber: 256 |
5 |
| -description: JavaScript behind the scenes. |
| 3 | +chapter: 28 |
| 4 | +pageNumber: 260 |
| 5 | +description: JavaScript is a versatile language used in both browsers and servers. This guide explains key concepts like the JavaScript engine, execution context, call stack, memory heap, runtime environment, and event loop to help you write more efficient code. |
6 | 6 | ---
|
7 | 7 |
|
8 |
| -## JavaScript Behind the Scenes |
| 8 | +# Chapter 28 |
9 | 9 |
|
10 |
| -JavaScript is a versatile language that runs in various environments, including browsers and servers. Understanding how |
11 |
| -JavaScript works behind the scenes can help you write more efficient and effective code. This guide covers key concepts |
12 |
| -such as the JavaScript engine, execution context, call stack, memory heap, runtime environment, and event loop. |
| 10 | +# JavaScript Behind the Scenes |
13 | 11 |
|
14 |
| -### JavaScript Engine |
| 12 | +JavaScript is a versatile language that powers both browsers and servers. To write efficient code, it helps to understand how JavaScript works behind the scenes. At its core is the JavaScript engine, a program responsible for executing your code. Popular engines like V8 (used in Chrome and Node.js), SpiderMonkey (in Firefox), and JavaScriptCore (in Safari) break down your code and run it. Alongside this, the execution context defines the environment in which your code is evaluated. Whether it's global, function, or eval, each context goes through a setup phase (creating variables, functions, and this) before executing the code line by line. |
15 | 13 |
|
16 |
| -A JavaScript engine is a program or interpreter that executes JavaScript code. Popular engines like V8 (used in Google |
17 |
| -Chrome and Node.js), SpiderMonkey (used in Firefox), and JavaScriptCore (used in Safari) parse the code into an Abstract |
18 |
| -Syntax Tree (AST), compile it into bytecode or machine code, and then execute it. |
| 14 | +Key components like the call stack and memory heap further support JavaScript's execution. The call stack manages function calls in a Last-In, First-Out order, while the memory heap stores objects, with JavaScript automatically freeing up memory through garbage collection. The runtime environment—whether in the browser or Node.js—provides additional resources, such as the DOM or Node.js-specific modules. Finally, the event loop plays a crucial role in enabling asynchronous programming by offloading tasks and processing callbacks, ensuring JavaScript remains non-blocking and efficient. |
19 | 15 |
|
20 |
| -### Execution Context |
21 | 16 |
|
22 |
| -An execution context is an environment where JavaScript code is evaluated and executed. There are three types: global, |
23 |
| -function, and eval. Each context has a creation phase, where variables, functions, and the `this` keyword are created, |
24 |
| -and an execution phase, where the code is executed line by line. |
| 17 | +In this chapter we are going to talk about following topics. |
25 | 18 |
|
26 |
| -### Call Stack |
27 |
| - |
28 |
| -The call stack is a data structure that keeps track of function calls in a Last-In, First-Out (LIFO) manner. It helps |
29 |
| -the JavaScript engine manage the execution of multiple functions by pushing and popping function calls as they are |
30 |
| -invoked and completed. |
31 |
| - |
32 |
| -### Memory Heap |
33 |
| - |
34 |
| -The memory heap is a region in memory where objects are stored. JavaScript uses garbage collection to manage memory, |
35 |
| -automatically freeing up memory that is no longer in use, thus preventing memory leaks and optimizing performance. |
36 |
| - |
37 |
| -### Runtime Environment |
38 |
| - |
39 |
| -The runtime environment provides the necessary resources for JavaScript to execute. In a browser, this includes the |
40 |
| -Document Object Model (DOM), Web APIs, and the JavaScript engine. In Node.js, it includes the file system, HTTP module, |
41 |
| -and other Node.js-specific APIs. |
42 |
| - |
43 |
| -### Event Loop |
44 |
| - |
45 |
| -The event loop allows JavaScript to perform non-blocking operations by offloading tasks to the system kernel whenever |
46 |
| -possible. It continuously checks the call stack and processes the callback queue, enabling asynchronous programming and |
47 |
| -efficient execution of code. |
| 19 | +* [Call Stack](./call-stack.md) |
| 20 | +* [Event Loop](./runtime-environment.md) |
| 21 | +* [Execution Context](./execution-context.md) |
| 22 | +* [JavaScript Engine](./engine.md) |
| 23 | +* [Memory Heap](./memory-heap.md) |
| 24 | +* [Runtime Environment](./runtime-environment.md) |
0 commit comments