diff --git a/1-js/2-first-steps/14-function-basics/article.md b/1-js/2-first-steps/14-function-basics/article.md index 76844d6d..1c9365a2 100644 --- a/1-js/2-first-steps/14-function-basics/article.md +++ b/1-js/2-first-steps/14-function-basics/article.md @@ -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] 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. diff --git a/1-js/9-object-inheritance/05-class/animal-rabbit-static.png b/1-js/9-object-inheritance/05-class/animal-rabbit-static.png new file mode 100644 index 00000000..f7095d6c Binary files /dev/null and b/1-js/9-object-inheritance/05-class/animal-rabbit-static.png differ diff --git a/1-js/9-object-inheritance/05-class/animal-rabbit-static@2x.png b/1-js/9-object-inheritance/05-class/animal-rabbit-static@2x.png new file mode 100644 index 00000000..04eb0538 Binary files /dev/null and b/1-js/9-object-inheritance/05-class/animal-rabbit-static@2x.png differ diff --git a/1-js/9-object-inheritance/05-class/article.md b/1-js/9-object-inheritance/05-class/article.md index 7f72fd56..4a7ff2b6 100644 --- a/1-js/9-object-inheritance/05-class/article.md +++ b/1-js/9-object-inheritance/05-class/article.md @@ -577,10 +577,74 @@ Static methods are often used in database-related classes to search/save/remove ### 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`: + +![](object-date-inheritance.png) + +Both `Object` and `Date` exist independently. Sure, `Date.prototype` inherits from `Object.prototype`, but that's all. + +With classes we have one more arrow: + +![](animal-rabbit-static.png) + +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);}` \ No newline at end of file diff --git a/1-js/9-object-inheritance/05-class/object-date-inheritance.png b/1-js/9-object-inheritance/05-class/object-date-inheritance.png new file mode 100644 index 00000000..1746cb9a Binary files /dev/null and b/1-js/9-object-inheritance/05-class/object-date-inheritance.png differ diff --git a/1-js/9-object-inheritance/05-class/object-date-inheritance@2x.png b/1-js/9-object-inheritance/05-class/object-date-inheritance@2x.png new file mode 100644 index 00000000..bf0866f8 Binary files /dev/null and b/1-js/9-object-inheritance/05-class/object-date-inheritance@2x.png differ diff --git a/figures.sketch b/figures.sketch index f555dc5a..69749f77 100644 Binary files a/figures.sketch and b/figures.sketch differ