You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/07-object-oriented-programming/08-class-patterns/article.md
+16-17Lines changed: 16 additions & 17 deletions
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@
5
5
In object-oriented programming, a *class* is an extensible program-code-template for creating objects, providing initial values for state (member variables) and implementations of behavior (member functions or methods).
6
6
```
7
7
8
-
There's a special syntax construct and a keyword `class` in JavaScript. But before studying it, we should consider that the term "class" comes from the theory of object-oriented programming. The definition is cited above, and it's language-independant.
8
+
There's a special syntax construct and a keyword `class` in JavaScript. But before studying it, we should consider that the term "class" comes from the theory of object-oriented programming. The definition is cited above, and it's language-independent.
9
9
10
10
In JavaScript there are several well-known programming patterns to make classes even without using the `class` keyword. And here we'll talk about them first.
11
11
@@ -43,7 +43,6 @@ So we can easily add internal functions and variables, like `calcAge()` here:
43
43
44
44
```js run
45
45
functionUser(name, birthday) {
46
-
47
46
*!*
48
47
// only visible from other methods inside User
49
48
functioncalcAge() {
@@ -52,17 +51,17 @@ function User(name, birthday) {
52
51
*/!*
53
52
54
53
this.sayHi=function() {
55
-
alert(name+', age:'+calcAge());
54
+
alert(`${name}, age:${calcAge()}`);
56
55
};
57
56
}
58
57
59
-
let user =newUser("John", newDate(2000,0,1));
60
-
user.sayHi(); // John
58
+
let user =newUser("John", newDate(2000,0, 1));
59
+
user.sayHi(); // John, age:17
61
60
```
62
61
63
62
In this code variables `name`, `birthday` and the function `calcAge()` are internal, *private* to the object. They are only visible from inside of it.
64
63
65
-
From the other hand, `sayHi` is the external, *public* method. The external code that creates `user` can access it.
64
+
On the other hand, `sayHi` is the external, *public* method. The external code that creates `user` can access it.
66
65
67
66
This way we can hide internal implementation details and helper methods from the outer code. Only what's assigned to `this` becomes visible outside.
68
67
@@ -81,22 +80,22 @@ function User(name, birthday) {
81
80
82
81
return {
83
82
sayHi() {
84
-
alert(name+', age:'+calcAge());
83
+
alert(`${name}, age:${calcAge()}`);
85
84
}
86
85
};
87
86
}
88
87
89
88
*!*
90
-
let user =User("John", newDate(2000,0,1));
89
+
let user =User("John", newDate(2000,0, 1));
91
90
*/!*
92
-
user.sayHi(); // John
91
+
user.sayHi(); // John, age:17
93
92
```
94
93
95
94
As we can see, the function `User` returns an object with public properties and methods. The only benefit of this method is that we can omit `new`: write `let user = User(...)` instead of `let user = new User(...)`. In other aspects it's almost the same as the functional pattern.
96
95
97
96
## Prototype-based classes
98
97
99
-
Prototype-based classes is the most important and generally the best. Functional and factory class patterns are rarely used in practice.
98
+
Prototype-based classes are the most important and generally the best. Functional and factory class patterns are rarely used in practice.
0 commit comments