浅谈原型式继承、借助构造函数、组合方式继承

wangjuntytl 发布于2019-08-26 12:16 / 1329人阅读

摘要：想要解决这样的问题的话，可以借助构造函数也可以叫做伪造对象或经典继承。这种方式实现非常简单，就是在子对象的构造函数中调用父对象的构造函数。

原型式继承

原型式继承，就是一定一个函数，该函数中创建一个临时性的构造函数，将作为参数，传入的对象作为这个构造函数的原型，最后返回这个构造函数的实例对象

/*定义函数：用于实现对象之间的继承
    参数：
    obj：表示继承关系中的父级对象
    prop：对象格式，表示继承关系中的子级对象的属性和方法
*/
function fn(obj,porp){
    //定义一个临时的构造函数
    function Fun(){
       //遍历对象的属性和方法
       for(var attrName in porp){
           this[attrName]=porp[attrName];
       }
    }
    //将函数的参数作为构造函数的原型
    Fun.prototype=obj;
    //将构造函数创建的对象进行返回
    return new Fun();
}
var obj={
    name:"前端"
}
//调用函数
var result=fn(obj,{
    age:20,
    sayMe:function(){
        console.log("this is function");
    }
});
console.log(result.age);
result.sayMe();

利用Object.create()方法实现继承

var obj={
    name:"前端"
}
var newObj=object.create(obj,{
    age:{
        value:20
    },
    sayMe:{
        value:function(){
            console.log("this is function");
        }
    }
});
console.log(newObj.age);
newObj.sayMe();

借助构造函数

无论是原型链还是原型式继承，都具有相同的问题。想要解决这样的问题的话，可以借助构造函数(也可以叫做伪造对象或经典继承)。
这种方式实现非常简单，就是在子对象的构造函数中调用父对象的构造函数。具体可以通过调用apply()和call()方法实现。
apply()和call()方法都允许传递指定某个对象的this。对于继承来讲，可以实现在子对象的构造函数中调用父对象的构造函数时，将子对象的this和父对象的this绑定在一起

//定义父级对象的构造函数
function Parent(){
    this.parent="parent";
}

//定义子级对象的构造函数
function child(){
    //调用父级对象的构造函数：使用apply()或call()方法
    Parent.call(this);
    
    this.child="child";
}
//创建子级对象
var child=new Child();
console.log(child);

组合方式继承

组合继承，也叫做伪经典继承，指的是将原型链或原型式继承和借助构造函数的技术组合在一起，发挥二者长处的一种继承方式
具体实现的思路就是：

使用原型链或原型式继承实现对原型的属性和方法的继承。

通过借助构造函数实现对实例对象的属性的继承

这样，既通过在原型上定义方法实现了函数的重用，又可以保证每个对象都有自己的专有属性

function Parent(){
    //构造函数的自有属性
    this.name="前端";
}
//构造函数的原型属性
Parent.prototype.age=20;

function Child(){
    //继承父级构造函数中的自有属性
    Parent.call(this);
    
    this.job="IT";
}
//继承父级构造函数中的原型属性
Child.prototype=Parent.prototype;

var child=new Child();

console.log(child.job);
console.log(child.age);
console.log(child.name);

云服务器 GPU云服务器继承构造函数构造函数继承原型继承原型链继承

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108365.html

浅谈JavaScript继承

摘要：组合方式实现继承原型链构造函数喵喵喵汪汪汪与的唯一区别是多了这一句组合方式实现了对构造函数内和原型上所有属性和方法的继承，并且的实例对象之间也不会相互干扰。前言关于JavaScript继承相关的定义和方法网上已经有很多解释啦，本菜鸟就不抄抄写写惹人嫌了，本文主要探讨三种基本的继承方式并且给出优化方案。正文借助构造函数实现继承 function Parent1() { ...

Jingbin_ 2019-08-21 16:55 评论0 收藏0
浅谈JavaScript的面向对象和它的封装、继承、多态

摘要：会造成内存浪费的问题构造函数继承声明父类声明子类生成实例组合式继承组合式继承是汲取了两者的优点，既避免了内存浪费，又使得每个实例化的子类互不影响。写在前面既然是浅谈，就不会从原理上深度分析，只是帮助我们更好地理解... 面向对象与面向过程面向对象和面向过程是两种不同的编程思想，刚开始接触编程的时候，我们大都是从面向过程起步的，毕竟像我一样，大家接触的第一门计算机语言大概率都是C语...

MAX_zuo 2019-08-23 14:00 评论0 收藏0
JavaScript继承方式详解

摘要：可以通过构造函数和原型的方式模拟实现类的功能。原型式继承与类式继承类式继承是在子类型构造函数的内部调用超类型的构造函数。寄生式继承这种继承方式是把原型式工厂模式结合起来，目的是为了封装创建的过程。 js继承的概念 js里常用的如下两种继承方式：原型链继承（对象间的继承）类式继承（构造函数间的继承）由于js不像java那样是真正面向对象的语言，js是基于对象的，它没有类的概念。...

Yangyang 2019-08-21 10:23 评论0 收藏0
javascript-继承

摘要：化伪花猫伪，花，猫借助构造函数无论是原型链还是原型式继承，都有相同的问题。要解决这样的问题，可以借助构造函数也可以叫做伪造对象或经典继承。对于继承来讲，可以试想子对象的构造函数中调用父对象的构造函数时，讲子对象的和父对象的绑定在一起。继承原型式继承所谓原型式继承，就是定义一个函数，该函数中创建一个临时性的构造函数，并将作为参数传入的对象作为这个构造函数的原型，最后返回这个构造函数...

kohoh_ 2019-08-26 12:16 评论0 收藏0
浅谈JavaScript面向对象

摘要：不必在构造函数中定义对象实例的信息。其次，按照一切事物皆对象的这饿极本的面向对象的法则来说，类本身并不是一个对象，然而原型方式的构造函数和原型本身也是个对象。第二个问题就是在创建子类型的实例时，不能向超类型的构造函数中传递参数。前言对象(Object)应该算是js中最为重要的部分，也是js中非常难懂晦涩的一部分。更是面试以及框架设计中各出没。写这篇文章，主要参考与JavaScrip...

cyixlq 2019-08-21 17:15 评论0 收藏0