一, 类的由来
es6提供了一个新语法就是class
二, class声明一个类
// 声明一个类
class Piont{ // Piont就是一个类
}
1, 添加属性和方法
class Piont {
// 构造函数
constructor(name, age) {
this.name = name;
this.age = age;
}
// 方法
run(){
console.log(1);
}
}
2, 使用方式
var p = new Piont('刘德华',30);
p.run();
console.log(p.name);
3, 方法的写入
run(){
console.log(1);
}
对象调用的属性和方法叫做成员属性和方法,有类直接调用的属性和方法叫静态属性和方法
静态的属性指的是Class本身不是定义在实列对象上的属性
class Foo {
}
Foo.pop = 1; // 给Foo这个类定义了一个静态属性
console.log(Foo.pop);
4, 内部添加静态属性
class Po{
static myP = 100; // 静态属性
constructor(){
console.log(Po.myP);
}
}
var p1 = new Po();
p1.constructor; // 调用
5, 添加静态方法
class Foo{
static po = 100; //
static classMethod(){
return 'hello';
}
}
6, this和方法重名
class Foo {
static bar() {
this.baz()
}
static baz() {
console.log('hello');
}
baz() {
console.log('world');
}
}
Foo.bar();
var f = new Foo();
f.baz();
7, 父类的静态方法可以被子类继承
class Foo {
static classMethod() {
return 'hello';
}
}
// 子类继承父类
class Bar extends Foo { // 子类继承父类
}
console.log(Bar.classMethod());
8, class继承
Class可以通过extends关键字实现继承,这比ES5通过修改原型链实现继承
class Point{
}
// 子类继承父类
class ColorPoint extends Point{
}
在ColorPoint内加上代码
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
}
// 在ColorPoint内加上代码
class ColorPoint extends Point {
constructor(x, y, color) {
// this.color = color; // 错误
super(x, y); // 调用父类的constructor(x, y)
this.color = color; // 正确的
}
toString() {
return this.color + ' ' + super.toString;
toString()
}
}
let cp = new ColorPoint(20, 30, 'green');
console.log(cp instanceof ColorPoint);// true
console.log(cp instanceof Point); // true
console.log(cp.x, cp.y, cp.color);
9, super关键字
既可以当做函数使用,也可以当做对象使用
当做函数使用的时候,代表的是父类的构造函数,es6要求,子类的构造函数必须执行一些super
class A{
constructor(){
console.log(new.target.name);
}
}
class B extends A{
constructor(){
super();// 代表的是父类的构造函数 但是返回的是子类的实列,内部的this指向的是子类的实列
// 相当于
// A.prototype.constructor.call(this);
}
}
console.log(new A()); //A
console.log(new B()); //B
super作为对象使用,在普通方法中,指向父类的原型对象,在静态方法中,指向的是父类
class A{
p(){
return 2;
}
}
// 继承
class B extends A {
constructor(){
super();
console.log(super.p()); // 2
}
}
let b = new B();
由于super指向父类的原型对象,所以定义在父类实列上的方法或者属性,是无法通过super调用
class A {
constructor() {
this.p = 2;
}
}
// 继承
class B extends A {
get m() {
return super.p;
}
}
let b = new B();
console.log(b.m);