commit
89f6c41e06
1 changed files with 9 additions and 9 deletions
|
@ -7,7 +7,7 @@ The "class" construct allows to define prototype-based classes with a clean, nic
|
||||||
|
|
||||||
## The "class" syntax
|
## The "class" syntax
|
||||||
|
|
||||||
The `class` syntax is versatile, we'll start from a simple example first.
|
The `class` syntax is versatile, we'll start with a simple example first.
|
||||||
|
|
||||||
Here's a prototype-based class `User`:
|
Here's a prototype-based class `User`:
|
||||||
|
|
||||||
|
@ -57,13 +57,13 @@ Here's the code to dig into the class and see that:
|
||||||
```js run
|
```js run
|
||||||
class User {
|
class User {
|
||||||
constructor(name) { this.name = name; }
|
constructor(name) { this.name = name; }
|
||||||
sayHi() { alert(this.name); }
|
sayHi() { alert(this.name); }
|
||||||
}
|
}
|
||||||
|
|
||||||
*!*
|
*!*
|
||||||
// proof: User is the "constructor" function
|
// proof: User is the "constructor" function
|
||||||
*/!*
|
*/!*
|
||||||
alert(User == User.prototype.constructor); // true
|
alert(User === User.prototype.constructor); // true
|
||||||
|
|
||||||
*!*
|
*!*
|
||||||
// proof: there are two methods in its "prototype"
|
// proof: there are two methods in its "prototype"
|
||||||
|
@ -129,7 +129,7 @@ class User {
|
||||||
set name(value) {
|
set name(value) {
|
||||||
*/!*
|
*/!*
|
||||||
if (value.length < 4) {
|
if (value.length < 4) {
|
||||||
alert("Name too short.");
|
alert("Name is too short.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this._name = value;
|
this._name = value;
|
||||||
|
@ -146,7 +146,7 @@ user = new User(""); // Name too short.
|
||||||
Internally, getters and setters are also created on the `User` prototype, like this:
|
Internally, getters and setters are also created on the `User` prototype, like this:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
Object.defineProperty(User.prototype, {
|
Object.defineProperties(User.prototype, {
|
||||||
name: {
|
name: {
|
||||||
get() {
|
get() {
|
||||||
return this._name
|
return this._name
|
||||||
|
@ -239,7 +239,7 @@ class User {
|
||||||
*!*
|
*!*
|
||||||
static staticMethod() {
|
static staticMethod() {
|
||||||
*/!*
|
*/!*
|
||||||
alert(this == User);
|
alert(this === User);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -252,7 +252,7 @@ That actually does the same as assigning it as a function property:
|
||||||
function User() { }
|
function User() { }
|
||||||
|
|
||||||
User.staticMethod = function() {
|
User.staticMethod = function() {
|
||||||
alert(this == User);
|
alert(this === User);
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|
||||||
|
@ -312,7 +312,7 @@ class Article {
|
||||||
*!*
|
*!*
|
||||||
static createTodays() {
|
static createTodays() {
|
||||||
// remember, this = Article
|
// remember, this = Article
|
||||||
return new this("Todays digest", new Date());
|
return new this("Today's digest", new Date());
|
||||||
}
|
}
|
||||||
*/!*
|
*/!*
|
||||||
}
|
}
|
||||||
|
@ -322,7 +322,7 @@ let article = Article.createTodays();
|
||||||
alert( article.title ); // Todays digest
|
alert( article.title ); // Todays digest
|
||||||
```
|
```
|
||||||
|
|
||||||
Now every time we need to create a todays digest, we can call `Article.createTodays()`. Once again, that's not a method of an article, but a method of the whole class.
|
Now every time we need to create a today's digest, we can call `Article.createTodays()`. Once again, that's not a method of an article, but a method of the whole class.
|
||||||
|
|
||||||
Static methods are also used in database-related classes to search/save/remove entries from the database, like this:
|
Static methods are also used in database-related classes to search/save/remove entries from the database, like this:
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue