Skip to content

Commit 70d8d94

Browse files
committed
bind
1 parent 4ad4b7f commit 70d8d94

11 files changed

Lines changed: 245 additions & 71 deletions

File tree

1-js/06-advanced-functions/10-bind/2-write-to-object-after-bind/solution.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
The answer: `null`.
1+
Respuesta: `null`.
22

33

44
```js run
@@ -13,6 +13,6 @@ let user = {
1313
user.g();
1414
```
1515

16-
The context of a bound function is hard-fixed. There's just no way to further change it.
16+
El contexto de una función enlazada es fijo. Simplemente no hay forma de cambiarlo más.
1717

18-
So even while we run `user.g()`, the original function is called with `this=null`.
18+
Entonces, incluso mientras ejecutamos `user.g()`, la función original se llama con `this = null`.

1-js/06-advanced-functions/10-bind/2-write-to-object-after-bind/task.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ importance: 5
22

33
---
44

5-
# Bound function as a method
5+
# Función enlazada como método
66

7-
What will be the output?
7+
¿Cuál será el resultado?
88

99
```js
1010
function f() {

1-js/06-advanced-functions/10-bind/3-second-bind/solution.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
The answer: **John**.
1+
Respuesta: **John**.
22

33
```js run no-beautify
44
function f() {
@@ -10,6 +10,6 @@ f = f.bind( {name: "John"} ).bind( {name: "Pete"} );
1010
f(); // John
1111
```
1212

13-
The exotic [bound function](https://tc39.github.io/ecma262/#sec-bound-function-exotic-objects) object returned by `f.bind(...)` remembers the context (and arguments if provided) only at creation time.
13+
El objeto exótico [bound function](https://tc39.github.io/ecma262/#sec-bound-function-exotic-objects) devuelto por `f.bind(...)` recuerda el contexto (y los argumentos si se proporcionan) solo en el momento de la creación.
1414

15-
A function cannot be re-bound.
15+
Una función no se puede volver a vincular.

1-js/06-advanced-functions/10-bind/3-second-bind/task.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@ importance: 5
22

33
---
44

5-
# Second bind
5+
# Segundo enlace
66

7-
Can we change `this` by additional binding?
7+
¿Podemos cambiar `this` por un enlace adicional?
88

9-
What will be the output?
9+
¿Cuál será el resultado?
1010

1111
```js no-beautify
1212
function f() {
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
The answer: `undefined`.
1+
Respuesta: `undefined`.
22

3-
The result of `bind` is another object. It does not have the `test` property.
3+
El resultado de `bind` es otro objeto. No tiene la propiedad `test`.
44

1-js/06-advanced-functions/10-bind/4-function-property-after-bind/task.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ importance: 5
22

33
---
44

5-
# Function property after bind
5+
# Propiedad de función después del enlace
66

7-
There's a value in the property of a function. Will it change after `bind`? Why, elaborate?
7+
Hay un valor en la propiedad de una función. ¿Cambiará después de `bind`? ¿Por qué sí o por qué no?
88

99
```js run
1010
function sayHi() {
@@ -17,7 +17,7 @@ let bound = sayHi.bind({
1717
name: "John"
1818
});
1919

20-
alert( bound.test ); // what will be the output? why?
20+
alert( bound.test ); // ¿Cuál será la salida? ¿por qué?
2121
*/!*
2222
```
2323

1-js/06-advanced-functions/10-bind/5-question-use-bind/solution.md

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11

2-
The error occurs because `ask` gets functions `loginOk/loginFail` without the object.
2+
El error se produce porque `ask` obtiene las funciones `loginOk/loginFail` sin el objeto.
33

4-
When it calls them, they naturally assume `this=undefined`.
4+
Cuando los llama, asumen naturalmente `this = undefined`.
55

6-
Let's `bind` the context:
6+
Vamos a usar `bind` para enlazar el contexto:
77

88
```js run
99
function askPassword(ok, fail) {
@@ -30,14 +30,15 @@ askPassword(user.loginOk.bind(user), user.loginFail.bind(user));
3030
*/!*
3131
```
3232

33-
Now it works.
33+
Ahora funciona.
3434

35-
An alternative solution could be:
35+
Una solución alternativa podría ser:
3636
```js
3737
//...
3838
askPassword(() => user.loginOk(), () => user.loginFail());
3939
```
4040

41-
Usually that also works, but may fail in more complex situations where `user` has a chance of being overwritten between the moments of asking and running `() => user.loginOk()`.
41+
Por lo general, eso también funciona y se ve bien.
4242

43+
Es un poco menos confiable, aunque en situaciones más complejas donde la variable `user` podría cambiar *después* de que se llama a `askPassword`, pero *antes* el visitante responde y llama a `() => user.loginOk ()`.
4344

1-js/06-advanced-functions/10-bind/5-question-use-bind/task.md

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@ importance: 5
22

33
---
44

5-
# Ask losing this
5+
# Arreglar una función que perdió "this"
66

7-
The call to `askPassword()` in the code below should check the password and then call `user.loginOk/loginFail` depending on the answer.
7+
La llamada a `askPassword()` en el código a continuación debe verificar la contraseña y luego llamar a `user.loginOk/loginFail` dependiendo de la respuesta.
88

9-
But it leads to an error. Why?
9+
Pero lleva a un error. ¿Por qué?
1010

11-
Fix the highlighted line for everything to start working right (other lines are not to be changed).
11+
Arregle la línea resaltada para que todo comience a funcionar correctamente (no se deben cambiar otras líneas).
1212

1313
```js run
1414
function askPassword(ok, fail) {
@@ -34,5 +34,3 @@ let user = {
3434
askPassword(user.loginOk, user.loginFail);
3535
*/!*
3636
```
37-
38-
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
2+
3+
1. Utilice una función de contenedor, una flecha para ser conciso:
4+
5+
```js
6+
askPassword(() => user.login(true), () => user.login(false));
7+
```
8+
9+
Ahora obtiene `user` de variables externas y lo ejecuta de la manera normal.
10+
11+
2. O cree una función parcial desde `user.login` que use `user` como contexto y tenga el primer argumento correcto:
12+
13+
14+
```js
15+
askPassword(user.login.bind(user, true), user.login.bind(user, false));
16+
```
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
importance: 5
2+
3+
---
4+
5+
# Aplicación parcial para inicio de sesión
6+
7+
La tarea es una variante un poco más compleja de <info:task/question-use-bind>.
8+
9+
El objeto `user` fue modificado. Ahora, en lugar de dos funciones `loginOk/loginFail`, tiene una sola función `user.login(true/false) `.
10+
11+
¿Qué deberíamos pasar a `askPassword` en el código a continuación, para que llame a `user.login(true)` como `ok` y `user.login(false)` como `fail`?
12+
13+
```js
14+
function askPassword(ok, fail) {
15+
let password = prompt("Password?", '');
16+
if (password == "rockstar") ok();
17+
else fail();
18+
}
19+
20+
let user = {
21+
name: 'John',
22+
23+
login(result) {
24+
alert( this.name + (result ? ' logged in' : ' failed to log in') );
25+
}
26+
};
27+
28+
*!*
29+
askPassword(?, ?); // ?
30+
*/!*
31+
```
32+
33+
Sus cambios solo deberían modificar el fragmento resaltado.
34+

0 commit comments

Comments
 (0)