Skip to content

Commit c4bdc9d

Browse files
committed
arrow
1 parent b91261d commit c4bdc9d

1 file changed

Lines changed: 37 additions & 37 deletions

File tree

  • 1-js/06-advanced-functions/12-arrow-functions
Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
1-
# Arrow functions revisited
1+
# Funciones de flecha revisadas
22

3-
Let's revisit arrow functions.
3+
Volvamos a revisar las funciones de flecha.
44

5-
Arrow functions are not just a "shorthand" for writing small stuff.
5+
Las funciones de flecha no son solo una "taquigrafía" para escribir pequeñas cosas. Tienen algunas características muy específicas y útiles.
66

7-
JavaScript is full of situations where we need to write a small function, that's executed somewhere else.
7+
JavaScript está lleno de situaciones en las que necesitamos escribir una pequeña función que se ejecuta en otro lugar.
88

9-
For instance:
9+
Por ejemplo
1010

11-
- `arr.forEach(func)` -- `func` is executed by `forEach` for every array item.
12-
- `setTimeout(func)` -- `func` is executed by the built-in scheduler.
13-
- ...there are more.
11+
- `arr.forEach(func)` -- `func` es ejecutado por `forEach` para cada elemento del array.
12+
- `setTimeout(func)` -- `func` es ejecutado por el planificador incorporado.
13+
- ...y muchas más.
1414

15-
It's in the very spirit of JavaScript to create a function and pass it somewhere.
15+
Está en el espíritu de JavaScript crear una función y pasarla a algún otro lugar.
1616

17-
And in such functions we usually don't want to leave the current context.
17+
Y en tales funciones, por lo general, no queremos abandonar el contexto actual. Ahí es donde las funciones de flecha son útiles.
1818

19-
## Arrow functions have no "this"
19+
## Las funciones de flecha no tienen "this"
2020

21-
As we remember from the chapter <info:object-methods>, arrow functions do not have `this`. If `this` is accessed, it is taken from the outside.
21+
Como recordamos del capítulo <info:object-methods>, las funciones de flecha no tienen `this`. Si se accede a `this`, se toma el contexto del exterior.
2222

23-
For instance, we can use it to iterate inside an object method:
23+
Por ejemplo, podemos usarlo para iterar dentro de un método de objeto:
2424

2525
```js run
2626
let group = {
@@ -39,9 +39,9 @@ let group = {
3939
group.showList();
4040
```
4141

42-
Here in `forEach`, the arrow function is used, so `this.title` in it is exactly the same as in the outer method `showList`. That is: `group.title`.
42+
Aquí en `forEach`, se utiliza la función de flecha, por lo que `this.title` es exactamente igual que en el método externo `showList`. Es decir: `group.title`.
4343

44-
If we used a "regular" function, there would be an error:
44+
Si usáramos una función "regular", habría un error:
4545

4646
```js run
4747
let group = {
@@ -61,28 +61,28 @@ let group = {
6161
group.showList();
6262
```
6363

64-
The error occurs because `forEach` runs functions with `this=undefined` by default, so the attempt to access `undefined.title` is made.
64+
El error se produce porque `forEach` ejecuta funciones con `this = undefined` de forma predeterminada, por lo que se intenta acceder a `undefined.title`.
6565

66-
That doesn't affect arrow functions, because they just don't have `this`.
66+
Eso no afecta las funciones de flecha, porque simplemente no tienen `this`.
6767

68-
```warn header="Arrow functions can't run with `new`"
69-
Not having `this` naturally means another limitation: arrow functions can't be used as constructors. They can't be called with `new`.
68+
```warn header="Las funciones de flecha no pueden ejecutarse con `new`"
69+
No tener `this` naturalmente significa otra limitación: las funciones de flecha no pueden usarse como constructores. No se pueden llamar con `new`.
7070
```
7171
72-
```smart header="Arrow functions VS bind"
73-
There's a subtle difference between an arrow function `=>` and a regular function called with `.bind(this)`:
72+
```smart header="Funciones de flecha VS bind"
73+
Hay una sutil diferencia entre una función de flecha `=>` y una función regular llamada con `.bind(this)`:
7474
75-
- `.bind(this)` creates a "bound version" of the function.
76-
- The arrow `=>` doesn't create any binding. The function simply doesn't have `this`. The lookup of `this` is made exactly the same way as a regular variable search: in the outer lexical environment.
75+
- `.bind(this)` crea una "versión enlazada" de la función.
76+
- La flecha `=>` no crea ningún enlace. La función simplemente no tiene `this`. La búsqueda de 'this' se realiza exactamente de la misma manera que una búsqueda de variable regular: en el entorno léxico externo.
7777
```
7878

79-
## Arrows have no "arguments"
79+
## Las flechas no tienen "argumentos"
8080

81-
Arrow functions also have no `arguments` variable.
81+
Las funciones de flecha tampoco tienen variable `argumentos`.
8282

83-
That's great for decorators, when we need to forward a call with the current `this` and `arguments`.
83+
Eso es genial para los decoradores, cuando necesitamos reenviar una llamada con el actual `this` y `argumentos`.
8484

85-
For instance, `defer(f, ms)` gets a function and returns a wrapper around it that delays the call by `ms` milliseconds:
85+
Por ejemplo, `defer (f, ms)` obtiene una función y devuelve un contenedor que retrasa la llamada en `ms` milisegundos:
8686

8787
```js run
8888
function defer(f, ms) {
@@ -96,10 +96,10 @@ function sayHi(who) {
9696
}
9797

9898
let sayHiDeferred = defer(sayHi, 2000);
99-
sayHiDeferred("John"); // Hello, John after 2 seconds
99+
sayHiDeferred("John"); // Hello, John después de 2 segundos
100100
```
101101

102-
The same without an arrow function would look like:
102+
Lo mismo sin una función de flecha se vería así:
103103

104104
```js
105105
function defer(f, ms) {
@@ -112,15 +112,15 @@ function defer(f, ms) {
112112
}
113113
```
114114

115-
Here we had to create additional variables `args` and `ctx` so that the function inside `setTimeout` could take them.
115+
Aquí tuvimos que crear variables adicionales `args` y `ctx` para que la función dentro de `setTimeout` pudiera tomarlas.
116116

117-
## Summary
117+
## Resumen
118118

119-
Arrow functions:
119+
Funciones de flecha:
120120

121-
- Do not have `this`.
122-
- Do not have `arguments`.
123-
- Can't be called with `new`.
124-
- (They also don't have `super`, but we didn't study it. Will be in the chapter <info:class-inheritance>).
121+
- No tienen `this`
122+
- No tienen argumentos
123+
- No se pueden llamar con `new`
124+
- Tampoco tienen `super`, que aún no hemos estudiado. Lo veremos en el capítulo <info:class-inheritance>
125125

126-
That's because they are meant for short pieces of code that do not have their own "context", but rather works in the current one. And they really shine in that use case.
126+
Esto se debe a que están diseñadas para piezas cortas de código que no tienen su propio "contexto", sino que funcionan en el actual. Y realmente brillan en ese caso de uso.

0 commit comments

Comments
 (0)