• JS难点--面向对象(继承)


    继承

    让一个对象拥有另一个对象的属性或者方法,并且自己添加的属性或者方法都不会影响到原来的对象

     

    1、属性继承

    通过call方法调用构造函数继承属性

    2方法继承

    通过for in方法继承原型身上的方法

     

    注意:

    1、继承其它对象的属性的时候,一定要用call去修正一下this的指向

    2、继承其它对象的方法的时候,不能直接赋值,要用for in的方法去赋值,不然会出现对象引用的关系

     

     

    Corder要从Person身上继承属性,对象是复杂数据类型,不能直接复制

    function Person(name,age){
        this.name=name;
        this.age=age;
    }
                
    Person.prototype.say=function(){
        console.log('my name:'+this.name);
    }
                
    var p1=new Person('Jackson');
    function Coder(name, age, job) {
        this.name = name;
        this.age = age;
        //ERROR:    直接调用函数的话,this指向了window,就会有问题
        Person(name,age);
        this.job = job;
    }

    属性继承不可以这样直接调用,this指向不对,需要用call方法或者apply方法改变this指向

    function Coder(name, age, job) {
        this.name = name;
        this.age = age;
        
        //call可以改变this指向,call的第一个参数就是要指向的对象
        Person.call(this, name, age);
        this.job = job;
    }

    方法继承

    Coder.prototype.say=function(){
        console.log('我叫'+this.name);
    }
    
     /*用这种方法复制了一个对象的引用,如果改一个话,两个都会变,而且他们两个的构造函数都会指向同一个构造函数*/

    需要用for in方法来继承

    for(var attr in Person.prototype){
        Coder.prototype[attr]=Person.prototype[attr];
        
    }


    如果需要继承构造函数自身的属性

    for(var attr in Person.prototype){
        if(Person.prototype.hasOwnProperty(attr)){
        Coder.prototype[attr]=Person.prototype[attr];
        }
    }
  • 相关阅读:
    elasticsearch配置小记(转)
    valgrind详解
    elasticsearch2.x优化小结(单节点)
    使 nodejs 代码 在后端运行(forever)
    使 nodejs 代码 在后端运行(nohup)
    Flutter移动电商实战 --(16)切换后页面状态的保持AutomaticKeepAliveClientMixin
    Flutter移动电商实战 --(14)首页_拨打电话操作
    Flutter移动电商实战 --(15)商品推荐区域制作
    Flutter移动电商实战 --(11)首页_屏幕适配方案和制作
    [UI] 精美UI界面欣赏[9]
  • 原文地址:https://www.cnblogs.com/shengnan-2017/p/7671040.html
Copyright © 2020-2023  润新知