没错,你没有看错,虽然前面说JS是原型继承,但在ES6以后新增了class关键字!!!
不过底层实作仍然是以原型继承方式进行,所以基本上算是一个语法糖。
今天我们就来看一下如何使用吧!
class
首先先来看一个最简单的class例子。
class Person{
constructor(val){
this.age = val;
}
say(){
return“Hi!”;
}
}
var Jason = new Person(29);
Jason instanceof Person;//true
Jason.age;//29
Jason.say();//“Hi!”
在类别(class)中可以明确定义一个建构式函式,会在建立新的Person物件时被呼叫,在类别主体内也能直接新增方法。
当然我们也可以用原本的原型继承来写。
function Person(val){
this.age = val;
}
Person.prototype.say =“HI!”;
var Jason = new Person(29);
但是,要注意如果用类别的话要注意Hoisting的问题!!
var Jason = new Person(29);//ReferenceError: Person is not defined
class Person{
constructor(val){
this.age = val;
}
say(){
return“Hi!”;
}
}
静态方法Static methods
一个类别的静态方法,不需要被实例化就可以被呼叫,不过也无法被实例化的新物件使用,也就是只能类别层级使用(vmwork)。
class Person{
constructor(val){
this.age = val;
}
say(){
return“Hi!”;
}
static evilThink(){
return“I want steal somthing”
}
}
var Jason = new Person(29);
“evilThink”in Jason;//false
Person.evilThink();//“I want steal somthing”
用原型继承可以这样写。
function Person(val){
this.age = val;
}
Person.evilThink = function(){
return“I want steal somthing”
}
Person.prototype.say = function(){
return“HI!”;
}
var Jason = new Person(29);
“evilThink”in Jason;//false
Person.evilThink();//“I want steal somthing”
extends建立子类别
可以用extends建立子类别。
class Person{
constructor(age,weight){
this.age = age;
this.weight = weight;
}
say(){
return“Hi!”;
}
}
class trickyMan extends Person{
say(){
return“R~”
}
}
var Jason = new trickyMan(29,96);
Jason instanceof Person;//true
Jason instanceof trickyMan;//true
Jason.say();//“R~”
用原型继承则是这样写。
function Person(age,weight){
this.age = age;
this.weight = weight;
}
Person.prototype.say = function(){
return“HI!”;
}
function tricky(){}
tricky.prototype.say = function(){
return“R~”;
}
var Jason = new tricky(29);
Jason.say();//“R~”
super呼叫父类别
如果要在子类别呼叫父类别可以用super。
class Person{
constructor(age,weight){
this.age = age;
this.weight = weight;
}
say(){
return“Hi!”;
}
}
class trickyMan extends Person{
say(){
return super.say();
}
}
var Jason = new trickyMan(29,96);
Jason.say();//“HI!”
如果用原型继承来写的话。
function Person(age,weight){
this.age = age;
this.weight = weight;
}
Person.prototype.say = function(){
return“HI!”;
}
function tricky(){}
tricky.prototype.say = function(){
return Person.prototype.say()
}
var Jason = new tricky(29);
Jason.say();//“HI!”
以上就是class的用法,一样如果有错误及来源未附上也欢迎留言指正,那么我们明天见(leafor)。