work
This commit is contained in:
parent
03cbee39ae
commit
b78f329c5f
7 changed files with 84 additions and 4 deletions
|
@ -318,6 +318,22 @@ alert( doNothing() === undefined ); // true
|
||||||
```
|
```
|
||||||
````
|
````
|
||||||
|
|
||||||
|
````warn header="Never line-break between `return` and its value"
|
||||||
|
For long expressions, it may be tempting sometimes to put them on a separate line, like this:
|
||||||
|
|
||||||
|
```js
|
||||||
|
return
|
||||||
|
(some + long + expression + or + whatever * f(a) + f(b))
|
||||||
|
```
|
||||||
|
That doesn't work, because Javascript assumes a semicolon after `return` in that case:
|
||||||
|
|
||||||
|
```js
|
||||||
|
return*!*;*/!*
|
||||||
|
(some + long + expression + or + whatever * f(a) + f(b))
|
||||||
|
```
|
||||||
|
So, it effectively becomes an empty return. We should put the value on the same line instead.
|
||||||
|
````
|
||||||
|
|
||||||
## Naming a function [#function-naming]
|
## Naming a function [#function-naming]
|
||||||
|
|
||||||
Functions are actions. So their name is usually a verb. It should briefly, but as accurately as possible describe what the function does. So that a person who reads the code gets the right clue.
|
Functions are actions. So their name is usually a verb. It should briefly, but as accurately as possible describe what the function does. So that a person who reads the code gets the right clue.
|
||||||
|
|
BIN
1-js/9-object-inheritance/05-class/animal-rabbit-static.png
Normal file
BIN
1-js/9-object-inheritance/05-class/animal-rabbit-static.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 28 KiB |
BIN
1-js/9-object-inheritance/05-class/animal-rabbit-static@2x.png
Normal file
BIN
1-js/9-object-inheritance/05-class/animal-rabbit-static@2x.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 66 KiB |
|
@ -577,10 +577,74 @@ Static methods are often used in database-related classes to search/save/remove
|
||||||
|
|
||||||
### Static methods and inheritance
|
### Static methods and inheritance
|
||||||
|
|
||||||
Todo: picture with function -> prototype and vertical link for functions
|
The `class` syntax supports inheritance for static properties too.
|
||||||
|
|
||||||
|
For instance:
|
||||||
|
|
||||||
|
```js run
|
||||||
|
class Animal {
|
||||||
|
|
||||||
|
constructor(name, speed) {
|
||||||
|
this.speed = speed;
|
||||||
|
this.name = name;
|
||||||
|
}
|
||||||
|
|
||||||
|
run(speed = 0) {
|
||||||
|
this.speed += speed;
|
||||||
|
alert(`${this.name} runs with speed ${this.speed}.`);
|
||||||
|
}
|
||||||
|
|
||||||
|
static compare(animalA, animalB) {
|
||||||
|
return animalA.speed - animalB.speed;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// Inherit from Animal
|
||||||
|
class Rabbit extends Animal {
|
||||||
|
hide() {
|
||||||
|
alert(`${this.name} hides!`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let rabbits = [
|
||||||
|
new Rabbit("White Rabbit", 10),
|
||||||
|
new Rabbit("Black Rabbit", 5)
|
||||||
|
];
|
||||||
|
|
||||||
|
rabbits.sort(Rabbit.compare);
|
||||||
|
|
||||||
|
rabbits[0].run(); // Black Rabbit runs with speed 5.
|
||||||
|
```
|
||||||
|
|
||||||
|
That's actually a very interesting feature, because built-in classes don't behave like that.
|
||||||
|
|
||||||
|
For instance, `Object` has `Object.defineProperty`, `Object.keys` and so on, but other objects do not inherit them.
|
||||||
|
|
||||||
|
Here's the structure for `Date` and `Object`:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Both `Object` and `Date` exist independently. Sure, `Date.prototype` inherits from `Object.prototype`, but that's all.
|
||||||
|
|
||||||
|
With classes we have one more arrow:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Right, `Rabbit` function now inherits from `Animal` function. And `Animal` function standartly inherits from `Function.prototype` (as other functions do).
|
||||||
|
|
||||||
|
Here, let's check:
|
||||||
|
|
||||||
|
|
||||||
## Todo absent constructor
|
```js run
|
||||||
|
class Animal {}
|
||||||
|
class Rabbit extends Animal {}
|
||||||
|
|
||||||
|
alert(Rabbit.__proto__ == Animal); // true
|
||||||
|
|
||||||
|
// and the next step is Function.prototype
|
||||||
|
alert(Animal.__proto__ == Function.prototype); // true
|
||||||
|
```
|
||||||
|
|
||||||
|
This way `Rabbit` has access to all static methods of `Animal`.
|
||||||
|
|
||||||
for simple classes parse `constructor( ){ }`
|
|
||||||
for derived `constructor(... args){ super (...args);}`
|
|
BIN
1-js/9-object-inheritance/05-class/object-date-inheritance.png
Normal file
BIN
1-js/9-object-inheritance/05-class/object-date-inheritance.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
After Width: | Height: | Size: 83 KiB |
BIN
figures.sketch
BIN
figures.sketch
Binary file not shown.
Loading…
Add table
Add a link
Reference in a new issue