(**第一次使用markdown编辑呀,一个字,爽!)
下面开始正文的介绍:
Constructor是一种用来 创建和初始化class类创建的对象 的特殊方法,一般写在class类的方法里面,使类创建出来的新对象可以继承到class类上面绑定的方法以及属性, es6类中的constructor构造方法对应的是es5中的构造函数。
- 注意:【在一个class类中只能有一个constructor的方法名,多余一个就会报错】
例如:
class Person {
constructor () {
this.name = ‘Lily’
}
showName () {
console.log('Liming')
}
}
var aa = new Person();
aa.showName(); //'Liming'
console.log(aa.name); //‘Lily’
- 注意:若没有显式的指定constructor函数,则会添加一个默认的空的constructor这个方法
- 注意: 在constructor中的this指的是实例对象
class属于es6中的一种语法糖,使用的 例子:
//es5写法
function Point(x, y) {
this.x = x;
this.y = y;
}
Point.prototype.toString = function () {
return '(' + this.x + ', ' + this.y + ')';
};
var p = new Point(1, 2);
//es6写法
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
toString() {
return '(' + this.x + ', ' + this.y + ')';
}
}
在es6中定义类的方法不需要加function这个关键字
//这两者是等价的
Point === Point.prototype.constructor //true
- 注意:class类本身就是函数,并且自身就指向它的构造函数,类上所有的方法实际上都是定义在类的prototype属性上,当然也包括constructor()方法。所以当向类上添加方法时,要添加在类的prototype属性上,可以使用Object.assign()方法同时添加多个。
举个?:
class Point {
constructor(){
// ...
}
}
Object.assign(Point.prototype, {
toString(){},
toValue(){}
});
- 注意:在类中定义的方法,如果前面加上static关键字,则表明这个方法不会被实例化出来的新对象所继承,实例化的对象是无法调用到的,而是要通过类本身来调用,这样的方法称之为 静态方法。
- 此时,若静态方法中含有this,指向的并不是实例化的新对象了,而是指向类本身。
-可以使用extends来继承父类上面的方法,并且父类上面的静态方法也可以继承到,例子如下:
//子类继承父类的写法
class Bar {
static sayAge () {
console.log('19')
}
}
class Foo extends Bar {
}
Foo.sayAge() //'19'
constructor默认会返回this这个实例对象,也可以指定返回另一个对象,constructor会在类实例化一个新对象时,自动调用这个方法
对象函数中的this指向的是当前的函数所在的对象,而super指向的是当前函数所在对象的原型,比this更深了一个层次。在子类的构造函数中调用super(),相当于调用父类的constructor。可以举个?:
const proto = {
foo: 'hello'
};
const obj = {
foo: 'world',
find() {
return super.foo;
}
};
Object.setPrototypeOf(obj, proto);//使用setPrototypeOf给obj设置原型对象为proto
obj.find() // "hello"
注意:super用来表示原型对象时,只能用在对象的方法中,用在其他地方都会报错。
js引擎只在对象的方法中识别super,对于原型对象上的realName属性,super.realName === object.getPrototypeOf(this).realName
注意:当使用super指向原型对象中的一个方法时,方法中的this不指向原型对象,而是指向当前所存在的子类对象。
注意:子类在继承父类时,子类中是找不到this的,没有自己的this对象,只能使用super继承父类中的this对象,然后在加工。
即在ES6的继承,需要先创建父类的this,子类调用super继承父类的this对象,然后再用子类的构造函数对this进行加工。
这里另外说一下与es5继承方式的区别:
es5的继承,实质是先创造子类的实例对象 this ,然后再将父类的方法添加到 this 上面( Parent.apply(this) )
举例如下
class Demo{
constructor(x,y) {
this.x = x;
this.y = y;
}
}
class Demo2 extends Demo{
constructor(x,y){
this.x = x; //this is not defined
}
}
应该修改为:
class Demo2 extends Demo{
constructor(x,y){
super(x,y);
console.log(super.x); //undefined
console.log(this.x); //这时候this是可以找到的,可以new一个实例对象,给x,y赋值试一下
}
}