javascript原型式继承

之前的文章里有提到过javascript类式继承,那种继承方式极大的方便了其他语言(非javascript)程序员使用javascript来实现继承,但是有缺点,就是建立了一个非必要的构造函数,那这篇文章我们来谈一谈具有javascript自身特色的原型式继承。

我们先来看一看下面的代码:

var Car = {
    color: ‘red‘,
    size: ‘big‘,
    getAttr: function() {
        return this.color
    }
}

var car1 = Object.create(Car)
car1.color = ‘blue‘
car1.brand = ‘BYD‘
console.log(car1.color) //blue
console.log(car1.brand) //BYD
console.log(Car.color) //red
console.log(Car.brand) //undefined

var car2 = Object.create(Car)
car2.getAttr = function() {
    return this.size
}
console.log(car2.getAttr()) //big
console.log(Car.getAttr()) //red
console.log(car1.getAttr()) //blue

上面的代码就是原型式继承最简单的方式,“子类”继承了“父类”的属性,修改“子类”的属性也没有影响到“父类”,“子类”之间也是相安无事互不干扰,完美实现了继承。这样继承的好处就是比类式继承少了一层构造函数

当然create这个方法是es5中出现的,ie6 7 8是不支持的哦,下面是一个兼容的方法,让低版本ie也来实现create。

if (!Object.create) {
    Object.create = function(o) {
        function F() {}
        F.prototype = o
        return new F()
    }
}

上述代码的意思就是,首先声明一个构造函数,该构造函数的原型指向需要继承的对象,最后返回实例化后的构造函数,其实这个函数也很好的诠释了原型式继承的原理,“父类”的属性存在于“子类”的原型上,如果“子类”自己重写了属性或者方法,那就直接用“子类”自身的属性或者方法,并且不会影响到“父类”,如果调用了“子类”没有的属性或者方法,那么由于原型链,我们顺藤摸瓜就找到了“父类”的属性或方法,如果再没有就game over了。

其实两种继承方式大同小异,玩的都是原型链,只是原型式继承更符合javascript的语言特点,类式继承更偏向于“类”的概念。

时间: 2024-11-10 21:28:22

javascript原型式继承的相关文章

JavaScript ----------------- 原型式继承

思想:借助原型可以基于已有的对象创建新对象,同时还不必因此创建自定义类型.为了达到这个目的,看看下面的实现方式 1 function object(o){ 2 function F(){ 3 4 } 5 F.prototype=O; 6 return new F(); 7 }; 在上面的代码段中主要做了哪些事情尼? 创建了一个临时的构造函数,同时把传入参数作为临时构造函数的原型,最后返回一个临时构造函数的实例;从本质上来讲,object 对传入其中的对象执行了一次浅复制: 1 //看实例: fu

JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象JS基础讲解,工厂模式.构造函数模式.原型模式.混合模式.动态原型模式>,接下来讲一般通过那些方法完成JavaScript的继承. 原型链 JavaScript中实现继承最简单的方式就是使用原型链,将子类型的原型指向父类型的实例即可,即“子类型.prototype = new 父类型();”,实现方法如下

javascript中类式继承和原型式继承的实现方法和区别

在所有面向对象的编程中,继承是一个重要的话题.一般说来,在设计类的时候,我们希望能减少重复性的代码,并且尽量弱化对象间的耦合(让一个类继承另一个类可能会导致二者产生强耦合).关于“解耦”是程序设计中另一个重要的话题,本篇重点来看看在javascript如何实现继承. 其它的面向对象程序设计语言都是通过关键字来解决继承的问题(比如extend或inherit等方式).但是javascript中并没有定义这种实现的机制,如果一个类需要继承另一个类,这个继承过程需要程序员自己通过编码来实现. 一.类式

JavaScript中的继承之原型式继承

原型式继承的思想是借用原型可以基于已有的对象创建新对象,同时还不比因此创建自定义类型. 为了达到这个目的,给出如下函数: function object(o){ function F(){} F.prototype = o; return new F(); } 在object()函数内部,先创建一个临时性的构造函数,将传入的对象作为这个构造函数的原型,最后返回这个函数的新实例.说白了,就是对传入的对象执行一个浅复制. function object(o){ function F(){} F.pr

JavaScript之面向对象学九(原型式继承和寄生式继承)

一.原型式继承 该继承模式是由道格拉斯*克罗克福德在2006年提出的实现继承的方法. 模式的基本思路:借助原型可以基于已有的对象创建新的对象,同时还不必因此创建自定义类型. 代码如下: function object(o) { function F() { //定义一个F类型的对象 this.name="111"; } F.prototype=o;//使F的原型对象指向传入对象,也就是说F继承了传入的对象,也相当于用传入的对象重写了F的原型对象 相当于如下代码 /* F.prototy

Javascript继承4:洁净的继承者----原型式继承

//原型式继承 function inheritObj(obj){ //声明一个过渡函数对象 function F(){} //过渡对象的原型继承父对象 F.prototype = obj; //返回过渡对象的一个实例,该实例的原型继承了父对象 return new F(); } /* * 这种方式是对类式继承的一个封装,所以类式继承中存在的缺点这里依然存在 */ var car = { id:1, color:['red'] } var car1 = inheritObj(car); car1

JavaScript之原型式继承&amp;寄生式继承和寄生组合式继承以及优缺点

一.原型式继承 1.这种方法并没有使用严格意义上的构造函数,借助原型可以基于已有的对象创建新的对象 function object(o) { function F() {} F.prototype = o; return new F(); } // 在object()函数内部,先创建一个临时性的构造函数,然后将传入的对象作为这个构造函数原型,最后返回了这个临时类型的一个新实例. // object()本质上对其中传入的对象进行了一次浅复制 // 看如下的例子: var person = { na

[js高手之路]原型式继承与寄生式继承

一.原型式继承本质其实就是个浅拷贝,以一个对象为模板复制出新的对象 1 function object( o ){ 2 var G = function(){}; 3 G.prototype = o; 4 return new G(); 5 } 6 var obj = { 7 name : 'ghostwu', 8 age : 22, 9 show : function(){ 10 return this.name + ',' + this.age; 11 } 12 }; 13 var obj2

原型式继承

原型式继承是道格拉斯·克罗克福德在 2006年写了一篇文章,题为 Prototypal Inheritance in JavaScript (JavaScript 中的原型式继承)中指出的.他给出了一下函数 function object(o){ function f(){} f.prototype = o; return new f(); } 然后再创建一个临时性的构造函数,再讲构造函数传入object()中 这种原型式的继承,必须要有一个对象(person)作为另一个对象的基础,然后再根据需