本文同步自我得博客:http://www.joeray61.com
简介
ES6
的Classes
是在原型链继续的基础上,由言语自身供应的语法糖,并非是一种全新的继续形式。这使得Javascript有一种越发简约清楚的体式格局来完成类的创建和继续。
语法
话不多说,直接上代码。
定义Class
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
继续Class
class Student extends Person {
constructor(name, age, grade) {
super(name, age);
this.grade = grade;
}
}
原型链要领
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
speak() {
console.log('something...');
}
}
speak
就是原型链要领,不需要再烦琐地运用prototype
来定义,直接定义在class
内部即可。
静态要领
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
static getClassName() {
return 'Person';
}
}
console.log(Person.getClassName()); // Person
静态要领直接用类名来挪用就可以了,熟习面向对象编程的同砚应当都不生疏。
Species
某些情况下,类内里有一个要领返回的是类的实例,然则你可以愿望返回父类的示例,这时刻可以运用species pattern
来到达目标。
举个栗子,你完成了一个类叫做MyArray
,继续自Array
,假如你不运用species pattern
,那末挪用map
要领将会返回MyArray
的实例,假如运用了species pattern
则可以返回Array
的实例。
class MyArray extends Array {
static get [Symbol.species]() {
return Array;
}
}
var a = new MyArray(1,2,3);
var mapped = a.map(x => x * x);
console.log(mapped instanceof MyArray); // false
console.log(mapped instanceof Array); // true
Mixin
mixin是类的模板。在EcmaScript中,一个类不能继续多个类。如许有些需求就不是很轻易。为了处理这个题目,可以运用mixin。
var Bar = Sub => class extends Sub {
bar() {}
};
var Baz = Sub => class extends Sub {
baz() {}
};
class Person {
speak() {}
}
class Student extends Bar(Baz(Person)) {}
如许,Student
就可以继续Bar
、Baz
和Person
3个基类了。
特征
提拔
之前运用function
来定义类的时刻,我们可以在定之前先运用new
,因为JS言语的变量提拔特征,如许写不会有任何题目,示例以下:
var joe = new Person('joe', 23);
function Person(name, age) {
this.name = name;
this.age = age;
}
假如运用class
来定义类,则必须在定义后才运用new
来举行对象的实例化,假如先new
则会报错
var joe = new Person('joe', 23); // ReferenceError
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
严厉形式(strict mode)
类声明和类表达式都是在严厉形式下实行的。
类表达式
跟function
一样,class
也可以运用表达式来定义。类表达式可以定名也可以匿名。当类表达式有定名时,该定名仅作为类内部运用。
var Person = class Man {
getName() {
return Man.name;
}
};
var p = new Person();
console.log(p.getName()); // Man
console.log(Man); // ReferenceError: Man is not defined