class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
toString() {
return '(' + this.x + ', ' + this.y + ')';
}
}
- 1 注意
- 类的所有方法都定义在类的prototype属性上面
- 类的内部所有定义的方法，都是不可枚举的
- 定义“类”的方法的时候，前面不需要加上function这个关键字
- 类的方法之间不需要逗号分隔，加了会报错
- 2 类的constructor方法：
1 当类没有constructor方法时，会添加空的constructor方法
2 constructor默认返回this对象，与es5的构造函数是一样的
- 2.1 类的实例属性
1 实例属性可以写在constructor中，也可以写在最顶部
class foo {
bar = 'hello';
baz = 'world';
constructor() {
// ...
}
}
- 3 类的实例对象
- 生成类的实例时必须使用
new关键字,且类不能自己调用;
- 4 类的原型对象
- get和set关键字对属性设置存取函数，拦截该属性的行为
class MyClass {
constructor() {
// ...
}
get prop() {
return 'getter';
}
set prop(value) {
console.log('setter: '+value);
}
}
let inst = new MyClass();
inst.prop = 123;
// setter: 123
inst.prop
// 'getter'
- 里面的方法默认绑定this为类的实例，可是如果单独取出该方法，会丢失this指针，在react中就是如此。为了指向正确的this，可以使用箭头函数，bind方法和proxy代理
- 5.1 静态方法
- 1 使用static关键字来描述类的静态方法，在静态方法中this指向类本身
- 2 子类可以继承父类的静态方法
- 3 在子类的方法中可以使用super来调用父类的静态方法
- 5.2 静态属性
- 1 目前只有这种写法，有个提案用static来代表静态属性
class Foo {
}
Foo.prop = 1;
Foo.prop // 1
- 5.3 私有属性和私有方法
- 6 new.target属性
- 1 该属性一般用在构造函数之中，返回new命令作用于的那个构造函数
class Rectangle {
constructor(length, width) {
console.log(new.target === Rectangle);
this.length = length;
this.width = width;
}
}
var obj = new Rectangle(3, 4); // 输出 true
- 2 如果子类继承父类时，new.target会返回子类
class Rectangle {
constructor(length, width) {
console.log(new.target === Rectangle);
// ...
}
}
class Square extends Rectangle {
constructor(length) {
super(length, length);
}
}
var obj = new Square(3); // 输出 false
- 7 类的继承
- 使用extends关键字实现继承
- 在继承时,必须在使用this之前调用super方法
这是因为子类自己的this对象，必须先通过父类的构造函数完成塑造，得到与父类同样的实例属性和方法， 然后再对其进行加工，加上子类自己的实例属性和方法。如果不调用super方法，子类就得不到this对象。
- 7.1 super关键字
- super当函数使用,只能在constructor中使用,此时代表父类的构造函数
- 作为对象使用,在普通方法中指向父类的原型对象(拿不到父类实例对象的属性),在静态方法中,指向父类本身;
- 在子类普通方法中通过super调用父类的方法时，方法内部的this指向当前的子类实例。在子类的静态方法中通过super调用父类的方法时，方法内部的this指向当前的子类，而不是子类的实例。
- 由于this指向子类实例，所以如果通过super对某个属性赋值，这时super就是this，赋值的属性会变成子类实例的属性。
class A {
constructor() {
this.x = 1;
}
}
class B extends A {
constructor() {
super();
this.x = 2;
super.x = 3;
console.log(super.x); // undefined
console.log(this.x); // 3
}
}
let b = new B();
