class
constructor construction method
this represents the instance object
There is no need to separate the methods with commas, and an error will be reported if they are added.
typeof Point // "function"
Point === Point.prototype.constructor // true
The data type of the class is the function, and the class itself points to the constructor.
All methods of a class are defined on prototypethe properties of the class
All methods defined inside the class are non-enumerable
Methods defined inside ES6 classes are not enumerable; ES5 can
# es5
console.log(Object.getPrototypeOf(a));//['es5method']
#es6
console.log(Object.getPrototypeOf(a));//[]
point.hasOwnProperty('toString') // false
constructor method
class default method
When an object instance is generated by the new command, this method is called by itself.
If not explicitly defined, it will be added by default
The constructor method returns the instance object (ie this) by default
The properties of an instance are defined on the prototype unless are explicitly defined on itself (that is, defined on thisthe object).
The class must be newcalled, otherwise an error will be reported.
All instances of a class share a prototype object
Value function (getter) and storage function (setter)
class Point{
get prop() {
return 'getter'; }
set prop(value) {
console.log('setter: '+value); }
}
important point
strict mode
Inside classes and modules, strict mode is the default, so there is no need to use a use strictspecified runtime mode.
no boost
Class does not exist variable hoisting (hoist)
The reason for this provision is related to the inheritance mentioned below, which must ensure that the subclass is defined after the parent class.
Class expression
let Poin = class Point {
getName() {
console.log(Point.name, 'name')
}
}
let point = new Poin()
point.getName() // Point
console.log(Poin.name, 'Poin.name');//Point
console.log(Point1.name, 'Poin.name');//Point is not defined
PointIt is only available inside Class and refers to the current class. Outside the Class, this class can only be used by Poinreference.
what this points to
If the method of the class contains it this, it points to the instance of the class by default.
However, if this method is extracted and used alone, thisit will point to the environment where the method runs
Inside an arrow function thisalways points to the object in which it was defined.
static method
staticKeyword, will not be inherited by the instance, but called directly through the class
If the static method contains thiskeywords, this thisrefers to the class, not the instance.
A static method can have the same name as a non-static method.
The static method of the parent class can be inherited by the subclass.
Static methods are also supercallable from objects.
New way of writing instance attributes
class Point {
name;
constructor() {
/**/}
}
static property
class Foo {
}
Foo.prop = 1
# 或者
class Foo {
prop = 1;
}
Private Methods and Private Properties
Methods and properties that can only be accessed inside the class, not outside. Conducive to code encapsulation
Before the property name, use #the denotation
class Foo {
#count = 0
}
Can only be used inside a class (
this.#count). If used outside the class, an error will be reported
Private properties can also have getter and setter methods.
new.target Property
This attribute is generally used in constructors
Returns newthe constructor that the command acts on. Returns if the constructor was not invoked by command newor call , so this property can be used to determine how the constructor was invoked.Reflect.construct()new.targetundefined
function Person(name) {
if (new.target !== undefined) {
this.name = name;
} else {
throw new Error('必须使用 new 命令生成实例');
}
}
var person = new Person('张三'); // 正确
var notAPerson = Person.call(person, '张三'); // 报错
Called internally by Class
new.targetto return the current Class.
When a subclass inherits from a parent class, new.targetthe subclass is returned.
class Fu {
constructor() {
console.log( new.target) //Son
}
}
class Son extends Fu {
constructor () {
super()
}
}
Class inheritance
extendsInheritance through keywords
superKeyword: Indicates the constructor of the parent class, which is used to create thisan object of the parent class.
The subclass must constructorcall superthe method in the method, otherwise an error will be reported when creating a new instance.
This is because the object of the subclass thismust first be shaped through the constructor of the parent class to obtain the same instance attributes and methods as the parent class, and then processed to add the instance attributes and methods of the subclass itself. If superthe method is not called, the subclass cannot get thisthe object.
In the constructor of the subclass, keywords supercan only be used after calling, otherwise an error will be reported. thisThis is because the subclass instance is constructed based on the parent class instance, and only supermethods can call the parent class instance.
class Son extends Fu {
constructor() {
this.color = color // ReferenceError
super(x,y)
}
}
The static method of the parent class will also be inherited by the subclass.
Object.getPrototypeOf()
The static method of the parent class will also be inherited by the subclass.
Object.getPrototypeOf(ColorPoint) === Point
// true
super keyword
It can be used as a function or as an object.
when called as a function
When called as a function, it represents the constructor of the parent class, and superthe internal thisone refers to Bthe instance of
It can only be used in the constructor of a subclass, and an error will be reported if it is used in other places.
class A {
}
class B extends A {
m() {
super(); // 报错
}
}
as an object
In ordinary methods, it points to the prototype object of the parent class ; in static methods, it points to the parent class
. If a property is assigned through super, then super is this , and the assigned property will become the property of the subclass instance.
class A {
constructor() {
this.p = 2}
say() {
console.log('say', p)}
}
A.prototype.name = "Ren"
class B {
constructor() {
super()
this.p = 99
console.log(super.x) //undefined
super.say() //99
console.log(super.name) //Ren
this.b = 1
super.b = 2
console.log(super.b)//undefined
console.log(this.b)//2
}
}
Failed to get attribute p
Get method say success
Get property name successfully
Note: Although super.say() calls A.prototype.say(), but the internal this of A.prototype() points to B, so the output is 99
Since thisit points to a subclass instance, if you superassign a value to a property, then superit isthis
If superit is used as an object in a static method, it superwill point to the parent class, not the prototype object of the parent class.
class Point {
static age = 18;
name = 19
static say() {
console.log(this.age, 'age')//18
console.log(this.name, 'name')//undefined
}
}
class Son extends Point {
static say() {
super.say()
}
}
Son.say()
When the method of the parent class is called in the static method superof the subclass, the internal method thispoints to the current subclass, not the instance of the subclass.
Prototype and __proto__ properties of classes
Class, as the syntactic sugar of the constructor, has both prototypeattributes and __proto__attributes, so there are two inheritance chains at the same time.
(1) The attribute of the subclass __proto__indicates the inheritance of the constructor and always points to the parent class.
prototype(2) The attribute of the subclass attribute __proto__, which means the inheritance of the method, always points to the attribute of the parent class prototype.
BThese two inheritance chains can be understood as follows: as an object, the prototype ( __proto__property) of the subclass ( ) is the parent class ( ); as a constructor, the prototype object (property) of Athe subclass ( ) is the prototype object of the parent class ( property) instance.Bprototypeprototype
class A {
}
class B {
}
Object.setPrototypeOf(B.prototype, A.prototype)// B 继承 A 的静态属性
Object.setPrototypeOf(B, A)// B 继承 A 的静态属性
const b = new B()
Object.setPrototypeOfimplementation of the method.
Object.setPrototypeOf = function (obj, proto) {
obj.__proto__ proto
return obj
}
Inheritance of native constructors
I did not see
Implementation of the Mixin pattern
I did not see