◐ Shell
reader mode source ↗
Skip to content
Merged
Hide file tree
Changes from all commits
File filter
Conversations
Jump to
Diff view
Apply and reload
Show whitespace
Diff view
Apply and reload
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
The answer: `null`.


```js run
Expand All @@ -13,6 +13,6 @@ let user = {
user.g();
```

The context of a bound function is hard-fixed. There's just no way to further change it.

So even while we run `user.g()`, the original function is called with `this=null`.
6 changes: 3 additions & 3 deletions 1-js/06-advanced-functions/10-bind/3-second-bind/solution.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
The answer: **John**.

```js run no-beautify
function f() {
Expand All @@ -10,6 +10,6 @@ f = f.bind( {name: "John"} ).bind( {name: "Pete"} );
f(); // John
```

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.

A function cannot be re-bound.
6 changes: 3 additions & 3 deletions 1-js/06-advanced-functions/10-bind/3-second-bind/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ importance: 5

---

# Second bind

Can we change `this` by additional binding?

What will be the output?

```js no-beautify
function f() {
Expand Down
Original file line number Diff line number Diff line change
@@ -2,9 +2,9 @@ importance: 5

---

# Function property after bind

There's a value in the property of a function. Will it change after `bind`? Why, or why not?

```js run
function sayHi() {
Expand All @@ -17,7 +17,7 @@ let bound = sayHi.bind({
name: "John"
});

alert( bound.test ); // what will be the output? why?
*/!*
```

20 changes: 10 additions & 10 deletions 1-js/06-advanced-functions/10-bind/5-question-use-bind/solution.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@

The error occurs because `ask` gets functions `loginOk/loginFail` without the object.

When it calls them, they naturally assume `this=undefined`.

Let's `bind` the context:

```js run
function askPassword(ok, fail) {
let password = prompt("Password?", '');
if (password == "rockstar") ok();
else fail();
}
Expand All @@ -16,11 +16,11 @@ let user = {
name: 'John',

loginOk() {
alert(`${this.name} logged in`);
},

loginFail() {
alert(`${this.name} failed to log in`);
},

};
Expand All @@ -30,14 +30,14 @@ askPassword(user.loginOk.bind(user), user.loginFail.bind(user));
*/!*
```

Now it works.

An alternative solution could be:
```js
//...
askPassword(() => user.loginOk(), () => user.loginFail());
```

Usually that also works and looks good.

It's a bit less reliable though in more complex situations where `user` variable might change *after* `askPassword` is called, but *before* the visitor answers and calls `() => user.loginOk()`.
14 changes: 7 additions & 7 deletions 1-js/06-advanced-functions/10-bind/5-question-use-bind/task.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,17 @@ importance: 5

---

# Fix a function that loses "this"

The call to `askPassword()` in the code below should check the password and then call `user.loginOk/loginFail` depending on the answer.

But it leads to an error. Why?

Fix the highlighted line for everything to start working right (other lines are not to be changed).

```js run
function askPassword(ok, fail) {
let password = prompt("Password?", '');
if (password == "rockstar") ok();
else fail();
}
Expand All @@ -21,11 +21,11 @@ let user = {
name: 'John',

loginOk() {
alert(`${this.name} logged in`);
},

loginFail() {
alert(`${this.name} failed to log in`);
},

};
Expand Down
Loading
Toggle all file notes Toggle all file annotations