Class类

Class类

1.class,为什么会有class类
`类`

在 ECMAScript5 中,用通过原型的方式来进行模拟类和继承,但在 ECMAScript6 当中,出现了类(class)和继承(extend).ES6 中有class 语法.值得注意是,这里的 class 不是新的对象继承模型,它只是原型链的语法糖表现形式

extends允许一个子类继承父类

静态属性和实例属性
-   静态属性:直接通过类名就可以访问到,不需要创建类的实例就能访问
-   实例属性:必须先创建类的实例对象,然后,通过实例对象访问
-   说明:由于webpack不识别`static`关键字,需要借助于`babel-loader`来处理ES6语法

```html
class Person {
constructor(name) {
	this.name = name;
	}
	// 静态属性
	static testName="静态属性" 
}
console.log(Person.testName);  //"静态属性"

class Student extends Person{
	constructor(name,age) { //子类的 constructor 函数需要调用 super()函数
	super(name);
this.age = age;
}
showInfo() {
	console.log(this.name, this.age);//Charles 18
	}
}
var stu = new Student("Charles",18);
8.2类不会被提升

​ 类不存在变量提升(hoist),这一点与 ES5 完全不同。

new Foo(); // ReferenceError
class Foo {}

上面代码中,Foo类使用在前,定义在后,这样会报错,因为 ES6 不会把类的声明提升到代码头部。这种规定的原因与下文要提到的继承有关,必须保证子类在父类之后定义。

8.3为什么要有 class 这种东西

a.引入了 Class(类)这个概念,作为对象的模板.通过 class 关键字,可以定义类.基本上,ES6 的 class 可以看作只是一个语法糖,它

的绝大部分功能,ES5 都可以做到

b.新的 class 写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已

8.4this的指向

类的方法内部如果含有this,它默认指向类的实例。但是,必须非常小心,一旦单独使用该方法,很可能报错。

8.5Class 的静态方法

类相当于实例的原型,所有在类中定义的方法,都会被实例继承。如果在一个方法前,加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就称为“静态方法”。

class Foo {
  static classMethod() {
    return 'hello';
  }
}

Foo.classMethod() // 'hello'

var foo = new Foo();
foo.classMethod()
// TypeError: foo.classMethod is not a function

8.6class的继承
entends

栏目
每日精选