学JS的心路历程 - JS的Class
Posted lannyQ_Q
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了学JS的心路历程 - JS的Class相关的知识，希望对你有一定的参考价值。
没错，你没有看错，虽然前面说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)。
以上是关于学JS的心路历程 - JS的Class的主要内容，如果未能解决你的问题，请参考以下文章