zoukankan      html  css  js  c++  java
  • 继承

    继承很强大,就问你怕不怕

    在网上找到很有趣的一段描述继承关系的文章,好东西大家一起分享
    不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么。简单粗暴点看原型链吧,想点与代码无关的事,比如人、妖以及人妖。

    1)人是人他妈生的,妖是妖他妈生的。人和妖都是对象实例,而人他妈和妖他妈就是原型。原型也是对象,叫原型对象。
    
    2)人他妈和人他爸啪啪啪能生出一堆人宝宝、妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗称造人。
    
    3)人他妈会记录啪啪啪的信息,所以可以通过人他妈找到啪啪啪的信息,也就是说能通过原型对象找到构造函数。
    
    4)人他妈可以生很多宝宝,但这些宝宝只有一个妈妈,这就是原型的唯一性。
    
    5)人他妈也是由人他妈他妈生的,通过人他妈找到人他妈他妈,再通过人他妈他妈找到人他妈他妈……,这个关系叫做原型链。
    
    6)原型链并不是无限的,当你通过人他妈一直往上找,最后发现你会发现人他妈他妈他妈……的他妈都不是人,也就是原型链最终指向null。
    
    7)人他妈生的人会有人的样子,妖他妈生的妖会有妖的丑陋,这叫继承。
    
    8)你继承了你妈的肤色,你妈继承了你妈他妈的肤色,你妈他妈……,这就是原型链的继承。
    
    9)你谈对象了,她妈让你带上房产证去提货,你若没有,那她妈会问你妈有没有,你妈没有那她妈会问你妈她妈有没有……这就是原型链的向上搜索。
    
    10)你会继承你妈的样子,但是你也可以去染发洗剪吹,就是说对象的属性可以自定义,会覆盖继承得到的属性。
    
    11)虽然你洗剪吹了染成黄毛了,但你不能改变你妈的样子,你妈生的弟弟妹妹跟你的黄毛洗剪吹没一点关系,就是说对象实例不能改动原型的属性。
    
    12)但是你家被你玩火烧了的话,那就是说你家你妈家你弟们家都被烧了,这就是原型属性的共享。
    
    13)你妈外号阿珍,邻居大娘都叫你阿珍儿,但你妈头发从飘柔做成了金毛狮王后,隔壁大婶都改口叫你包租仔,这叫原型的动态性。
    
    14)你妈爱美,又跑到韩国整形,整到你妈他妈都认不出来,即使你妈头发换回飘柔了,但隔壁邻居还是叫你金毛狮王子。因为没人认出你妈,整形后的你妈已经回炉再造了,这就是原型的整体重写。

    这才叫真正的大牛,没文化还真不敢玩段子

     

    原型链和原型
    找一个对象的属性,首先从自身查起,如果没有,顺着--proto--一层侧向上查找,直到原型链的顶端,通过某种纽带将对象形成一种继承关系,这种链条式的关系叫做原型链
    1、任何对象都拥有 --proto--隐式属性,一般指向他们的构造函数。
    2、原型链的顶端是Object.prototype,其--proto--为null
    3、所有函数都拥有prototype属性
    4、所有函数都是function实例
    5、原型对象拥有constructor属性,该属性指向函数本身。

    原型继承:让子类的原型等于父类的实例,从而继承父类的多有属性和原型,龙生龙凤生凤。

    构造函数的继承:如果我已经写好了一个函数,恰好,我还要写一个功能和他很类似的函数,这时就可以继承他的属性和方法,这也是面向对象编程的基础。

    比如说我有一个动物的构造函数,还有一个猫的构造函数,我想让猫继承动物的一些方法或者属性

    //动物的构造函数
    function Animal(){
        this.species = "动物";
    }
    
    //猫的构造函数
    function Cat(name,color){
        this.name = name;
        this.color = color;
    }

    我可以这样做

    Cat.prototype = new Animal();
    
    Cat.prototype.constructor = Cat;
    
    var cat1 = new Cat("大毛","黄色");
    
    console.log(cat1.species); // 动物

    深拷贝:两个对象(继承对象和被继承对象)引用的是不同的引用地址,互不影响。
    浅拷贝:两个对象共用一个引用类型,互相影响。

    借用和绑定
    使用call/apply/bind复用对象的方法
    本质是用到了改变this的指向,具体分析一下。
    call和apply产生的作用是完全一样的,第一个都是对象;
    不同点:
    call方法传n个参数,apply传的是数组
    求数组中的最大和最小值

    var arr = [34,5,3,6,54,6,-67,5,7,6,-8,687];
    Math.max.apply(Math, arr);
    Math.max.call(Math, 34,5,3,6,54,6,-67,5,7,6,-8,687);
    Math.min.apply(Math, arr);
    Math.min.call(Math, 34,5,3,6,54,6,-67,5,7,6,-8,687);

     

    var Person = function (name, age) {
        this.name = name;
        this.age = age;
    };
    var Girl = function (name) {
        Person.call(this, name);
    };
    var Boy = function (name, age) {
        Person.apply(this, arguments);
    }
    var g1 = new Girl ('qing');
    var b1 = new Boy('qianlong', 100);

     

    var parent = {
        name:'parent',
        say:function(msg){
            console.log(this.name, msg)
        }
    }
    var child = {
        name:'child'
    }
    // 复用父类的say方法
    parent.say.call(child, 'hello'); //child hello
    parent.say.bind(child, 'world')(); //child world

    ES6的继承方式:使用extends 关键字

    class Parent {
        static name = 'parent'; //静态属性
        work = 'aa'; //实例属性
    }
    class Child extends Parent {
    constructor(age){
        super(age); // 在此必须先调用super(),否则子类实例化时会报错,因为子类没有自己的this对象,而是继承父类的this对象
        this.age = age;
    }
    say(){
        console.log('child say', this.age);
    }

    也就是说

    Es5继承是先创建子类的实例对象this,再向this对象中添加父类的方法
    Es6继承是先创建父类的实例对象this,再用子类构造函数修改this

    推荐文章

    继承与原型链

    阮一峰老师博文——面向对象编程

  • 相关阅读:
    关于云计算的大局观
    定制WPF中的DataGrid控件支持对不同的实体类实现中文标题显示
    优化网站设计(二):使用CDN
    MVVM实践中的Command与CommandParameter的使用
    设计对浏览器更加友好的网站——整合搜索功能(针对Google Chrome)
    使用javascript脚本增强SharePoint Survey(调查)的功能
    学习和自我学习
    你应该如何更好地利用搜索引擎
    使用Project Linker实现多个项目中代码文件的链接
    SharePoint 2010 大局观(1~3)
  • 原文地址:https://www.cnblogs.com/jinzhou/p/9073092.html
Copyright © 2011-2022 走看看