继承

作者: 237房间 | 来源:发表于2019-04-25 20:56 被阅读0次
es5 的三种继承方式

一、构造函数继承( 缺点是:原型上的方法或者属性,无法继承)

function Fn(){
    this.name = "zhangsan",
    this.age = 12
    this.eat = function(){
          console.log("eat")
      }
 }
    Fn.prototype.sleep = function(){
          console.log("sleep")
    } // 无法继承
    function F(){
     console.log(this)
     Array.prototype.join.call(obj,'-')  // 上下文模式 call 和 apply
         Array.prototype.join.apply(obj,['-'])
    Fn.call(this)
     }
     var fn = new Fn()
     console.log(fn)
     var f = new F()
    console.log(f.sleep())

二、 原型继承
共用一个原型对象,导致谁修改原型对象的值,其余对象都会被更改

function Fn(){
        this.name = "zhangsan"
        this.age = 12
        this.color = ["yellow", "pink"]
        this.eat = function(){
                console.log("eat")
                 }
         }
         Fn.prototype.sleep=function(){
            console.log("sleep")
        }
        function F(){}
        F.prototype = new Fn()
       var f = new F()
       var f1 = new F()
       f.color.push("black")
       console.log(f1.color)// color=['yellow','pink','black']

三、组合方式

 function Fn(){
            this.name = "zhangsan"
            this.age = 12
            this.color = ["yellow", "pink"]
            this.eat = function(){
                console.log("eat")
            }
        }
        function F(){
             Fn.call(this)  // this指向 Fn()
        }
        F.prototype = Object.create(Fn.prototype)
        // F.prototype = Fn.prototype.constructor === Fn
        F.prototype.constructor = F
        
        var f = new F()
        var f1 = new F()
        f.color.push("black")
        console.log(f1.color) //color =["yellow", "pink"]
        
        function FCC(){}
        console.log(f instanceof FCC)
        console.log(f instanceof Fn)

es6继承

1.通过extends 关键字来继承

2.子类必须在constructor方法中调用super方法,否则新建实例时会报错。这是因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工,如果不调用super方法,子类就得不到this对象。因此,只有调用super之后,才可以使用this关键字。

class People{
            constructor(name,age,skin){
                this.name = name,
                this.age = age
                this.skin = skin
            }
            eat(){
                console.log("eat")
            }
            sleep(){
                console.log("sleep")
            }
            speak(){
                console.log("speak")
            }
        }  
        class Student extends People{
             constructor(name,age,skin,id,classs){
                 super(name,age,skin) 
                 this.id = id
                 this.classs = classs
             }
             study(){
                 console.log("study")
             }
        }
        var stu = new Student("zhangsan",12,"yellow",110,'一年级01班')

相关文章

  • 继承 继承

    属性拷贝 继承不单单能通过原型链实现,也能通过其他方式实现,属性拷贝就是其中一种方法。 通过属性拷贝也能实现继承子...

  • 继承(单继承,多继承)

    将共性的内容放在父类中,子类只需要关注自己特有的内容 python中所有的内容都是对象,所有的对象都直接或间接继承...

  • js继承方式

    类式继承 构造函数继承 组合继承 类式继承 + 构造函数继承 原型式继承 寄生式继承 寄生组合式继承 寄生式继承 ...

  • Python-学习之路-08 OOP -02

    单继承和多继承 单继承:每个类只能继承一个类 多继承:每个类可以继承多个类 单继承的多继承的优缺点 菱形继承/钻石...

  • 原型相关(二)

    1.继承 继承方式:接口继承(只继承方法签名)实现继承(继承实际的方法)ECMAScript只支持实现继承,并且主...

  • 继承

    继承的引入和概述 继承案例和继承的好处 继承的弊端 Java中继承的特点 继承的注意实现和什么时候使用继承 继承中...

  • Java面向对象三大特性之继承

    继承 一、继承的特点 Java只支持单继承单继承 多继承 单继承、多继承优缺点①单继承优点:提高了代码的复用性,让...

  • 7、面向对象的程序设计3(《JS高级》笔记)

    三、继承 许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际方法。由...

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

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

  • js之继承

    文章主讲 JS 继承,包括原型链继承、构造函数继承、组合继承、寄生组合继承、原型式继承、 ES6 继承,以及 多继...

网友评论

      本文标题:继承

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