Skip to content

Commit d85a4da

Browse files
committed
Termino traducción seccion "JavaScript Behind Scenes".
Termino la traducción.
1 parent 651a110 commit d85a4da

File tree

7 files changed

+334
-332
lines changed

7 files changed

+334
-332
lines changed

es/behind-scenes/README.md

Lines changed: 19 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -2,46 +2,37 @@
22
layout: editorial
33
chapter: 27
44
pageNumber: 256
5-
description: JavaScript behind the scenes.
5+
description: JavaScript detrás de escena.
66
---
77

8-
## JavaScript Behind the Scenes
8+
# Capítulo 27
99

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 detrás de escena
1311

14-
### JavaScript Engine
12+
JavaScript es un lenguaje versátil que se ejecuta en varios entornos, incluidos navegadores y servidores. Comprender cómo funciona JavaScript en segundo plano puede ayudarlo a escribir código más eficiente y eficaz. Esta guía cubre conceptos clave como el motor de JavaScript, el contexto de ejecución, la pila de llamadas, el montón de memoria, el entorno de ejecución y el bucle de eventos.
1513

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+
### Motor de JavaScript
1915

20-
### Execution Context
16+
Un motor de JavaScript es un programa o intérprete que ejecuta código JavaScript. Los motores populares como V8 (usado en Google Chrome y Node.js), SpiderMonkey (usado en Firefox) y JavaScriptCore (usado en Safari) analizan el código en un árbol de sintaxis abstracta (AST), lo compilan en código de bytes o código de máquina y luego lo ejecutan.
2117

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.
18+
### Contexto de ejecución
2519

26-
### Call Stack
20+
Un contexto de ejecución es un entorno en el que se evalúa y ejecuta el código JavaScript. Hay tres tipos: global,
21+
función y evaluación. Cada contexto tiene una fase de creación, donde se crean las variables, las funciones y la palabra clave `this`, y una fase de ejecución, donde se ejecuta el código línea por línea.
2722

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.
23+
### Pila de llamadas
3124

32-
### Memory Heap
25+
La pila de llamadas es una estructura de datos que realiza un seguimiento de las llamadas a funciones en el modo LIFO (último en entrar, primero en salir). Ayuda al motor de JavaScript a gestionar la ejecución de múltiples funciones al enviar y recibir llamadas a funciones a medida que se invocan y se completan.
3326

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.
27+
### Montón de memoria
3628

37-
### Runtime Environment
29+
El montón de memoria es una región de la memoria donde se almacenan los objetos. JavaScript utiliza la recolección de elementos no utilizados para administrar la memoria, liberando automáticamente la memoria que ya no se utiliza, lo que evita fugas de memoria y optimiza el rendimiento.
3830

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.
31+
### Entorno de ejecución
4232

43-
### Event Loop
33+
El entorno de ejecución proporciona los recursos necesarios para que JavaScript se ejecute. En un navegador, esto incluye el
34+
modelo de objetos de documento (DOM), las API web y el motor de JavaScript. En Node.js, incluye el sistema de archivos, el módulo HTTP y otras API específicas de Node.js.
4435

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.
36+
### Bucle de eventos
37+
38+
El bucle de eventos permite que JavaScript realice operaciones sin bloqueos al transferir tareas al núcleo del sistema siempre que sea posible. Verifica continuamente la pila de llamadas y procesa la cola de devolución de llamadas, lo que permite la programación asincrónica y la ejecución eficiente del código.

es/behind-scenes/call-stack.md

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,75 +1,75 @@
11
---
22
chapter: 27
33
pageNumber: 257
4-
description: Understanding Call Stacks in JavaScript
4+
description: Comprensión de las pilas de llamadas en JavaScript
55
---
66

77

8-
## Understanding Call Stacks in JavaScript
8+
# Comprensión de las pilas de llamadas en JavaScript
99

10-
In JavaScript, a Call Stack is a data structure that uses the Last-In, First-Out (LIFO) principle to temporarily store and manage function invocation (call).
10+
En JavaScript, una pila de llamadas es una estructura de datos que utiliza el principio de último en entrar, primero en salir (LIFO) para almacenar y administrar temporalmente la invocación de una función (llamada).
1111

12-
### What is a Call Stack?
12+
## ¿Qué es una pila de llamadas?
1313

14-
A call stack is responsible for keeping track of function calls in your code. The call stack helps the JavaScript interpreter to keep track of what function is currently being run and what functions are called from within that function, and so on.
14+
Una pila de llamadas es responsable de realizar un seguimiento de las llamadas a funciones en su código. La pila de llamadas ayuda al intérprete de JavaScript a realizar un seguimiento de qué función se está ejecutando actualmente y qué funciones se invocan desde dentro de esa función, etc.
1515

16-
When a script calls a function, JavaScript's interpreter adds that function to the call stack and then starts carrying out the function. Any functions that are called by that function are added to the call stack further up, and run where their calls are reached.
16+
Cuando un script llama a una función, el intérprete de JavaScript agrega esa función a la pila de llamadas y luego comienza a ejecutarla. Todas las funciones que son llamadas por esa función se agregan a la pila de llamadas más arriba y se ejecutan donde se alcanzan sus llamadas.
1717

18-
When the current function is finished, the interpreter takes it off the stack and resumes execution where it left off in the last line of code that was run.
18+
Cuando finaliza la función actual, el intérprete la saca de la pila y reanuda la ejecución donde la dejó en la última línea de código que se ejecutó.
1919

20-
### Example of a Call Stack
20+
### Ejemplo de una pila de llamadas
2121

22-
Here's a basic example to understand how a call stack works:
22+
A continuación se muestra un ejemplo básico para comprender cómo funciona una pila de llamadas:
2323

2424
```javascript
25-
function firstFunction() {
26-
console.log("First function is called.");
27-
secondFunction();
28-
console.log("First function is done.");
25+
function primeraFuncion() {
26+
console.log("Se llama la primera función.");
27+
segundaFuncion();
28+
console.log("La primera función está realizada.");
2929
}
3030

31-
function secondFunction() {
32-
console.log("Second function is called.");
33-
thirdFunction();
34-
console.log("Second function is done.");
31+
function segundaFuncion() {
32+
console.log("Se llama la segunda función.");
33+
terceraFuncion();
34+
console.log("La segunda función está realizada.");
3535
}
3636

37-
function thirdFunction() {
38-
console.log("Third function is called.");
37+
function terceraFuncion() {
38+
console.log("Se llama la tercera función.");
3939
}
4040

41-
firstFunction();
41+
primeraFuncion();
4242
```
4343

4444
**Output:**
45-
```
46-
First function is called.
47-
Second function is called.
48-
Third function is called.
49-
Second function is done.
50-
First function is done.
45+
46+
```text
47+
Se llama la primera función.
48+
Se llama la segunda función.
49+
Se llama la tercera función.
50+
La segunda función está realizada.
51+
La primera función está realizada.
5152
```
5253

53-
### How the Call Stack Works
54+
## Cómo funciona la pila de llamadas
5455

55-
1. When `firstFunction` is called, it is added to the call stack.
56-
2. Inside `firstFunction`, `secondFunction` is called, so it is added to the call stack.
57-
3. Inside `secondFunction`, `thirdFunction` is called, so it is added to the call stack.
58-
4. `thirdFunction` completes and is removed from the call stack.
59-
5. `secondFunction` resumes, completes, and is removed from the call stack.
60-
6. `firstFunction` resumes, completes, and is removed from the call stack.
56+
1. Cuando se llama a `primeraFuncion`, se agrega a la pila de llamadas.
57+
2. Dentro de `primeraFuncion`, se llama a `segundaFuncion`, por lo que se agrega a la pila de llamadas.
58+
3. Dentro de `segundaFuncion`, se llama a `terceraFuncion`, por lo que se agrega a la pila de llamadas.
59+
4. `terceraFuncion` se completa y se elimina de la pila de llamadas.
60+
5. `segundaFuncion` se reanuda, se completa y se elimina de la pila de llamadas.
61+
6. `primeraFuncion` se reanuda, se completa y se elimina de la pila de llamadas.
6162

62-
### Stack Overflow
63+
## Desbordamiento de pila
6364

64-
A stack overflow occurs when there are too many function calls in the call stack. This can happen with recursive functions that do not have a base case to stop the recursion.
65+
Un desbordamiento de pila ocurre cuando hay demasiadas llamadas de función en la pila de llamadas. Esto puede suceder con funciones recursivas que no tienen un caso base para detener la recursión.
6566

6667
```javascript
67-
function recursiveFunction() {
68-
recursiveFunction();
68+
function funcionRecursiva() {
69+
funcionRecursiva();
6970
}
7071

71-
recursiveFunction();
72+
funcionRecursiva();
7273
```
7374

74-
This will result in a "Maximum call stack size exceeded" error.
75-
75+
Esto generará un error "Se excedió el tamaño máximo de la pila de llamadas" (En la consola aparecerá el error en inglés: "RangeError: Maximum call stack size exceeded").

es/behind-scenes/engine.md

Lines changed: 51 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,92 +1,93 @@
11
---
22
chapter: 27
33
pageNumber: 258
4-
description: Understanding JavaScript Engines and how they execute JavaScript code.
4+
description: Comprender los motores de JavaScript y cómo ejecutan el código JavaScript.
55
---
66

7-
## Understanding JavaScript Engines
7+
# Comprender los motores de JavaScript y cómo ejecutan el código JavaScript
88

9-
A JavaScript engine is a program or an interpreter that executes JavaScript code. The most well-known JavaScript engines are V8 (used in Google Chrome and Node.js), SpiderMonkey (used in Firefox), and JavaScriptCore (used in Safari).
9+
Un motor de JavaScript es un programa o intérprete que ejecuta código JavaScript. Los motores de JavaScript más conocidos son V8 (utilizado en Google Chrome y Node.js), SpiderMonkey (utilizado en Firefox) y JavaScriptCore (utilizado en Safari).
1010

11-
### How JavaScript Engines Work
11+
## Cómo funcionan los motores de JavaScript
1212

13-
JavaScript engines perform several key tasks to execute JavaScript code efficiently:
13+
Los motores de JavaScript realizan varias tareas clave para ejecutar el código JavaScript de manera eficiente:
1414

15-
1. **Parsing**: The engine parses the JavaScript code into an Abstract Syntax Tree (AST).
16-
2. **Compilation**: The AST is then compiled into bytecode or machine code.
17-
3. **Execution**: The compiled code is executed by the engine.
15+
1. **Análisis**: El motor analiza el código JavaScript en un árbol de sintaxis abstracta (AST).
16+
2. **Compilación**: Luego, el AST se compila en código de bytes o código de máquina.
17+
3. **Ejecución**: El código compilado es ejecutado por el motor.
1818

19-
### Example of JavaScript Engine Workflow
19+
### Ejemplo de flujo de trabajo del motor JavaScript
2020

21-
Here's a simple example to illustrate the workflow of a JavaScript engine:
21+
A continuación se muestra un ejemplo sencillo para ilustrar el flujo de trabajo de un motor de JavaScript:
2222

23-
```javascript
24-
function add(a, b) {
23+
````javascript
24+
function agrega(a, b) {
2525
return a + b;
2626
}
2727

28-
console.log(add(2, 3)); // Output: 5
29-
```
30-
31-
### Parsing
32-
33-
The engine first parses the code into an AST. For the above code, the AST might look something like this:
34-
35-
```
36-
Program
37-
├── FunctionDeclaration (add)
38-
│ ├── Identifier (a)
39-
│ ├── Identifier (b)
40-
│ └── BlockStatement
41-
│ └── ReturnStatement
42-
│ └── BinaryExpression (+)
43-
│ ├── Identifier (a)
44-
│ └── Identifier (b)
45-
└── ExpressionStatement
46-
└── CallExpression (console.log)
47-
└── CallExpression (add)
28+
console.log(agrega(2, 3)); // Salida: 5
29+
````
30+
31+
### Análisis
32+
33+
El motor primero analiza el código y lo convierte en un AST. Para el código anterior, el AST podría verse así:
34+
35+
```text
36+
Programacion
37+
├── DeclaracionFuncion (agrega)
38+
│ ├── Identificador (a)
39+
│ ├── Identificador (b)
40+
│ └── SentenciaDeBloque
41+
│ └── SentenciaReturn
42+
│ └── ExpresionBinaria (+)
43+
│ ├── Identificador (a)
44+
│ └── Identificador (b)
45+
└── SentenciaExpresion
46+
└── LlamadaExpresion (console.log)
47+
└── LlamadaExpresion (agrega)
4848
├── Literal (2)
4949
└── Literal (3)
5050
```
5151

52-
### Compilation
52+
### Compilación
5353

54-
The AST is then compiled into bytecode or machine code. This step involves optimizations to improve performance.
54+
Luego, el AST se compila en código de bytes o código de máquina. Este paso implica optimizaciones para mejorar el rendimiento.
5555

56-
### Execution
56+
### Ejecución
5757

58-
The compiled code is executed by the engine. In this case, the `add` function is called with arguments `2` and `3`, and the result `5` is logged to the console.
58+
El motor ejecuta el código compilado. En este caso, se llama a la función `add` con los argumentos `2` y `3`, y el resultado `5` se registra en la consola.
5959

60-
### Just-In-Time (JIT) Compilation
60+
### Compilación Just-In-Time (JIT)
6161

62-
Modern JavaScript engines use Just-In-Time (JIT) compilation to improve performance. JIT compilation involves compiling code at runtime, rather than before execution. This allows the engine to optimize the code based on actual usage patterns.
62+
Los motores de JavaScript modernos utilizan la compilación Just-In-Time (JIT) para mejorar el rendimiento. La compilación JIT implica compilar el código en tiempo de ejecución, en lugar de antes de la ejecución. Esto permite que el motor optimice el código en función de los patrones de uso reales.
6363

64-
### Example of JIT Compilation
64+
### Ejemplo de compilación JIT
6565

6666
```javascript
67-
function multiply(a, b) {
67+
function multiplica(a, b) {
6868
return a * b;
6969
}
7070

7171
for (let i = 0; i < 1000000; i++) {
72-
multiply(2, 3);
72+
multiplica(2, 3);
7373
}
7474
```
7575

76-
In this example, the `multiply` function is called repeatedly. A JIT compiler can optimize the function after detecting that it is a hot function (i.e., frequently called).
76+
En este ejemplo, la función `multiplica` se llama repetidamente. Un compilador JIT puede optimizar la función después de detectar que es una función activa (es decir, que se llama con frecuencia).
7777

78-
### Garbage Collection
78+
### Recolección de basura
7979

80-
JavaScript engines also include garbage collectors to manage memory. The garbage collector automatically frees up memory that is no longer in use, preventing memory leaks.
80+
Los motores de JavaScript también incluyen recolectores de basura para administrar la memoria. El recolector de basura libera automáticamente la memoria que ya no se utiliza, lo que evita fugas de memoria.
8181

82-
### Example of Garbage Collection
82+
### Ejemplo de Recolección de Basura
8383

8484
```javascript
85-
function createObject() {
86-
return { name: "Object" };
85+
function creaObjeto() {
86+
return { nombre: "Objeto" };
8787
}
8888

89-
let obj = createObject();
90-
obj = null; // The object is now eligible for garbage collection
89+
let obj = creaObjeto();
90+
obj = null; // El objeto ahora es elegible para la recolección de basura.
9191
```
92-
In this example, the object created by `createObject` is eligible for garbage collection after `obj` is set to `null`.
92+
93+
En este ejemplo, el objeto creado por `creaObjeto` es elegible para la recolección de basura después de que `obj` se establece en `null`.

0 commit comments

Comments
 (0)