zoukankan      html  css  js  c++  java
  • 昼猫笔记 -- 面向对象(II)

    继承

    由于js不像java那样是真正面向对象的语言,js是基于对象的,它没有类的概念。

    所以,要想实现继承,可以用js的原型prototype机制或者用applycall方法去实现,还有就是js可以通过构造函数和原型的方式模拟实现类的功能。

    另外,js类式继承的实现也是依靠原型链来实现的。


    继承方法

    1. call继承:子类继承父类,将父类的私有属性继承为子类的私有属性
    function Xx() {
        this.name = '小欣欣'
    };
    Xx.prototype.age = 18;
    
    function Zm() {
        this.name = '昼猫'
        Xx.call(this)
    };
    Zm.prototype.age = 13;
    
    var xx = new Xx;
    var zm = new Zm;
    console.log(zm.name); // 小欣欣

    ../img/call继承.png

    1. 原型继承 将父类的私有和共有属性都继承为子类的共有属性
    function Xx() {
       this.name = '小欣欣'
    };
    Xx.prototype.age = 18;
    
    function Zm() {
       this.name = '昼猫'
    };
    Zm.prototype.age = 13;
    
    // 父类的实例赋值给子类的原型
    Zm.prototype = new Xx
    
    var xx = new Xx;
    var zm = new Zm;
    console.log(zm);

    ../img/原型继承.png

    1. 冒充对象继承:将父类私有的和共有的都继承为子类私有的
    function Xx() {
        this.name = '欣欣'
    }
    Xx.prototype.age = 18
    
    function Zm() {
        this.name = '昼猫'
        var temp = new Xx
        for (var key in temp) {
            this[key] = temp[key]
        }
        temp = null;
    }
    Zm.prototype.age = 13;
    
    var xx = new Xx;
    var zm = new Zm;
    console.log(zm.name, zm.age); // 欣欣 18
    console.log(zm.__proto__.age); //13

    ../img/冒充对象继承.png

    1. 混合继承:私有的继承为私有的,共有的和私有的再次继承为私有的

    混合继承是call 和原型继承的结合
    私有的被继承了两次

    function Xx() {
        this.name = '欣欣'
        this.age = '欣欣私有'
    }
    Xx.prototype.age = 18
    
    function Zm() {
        this.name = '昼猫'
        this.age = '昼猫私有'
        Xx.call(this)
    }
    Zm.prototype.age = new Xx;
    
    var xx = new Xx;
    var zm = new Zm;
    console.log(zm.name, zm.age); // 欣欣 欣欣私有

    ../img/混合继承.png

    1. 组合继承:私有的继承为私有的,共有的继承为共有的
    function Xx() {
        this.name = '欣欣'
        this.age = '欣欣私有:10'
    }
    Xx.prototype.age = 18
    
    function Zm() {
        this.name = '昼猫'
        this.age = '昼猫私有:10'
        Xx.call(this)
    }
    // Zm.prototype.age = 13;
    Zm.prototype = Object.create(Xx.prototype)
    var xx = new Xx;
    var zm = new Zm;
    console.log(zm.name, zm.age); // 欣欣 欣欣私有:10
    console.log(zm.__proto__.age); // 18

    ../img/组合继承.png

    1. 中间类继承
    function fn() {
        console.log(arguments);
        arguments.__proto__ = Array.prototype
        arguments.shift()
    }
    fn(1, 2, 3)

    ../img/中间类继承.png

    arguments 不是一个数组,没有 Array 的自带的方法,可以通过这种方法,将arguments的原型执行 Array 内置类的原型


    克隆

    var obj = {
        name: '小欣欣',
        age: 16
    }

    注意:这种方式不是克隆只是把obj的内存地址 简单的赋值(内存地址)

    for in 克隆

    注意:不管是共有的还是私有的都将克隆为私有的

    var obj = {
        name: '昼猫',
        age: '12'
    }
    var obj2 = {}
    for (const key in obj) {
        obj2[key] = obj[key]
    }
    console.log(obj2); //{name: '昼猫', age: '12'}

    Object.create() JS提供的一种克隆方式,将obj的所有属性克隆到obj2的原型上

    var obj = {
        name: '小欣欣',
        age: 16
    }
    var obj2 = Object.create(obj)

    如果需要添加私有的属性,需要在第二个参数添加 value 值(否则会报错,’不是一个对象‘)

    var obj = {
        name: '小欣欣',
        age: 16
    }
    var obj2 = Object.create(obj, {name: {value: '昼猫'}})

    文章来自 个人公众号 昼猫笔记

  • 相关阅读:
    心跳
    UITableView 总结(一)
    scrollView的contentSize,contentInsert,contentOffset
    如何跟踪论文的作者?
    hadoop与spark执行定时任务,linux执行定时任务
    java.lang.NoSuchMethodError问题处理
    数据挖掘与机器学习的相关理解
    HBASE
    腾讯云ping不通外网
    腾讯云,激活ubuntu root登录,设置ssh
  • 原文地址:https://www.cnblogs.com/zhoumao/p/10265363.html
Copyright © 2011-2022 走看看