classmethod 继承_js es6语法 class类 class继承 super关键字(示例代码)

一,类的由来

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);