ES6系列六：面向对象

ゝ一世哀愁。 2022-02-01 08:15 218阅读 0赞

旧写法  
 类和构造函数一样  
 属性和方法分开写的

// 老版本
    function User(name, pass) {
        this.name = name
        this.pass = pass
    }
    
    User.prototype.showName = function () {
        console.log(this.name)
    }
    User.prototype.showPass = function () {
        console.log(this.pass)
    }
    
    var u1 = new User('able', '1233')
    u1.showName()
    u1.showPass()
    
    
    // 老版本继承
    function VipUser(name, pass, level) {
        User.call(this, name, pass)
        this.level = level
    }
    VipUser.prototype = new User()
    VipUser.prototype.constructor = VipUser
    VipUser.prototype.showLevel = function () {
        console.log(this.level)
    }
    
    var v1 = new VipUser('blue', '1234', 3)
    v1.showName()
    v1.showLevel()

新版面向对象  
 有了 class 关键字、构造器  
 class 里面直接加方法  
 继承，super 超类==父类

// ES6写法
    class User {
        constructor(name, pass) {
            this.name = name
            this.pass = pass
        }
    
        showName() {
            console.log(this.name)
        }
        showPass() {
            console.log(this.pass)
        }
    }
    
    var u1 = new User('able2', '111')
    u1.showName()
    u1.showPass()
    
    
    // ES6继承
    class VipUser extends User {
        constructor(name, pass, level) {
            super(name, pass)
            this.level = level
        }
        showLevel(){
            console.log(this.level)
        }
    }
    
    v1 = new VipUser('blue', '123', 3)
    v1.showLevel()

发表评论取消回复

表情：

评论列表（有 0 条评论，218人围观）

还没有评论，来说两句吧...

相关阅读

相关 ES6面向对象

今天开始,终于进入到了es6的学习了,希望学得越来越多,每天都过得越来越充实.学到的要分享,一起学习才是最好的. 接下来分享一下我所理解的面向对象编程的思想希望对大家有帮助

叁歲伎倆/ 2023年07月11日 06:17/ 0 赞/ 18 阅读

相关 ES6 面向对象封装、继承、多态案例

类 Class 类(Class) : 定义了一切事物的抽象特点对象(Object)：类的实例面向对象(OOP)三大特性：封装、继承、多态封装就是将数据操作的细节隐

浅浅的花香味﹌/ 2022年10月29日 05:25/ 0 赞/ 260 阅读

相关 ES6系列教程第六篇--Class继承

一、extends关键字 ES6中提供了extends关键字实现类的继承，相比较ES5的原型继承，更方便易懂，对于学过java的道友们来说，阅读无障碍，下面我们看下如何实

分手后的思念是犯贱/ 2022年05月22日 05:54/ 0 赞/ 252 阅读

相关 JavaScript——ES5和ES6面向对象编程实现继承

ES5实现继承严格来说，ES5中没有类和继承的概念，但为了方便理解面向对象编程，姑且认为构造函数就是类，本身是一个函数。ES5实现继承有很多种方式，具体可查看《java

约定不等于承诺〃/ 2022年05月19日 02:44/ 0 赞/ 322 阅读

相关 ES6 面向对象编程

目录示例 1 示例 2 示例 3 示例 4 单例模式 -------------------- 示例 1 ![2018111310351261.p

冷不防/ 2022年04月17日 04:39/ 0 赞/ 238 阅读

相关六、ES6规范

ES6规范编程语言JavaScript是ECMAScript的实现和扩展。ECMAScript是由

系统管理员/ 2022年04月02日 20:10/ 0 赞/ 297 阅读

相关 ES6面向对象

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhp

我不是女神ヾ/ 2022年02月04日 02:25/ 0 赞/ 322 阅读

相关 ES6系列六：面向对象

旧写法类和构造函数一样属性和方法分开写的 // 老版本 function User(name, pass) { this.na

ゝ一世哀愁。/ 2022年02月01日 08:15/ 0 赞/ 219 阅读

相关 python(六)面向对象

1.封装 ![543426-20160926014554361-1823464547.png][] 支持多重继承,但如果不需要的时候最好不要使用，避免出现不必要的bug：

谁践踏了优雅/ 2021年12月15日 03:27/ 0 赞/ 412 阅读

相关 ES6--对象

对象字面量属性的简洁表示法： ES6允许对象的属性直接写变量，这时候属性名是变量名，属性值是变量值。 const age = 12; const

布满荆棘的人生/ 2021年08月14日 00:18/ 0 赞/ 420 阅读