ES6--物件導向

標籤：use   執行個體   level   方法   產生   es5   console   prot   OLE   

類

ES5通過建構函式產生執行個體對象

function User(name, pass) {    this.name = name    this.pass = pass}User.prototype.log = function () {    console.log(‘name = ‘ + this.name + ‘, pass = ‘ + this.pass)}var user1 = new User(‘xiaoming‘, ‘12356‘)user1.log()//name = xiaoming, pass = 12356

ES6引入class（類）概念與constructor構造方法。定義“類”的方法時，前面不需要加 function 關鍵字。方法之間不需要逗號分隔，加了會報錯。

class User {    constructor(name, pass) {        this.name = name        this.pass = pass    }    log() {        console.log(`name = ${this.name} , pass = ${this.pass}`)    }}let user1 = new User(‘xiaoming‘, ‘12356‘)user1.log()//name = xiaoming , pass = 12356

繼承

ES5繼承

function VipUser(name, pass, level) {    User.call(this, name, pass)    this.level = level}VipUser.prototype = new User();VipUser.prototype.constructor = VipUserVipUser.prototype.logLevel = function () {    console.log(‘level = ‘ + this.level)}var v1 = new VipUser(‘xiaoming‘, ‘123456‘, ‘5‘)v1.log()v1.logLevel()

ES6繼承（extends和super）

class VipUser extends User {    constructor(name, pass, level) {        super(name, pass)        this.level = level    }    logLevel() {        console.log(`level = ${this.level}`)    }}let v1 = new VipUser(‘xiaoming‘, ‘1234‘, ‘5‘)

 

ES6--物件導向