美文网首页
JavaScript类的继承

JavaScript类的继承

作者: 鐘濤 | 来源:发表于2017-08-11 02:56 被阅读0次
        //  superclass 父类
        function Person(first, last) {
            this.first = first
            this.last = last
        }

        Person.prototype = {
            fullName: function() {
                console.log(this.first + ',' + this.last)
            },
            fullNameReversed: function() {
                console.log(this.first + this.last)
            },
            sayHello: function(str) {
                alert(str)
            },
        }

        //  subclass  子类
        function cuteGirl(args) {
            Person.apply(this, args)
            //    把父类Person的this绑定到当前子类cuteGirl下
        }

        //  subclass extends superclass  子类继承父类
        cuteGirl.prototype = Object.create(Person.prototype)
        //  新建了一个对象,参数Person.prototype是新创建的对象的原型
        cuteGirl.prototype.constructor = cuteGirl
        //  修正cuteGirl的构造器,因为上面改动了cuteGirl.prototype

        var xiaohong = new cuteGirl(['xiao', 'hong'])

        xiaohong.sayHello('hhh')  //    一个弹窗
        xiaohong.fullName()  //    xiao,hong
        xiaohong.fullNameReversed()  //    xiaohong
        //  superclass
        function Person (first, last) {
            this.first = first
            this.last = last
        }

        Person.prototype = {
            fullName:function() {
                console.log(this.first + ',' + this.last)
            },
            fullNameReversed:function() {
                console.log(this.first + this.last)
            },
            sayHello:function (str) {
                alert(str)
            },
        }

        function Girl (sex) {
            this.sex = sex
        }

        Girl.prototype = {
            saySex:function () {
                console.log(this.sex)
            }
        }


        //  subclass
        function cuteGirl (args, sex) {
            Person.apply(this, args)
            Girl.call(this, sex)
        }

        //  subclass extends superclass
        // cuteGirl.prototype = Object.create(Person.prototype)
        Object.assign(cuteGirl.prototype, Person.prototype, Girl.prototype)
        cuteGirl.prototype.constructor = cuteGirl

        var xiaohong = new cuteGirl(['xiao','hong'], '妹子')

        xiaohong.sayHello('hhh')        //  一个弹窗
        xiaohong.fullName()             //  xiao,hong
        xiaohong.fullNameReversed()     //  xiaohong
        xiaohong.saySex()               //  妹子

Object.assign() 方法用于将所有可枚举的属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。
Object.assign(target, ...sources)
两个参数,第一个为目标对象,后面的为源对象,该方法的返回值是目标对象。
Object.assign(cuteGirl.prototype, Person.prototype, Girl.prototype) 这一句代码的作用就是把Person和Girl的原型都加到cuteGirl上面去。

还有其实第一种单继承可以不使用cuteGirl.prototype = Object.create(Person.prototype)直接用cuteGirl.prototype = Person.prototype)也可以实现我们想要的效果。

相关文章

  • JavaScript - 继承和类

    JavaScript - 继承和类 在这一篇中,我要聊聊 JavaScript 中的继承和“类”。 首先跟你请教下...

  • javascript 类继承

    1.面向过程与面向对象 1.1面向过程 面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,...

  • JavaScript类的继承

    Object.create() 实现单继承 Object.assign() 实现多继承 Object.assign...

  • 5. oop继承

    JavaScript 继承实现方式 A. 类式继承 所谓类式继承,就是将子类的原型指向父类的一个实例。这样优缺点就...

  • 继承

    继承:让子类拥有父类的属性和方法//继承是类与类之间的关系谈继承是一个悖论:JavaScript是函数编程流派,是...

  • JS 继承

    1.原型链继承:prototype 2.原型链继承2:prototype 注意:JavaScript的类继承其实本...

  • 【重学前端】JavaScript中的继承

    JavaScript中继承主要分为六种:类式继承(原型链继承)、构造函数继承、组合继承、原型式继承、寄生式继承、寄...

  • JavaScript-原型

    JavaScript 不包含传统的类继承模型, 是唯一一个被广泛使用的基于原型继承的语言.类继承只需要继承即可,J...

  • JavaScript类与继承

    一、ECMAScript 5标准中的类 1、定义原型类 2、原型类继承 下面是一典型的关于原型继承的代码。 3、静...

  • JavaScript类和继承

    ES5之前:function Person(){ this.name = 'mia';}Person.protot...

网友评论

      本文标题:JavaScript类的继承

      本文链接:https://www.haomeiwen.com/subject/xrakrxtx.html