在学习ES6 class类之前,先看下传统生成实例对象的方法(构造函数)。
function Person(name, age){
this.name = name;
this.age = age;
this.intr = function(){
console.log(name + ' is ' + age + ' years old');
}
}
var p = new Person('jack', 20);
p.intr();//jack is 20 years old
上面这种写法与面向对象差异很大,在ES6中,引入了class(类)这个概念,让对象原型的写法更加清晰、更像面向对象编程的语法。
class Person{
constructor(name, age){
this.name = name;
this.age = age;
}
intr(){
console.log(this.name + ' is ' + this.age + ' years old');
}
}
var p = new Person('jack', 20);
p.intr();
在用法上,与ES5的构造函数基本一致,也是使用new关键字创建实例对象。
类的所有方法都定义在类的prototype属性上面
class Person{
constructor(){
// ...
}
intr(){
//...
}
}
// 等同于
Person.prototype = {
constructor(){},
intr(){}
};
在类的实例上面调用方法,其实就是调用原型上的方法。
类的内部,默认就是严格模式,所以不需要使用use strict指定运行模式。
类不存在变量提升,这一点与 ES5 完全不同。
静态属性
静态属性指的是 class 本身的属性,即class.propName,而不是定义在实例对象(this)上的属性。
class xiangqi{
constructor(name){
this.name = name;
}
static width = 50;
static height = 50;
intr(){
console.log(this.name + '的大小' + xiangqi.width + ',' + xiangqi.height);
}
}
var horse = new xiangqi('马');
horse.intr();//马的大小50,50
写法是在实例属性的前面,加上static关键字。
静态方法
如果在一个方法前,加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就称为“静态方法”。
class Person{
constructor(name, age){
this.name = name;
this.age = age;
}
static intr(){
console.log(this.name + ' is ' + this.age + ' years old');
}
}
Person.intr();//Person is undefined years old
var p = new Person('jack', 20);
p.intr();//报错
Person类的intr方法前有static关键字,表示该方法是静态方法,可以在Person类上调用。如果在Person类的实例上调用,就会报错,表示没有该方法。