Merge branch 'master' into patch-18
This commit is contained in:
commit
29ea8907d1
17 changed files with 42 additions and 43 deletions
|
@ -4,7 +4,7 @@ importance: 3
|
|||
|
||||
# Explain the value of "this"
|
||||
|
||||
In the code below we intend to call `user.go()` method 4 times in a row.
|
||||
In the code below we intend to call `obj.go()` method 4 times in a row.
|
||||
|
||||
But calls `(1)` and `(2)` works differently from `(3)` and `(4)`. Why?
|
||||
|
||||
|
|
|
@ -288,7 +288,7 @@ For server-side JavaScript, that limitation does not exist, and there exist othe
|
|||
|
||||
- Methods `setTimeout(func, delay, ...args)` and `setInterval(func, delay, ...args)` allow us to run the `func` once/regularly after `delay` milliseconds.
|
||||
- To cancel the execution, we should call `clearTimeout/clearInterval` with the value returned by `setTimeout/setInterval`.
|
||||
- Nested `setTimeout` calls is a more flexible alternative to `setInterval`, allowing us to set the time *between* executions more precisely.
|
||||
- Nested `setTimeout` calls are a more flexible alternative to `setInterval`, allowing us to set the time *between* executions more precisely.
|
||||
- Zero delay scheduling with `setTimeout(func, 0)` (the same as `setTimeout(func)`) is used to schedule the call "as soon as possible, but after the current script is complete".
|
||||
- The browser limits the minimal delay for five or more nested call of `setTimeout` or for `setInterval` (after 5th call) to 4ms. That's for historical reasons.
|
||||
|
||||
|
@ -299,4 +299,4 @@ For example, the in-browser timer may slow down for a lot of reasons:
|
|||
- The browser tab is in the background mode.
|
||||
- The laptop is on battery.
|
||||
|
||||
All that may increase the minimal timer resolution (the minimal delay) to 300ms or even 1000ms depending on the browser and OS-level performance settings.
|
||||
All that may increase the minimal timer resolution (the minimal delay) by 300ms or even 1000ms depending on the browser and OS-level performance settings.
|
||||
|
|
|
@ -8,7 +8,7 @@ The task is a little more complex variant of <info:task/question-use-bind>.
|
|||
|
||||
The `user` object was modified. Now instead of two functions `loginOk/loginFail`, it has a single function `user.login(true/false)`.
|
||||
|
||||
What to pass `askPassword` in the code below, so that it calls `user.login(true)` as `ok` and `user.login(false)` as `fail`?
|
||||
What should we pass `askPassword` in the code below, so that it calls `user.login(true)` as `ok` and `user.login(false)` as `fail`?
|
||||
|
||||
```js
|
||||
function askPassword(ok, fail) {
|
||||
|
|
|
@ -98,7 +98,7 @@ Functions provide a built-in method [bind](mdn:js/Function/bind) that allows to
|
|||
The basic syntax is:
|
||||
|
||||
```js
|
||||
// more complex syntax will be little later
|
||||
// more complex syntax will come a little later
|
||||
let boundFunc = func.bind(context);
|
||||
```
|
||||
|
||||
|
|
|
@ -118,9 +118,9 @@ Here we had to create additional variables `args` and `ctx` so that the function
|
|||
|
||||
Arrow functions:
|
||||
|
||||
- Do not have `this`.
|
||||
- Do not have `arguments`.
|
||||
- Can't be called with `new`.
|
||||
- (They also don't have `super`, but we didn't study it. Will be in the chapter <info:class-inheritance>).
|
||||
- Do not have `this`
|
||||
- Do not have `arguments`
|
||||
- Can't be called with `new`
|
||||
- They also don't have `super`, but we didn't study it yet. We will on the chapter <info:class-inheritance>
|
||||
|
||||
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.
|
||||
That's because they are meant for short pieces of code that do not have their own "context", but rather work in the current one. And they really shine in that use case.
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
As we know, objects can store properties.
|
||||
|
||||
Till now, a property was a simple "key-value" pair to us. But an object property is actually a more flexible and powerful thing.
|
||||
Until now, a property was a simple "key-value" pair to us. But an object property is actually a more flexible and powerful thing.
|
||||
|
||||
In this chapter we'll study additional configuration options, and in the next we'll see how to invisibly turn them into getter/setter functions.
|
||||
|
||||
|
@ -134,7 +134,7 @@ let user = { };
|
|||
Object.defineProperty(user, "name", {
|
||||
*!*
|
||||
value: "John",
|
||||
// for new properties need to explicitly list what's true
|
||||
// for new properties we need to explicitly list what's true
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
*/!*
|
||||
|
@ -148,7 +148,7 @@ user.name = "Pete"; // Error
|
|||
|
||||
Now let's add a custom `toString` to `user`.
|
||||
|
||||
Normally, a built-in `toString` for objects is non-enumerable, it does not show up in `for..in`. But if we add `toString` of our own, then by default it shows up in `for..in`, like this:
|
||||
Normally, a built-in `toString` for objects is non-enumerable, it does not show up in `for..in`. But if we add a `toString` of our own, then by default it shows up in `for..in`, like this:
|
||||
|
||||
```js run
|
||||
let user = {
|
||||
|
@ -162,7 +162,7 @@ let user = {
|
|||
for (let key in user) alert(key); // name, toString
|
||||
```
|
||||
|
||||
If we don't like it, then we can set `enumerable:false`. Then it won't appear in `for..in` loop, just like the built-in one:
|
||||
If we don't like it, then we can set `enumerable:false`. Then it won't appear in a `for..in` loop, just like the built-in one:
|
||||
|
||||
```js run
|
||||
let user = {
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
There are two kinds of properties.
|
||||
|
||||
The first kind is *data properties*. We already know how to work with them. All properties that we've been using till now were data properties.
|
||||
The first kind is *data properties*. We already know how to work with them. All properties that we've been using until now were data properties.
|
||||
|
||||
The second type of properties is something new. It's *accessor properties*. They are essentially functions that work on getting and setting a value, but look like regular properties to an external code.
|
||||
|
||||
|
@ -189,9 +189,9 @@ Technically, external code is able to access the name directly by using `user._n
|
|||
|
||||
## Using for compatibility
|
||||
|
||||
One of the great uses of accessors -- they allow to take control over a "regular" data property at any moment by replacing it with getter and setter and tweak its behavior.
|
||||
One of the great uses of accessors is that they allow to take control over a "regular" data property at any moment by replacing it with a getter and a setter and tweak its behavior.
|
||||
|
||||
Imagine, we started implementing user objects using data properties `name` and `age`:
|
||||
Imagine we started implementing user objects using data properties `name` and `age`:
|
||||
|
||||
```js
|
||||
function User(name, age) {
|
||||
|
|
|
@ -6,7 +6,7 @@ importance: 5
|
|||
|
||||
The task has two parts.
|
||||
|
||||
We have objects:
|
||||
Given the following objects:
|
||||
|
||||
```js
|
||||
let head = {
|
||||
|
|
|
@ -2,7 +2,7 @@ importance: 5
|
|||
|
||||
---
|
||||
|
||||
# Where it writes?
|
||||
# Where does it write?
|
||||
|
||||
We have `rabbit` inheriting from `animal`.
|
||||
|
||||
|
|
|
@ -2,11 +2,11 @@ importance: 5
|
|||
|
||||
---
|
||||
|
||||
# Why two hamsters are full?
|
||||
# Why are both hamsters full?
|
||||
|
||||
We have two hamsters: `speedy` and `lazy` inheriting from the general `hamster` object.
|
||||
|
||||
When we feed one of them, the other one is also full. Why? How to fix it?
|
||||
When we feed one of them, the other one is also full. Why? How can we fix it?
|
||||
|
||||
```js run
|
||||
let hamster = {
|
||||
|
|
|
@ -246,7 +246,7 @@ The resulting picture:
|
|||
|
||||

|
||||
|
||||
If we had other objects like `bird`, `snake` etc., inheriting from `animal`, they would also gain access to methods of `animal`. But `this` in each method call would be the corresponding object, evaluated at the call-time (before dot), not `animal`. So when we write data into `this`, it is stored into these objects.
|
||||
If we had other objects, like `bird`, `snake`, etc., inheriting from `animal`, they would also gain access to methods of `animal`. But `this` in each method call would be the corresponding object, evaluated at the call-time (before dot), not `animal`. So when we write data into `this`, it is stored into these objects.
|
||||
|
||||
As a result, methods are shared, but the object state is not.
|
||||
|
||||
|
|
|
@ -20,7 +20,7 @@ alert( rabbit.eats ); // true
|
|||
```
|
||||
|
||||
|
||||
1. We added one more string (emphasized), what `alert` shows now?
|
||||
1. We added one more string (emphasized). What will `alert` show now?
|
||||
|
||||
```js
|
||||
function Rabbit() {}
|
||||
|
@ -54,7 +54,7 @@ alert( rabbit.eats ); // true
|
|||
alert( rabbit.eats ); // ?
|
||||
```
|
||||
|
||||
3. Like this (replaced one line)?
|
||||
3. And like this (replaced one line)?
|
||||
|
||||
```js
|
||||
function Rabbit() {}
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
Remember, new objects can be created with a constructor function, like `new F()`.
|
||||
|
||||
If `F.prototype` is an object, then `new` operator uses it to set `[[Prototype]]` for the new object.
|
||||
If `F.prototype` is an object, then the `new` operator uses it to set `[[Prototype]]` for the new object.
|
||||
|
||||
```smart
|
||||
JavaScript had prototypal inheritance from the beginning. It was one of the core features of the language.
|
||||
|
@ -158,9 +158,9 @@ Rabbit.prototype = {
|
|||
|
||||
In this chapter we briefly described the way of setting a `[[Prototype]]` for objects created via a constructor function. Later we'll see more advanced programming patterns that rely on it.
|
||||
|
||||
Everything is quite simple, just few notes to make things clear:
|
||||
Everything is quite simple, just a few notes to make things clear:
|
||||
|
||||
- The `F.prototype` property (don't mess with `[[Prototype]]`) sets `[[Prototype]]` of new objects when `new F()` is called.
|
||||
- The `F.prototype` property (don't mistake it for `[[Prototype]]`) sets `[[Prototype]]` of new objects when `new F()` is called.
|
||||
- The value of `F.prototype` should be either an object or `null`: other values won't work.
|
||||
- The `"prototype"` property only has such a special effect when set on a constructor function, and invoked with `new`.
|
||||
|
||||
|
|
|
@ -603,7 +603,7 @@ Here are examples of operations and `Reflect` calls that do the same:
|
|||
|-----------------|----------------|-------------|
|
||||
| `obj[prop]` | `Reflect.get(obj, prop)` | `[[Get]]` |
|
||||
| `obj[prop] = value` | `Reflect.set(obj, prop, value)` | `[[Set]]` |
|
||||
| `delete obj[prop]` | `Reflect.deleteProperty(obj, prop)` | `[[HasProperty]]` |
|
||||
| `delete obj[prop]` | `Reflect.deleteProperty(obj, prop)` | `[[Delete]]` |
|
||||
| `new F(value)` | `Reflect.construct(F, value)` | `[[Construct]]` |
|
||||
| ... | ... | ... |
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue