-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path13_01_classes.js
180 lines (136 loc) · 4.75 KB
/
13_01_classes.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
/** Classes in JavaScript
* Functional Classes
*/
function fruits(type){
this.type = type;
this.color = "unknown";
this.getInformation = getInformation;
}
function getInformation(){
return "This"+this.type+"is"+this.color+".";
}
let lime = new fruits("Lime");
lime.color = "Green";
console.log(lime.getInformation);
/**
* We can use this getInformation() method internally also
* The drawback of internally defining the getInformation function is that,
* It recreates that function every time we create a new Fruit object.
The Prototype Property
* Fortunately, every function in JavaScript has something called a prototype property.
Which is empty by default. We can think of a function's prototype as an object blueprint or paradigm.
When we add methods and properties to the prototype, they are accessible to all instances of that function.
*/
function fruits(type){
this.type = type;
this.color = "unknown";
}
fruits.prototype.getInformation = function(){
return "This"+this.type+"is"+this.color+".";
}
let lime = new fruits("Lime");
lime.color = "Green";
console.log(lime.getInformation);
/**
* Classes
* JavaScript classes, introduced in ECMAScript 6, are essentially syntactic sugar over JavaScript's existing
prototype-based inheritance that don't actually introduce a new object-oriented inheritance model.
This syntax is a means of more simply and clearly creating objects and deal with inheritance.
Class Declarations
* One way to define a class is using a class declaration.
To declare a class, we use the class keyword and follow it with the class' name.
Ideally, we always write class names in TitleCase.
*/
class Polygon {
constructor(height, width) {
this.height = height;
this.width = width;
}
}
let p = new Polygon(1,2);
console.log('Polygon p:',p);
/**An important difference between function declarations and class declarations is that function declarations are
* Hoisted (i.e., can be referenced before they're declared) but class declarations are not.
* This means we must first declare our class before attempting to access (or reference) it.
* If we fail to do so, our code throws a ReferenceError.
* */
try {
let p = new Polygon(1, 2);
console.log('Polygon p:', p);
}
catch (exception) {
console.log(exception.name + ': ' + exception.message);
}
class Polygon {
constructor(height, width) {
this.height = height;
this.width = width;
}
}
p = new Polygon(1, 2);
console.log('Polygon p:', p);
/**
* Class Expressions
* Class expressions are another way to define a class, and they can be either named or unnamed.
* The name given to a named class expression is local to the class' body.
*/
let Polygon = class {
constructor(height, width) {
this.height = height;
this.width = width;
}
};
console.log('Polygon:', Polygon);
let p = new Polygon(1, 2);
console.log('p:', p);
/**
* The Constructor Method
* The constructor method is a special method we use to create and initialize objects of a class.
A class can only have one special method with the name constructor,
and attempting to write a class containing more than one constructor method will throw a SyntaxError.
To implement inheritance, we can use the super keyword in a constructor to call a parent class constructor.
*/
'use strict';
class Polygon {
constructor(height, width) {
this.height = height;
this.width = width;
}
getArea() {
return this.height * this.width;
}
}
const square = new Polygon(10, 10);
console.log(square.getArea());
/**
* Static Methods
* Static methods are methods relevant to all instances of a class — not just any one instance.
* These methods receive information from their arguments and not a class instance,
* which allows us to invoke a class' static methods without creating an instance of the class.
* In fact, we actually can't call a static method on an instantiated class object (attempting to do so throws a TypeError).
* We define a class' static methods using the static keyword.
* We typically use these methods to create utility functions for applications, as they can't be called on class objects.
*/
'use strict';
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
static distance(a, b) {
const dx = a.x - b.x;
const dy = a.y - b.y;
return Math.sqrt(dx * dx + dy * dy);
}
}
const p1 = new Point(5, 5);
const p2 = new Point(10, 10);
// The correct way to call a static method
console.log(Point.distance(p1, p2));
// Attempt to call a static method on an instance of the class
try {
console.log(p1.distance(p1, p2));
}
catch (exception) {
console.log(exception.name + ': ' + exception.message);
}