`
lj830723
  • 浏览: 131719 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

Javascript 面向对象之非构造函数的继承(转载)

阅读更多
本文介绍javascript 面向对象编程中的非构造函数的继承,上两篇文章分别介绍了对象的封装和构造函数的继承。
一、javascript 面向对象之封装
二、javascript 面向对象之构造函数的继承
非构造函数的继承,有些抽象,下面会有比较具体的解释。
一、什么是"非构造函数"的继承? 比如,现在有一个对象,叫做"中国人"。
var Chinese = { 
    nation:'中国' 
  }; 还有一个对象,叫做"医生"。
   var Doctor ={ 
    career:'医生' 
  }

   请问怎样才能让"医生"去继承"中国人",也就是说,我怎样才能生成一个"中国医生"的对象?
这里要注意,这两个对象都是普通对象,不是构造函数,无法使用构造函数方法实现"继承"。
二、object()方法。
    json格式的发明人Douglas Crockford,提出了一个object()函数,可以做到这一点。

   function object(o) { 
    function F() {} 
    F.prototype = o; 
    return new F(); 
  }

这个object()函数,其实只做一件事,就是把子对象的prototype属性,指向父对象,从而使得子对象与父对象连在一起。
    使用的时候,第一步先在父对象的基础上,生成子对象:
  
var Doctor = object(Chinese);

然后,再加上子对象本身的属性:
  
Doctor.career = '医生';

这时,子对象已经继承了父对象的属性了。
  
alert(Doctor.nation); //中国

三、浅拷贝。
    除了使用"prototype链"以外,还有另一种思路:把父对象的属性,全部拷贝给子对象,也能实现继承。 下面这个函数,就是在做拷贝:
function extendCopy(p) { 
    var c = {}; 
    for (var i in p) { 
      c = p; 
    } 
    c.uber = p; 
    return c; 
  }

使用的时候,这样写:
var Doctor = extendCopy(Chinese); 
Doctor.career = '医生'; 
alert(Doctor.nation); // 中国

但是,这样的拷贝有一个问题。那就是,如果父对象的属性等于数组或另一个对象,那么实际上,子对象获得的只是一个内存地址,而不是真正拷贝,因此存在父对象被篡改的可能。
请看,现在给Chinese添加一个"出生地"属性,它的值是一个数组。
  
Chinese.birthPlaces = ['北京','上海','香港'];

通过extendCopy()函数,Doctor继承了Chinese。
  
var Doctor = extendCopy(Chinese);

然后,我们为Doctor的"出生地"添加一个城市:
  
Doctor.birthPlaces.push('厦门');

发生了什么事?Chinese的"出生地"也被改掉了!
alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门

alert(Chinese.birthPlaces); //北京, 上海, 香港, 厦门

所以,extendCopy()只是拷贝基本类型的数据,我们把这种拷贝叫做"浅拷贝"。这是早期JQuery实现继承的方式。
四、深拷贝。所谓"深拷贝",就是能够实现真正意义上的数组和对象的拷贝。它的实现并不难,只要递归调用"浅拷贝"就行了。
   function deepCopy(p, c) { 
    var c = c || {}; 
    for (var i in p) { 
      if (typeof p === 'object') { 
        c = (p.constructor === Array) ? [] : {}; 
        deepCopy(p, c); 
      } else { 
         c = p; 
      } 
    } 
    return c; 
  }

使用的时候这样写:
  
var Doctor = deepCopy(Chinese);
现在,给父对象加一个属性,值为数组。然后,在子对象上修改这个属性:
Chinese.birthPlaces = ['北京','上海','香港']; 
Doctor.birthPlaces.push('厦门');

这时,父对象就不会受到影响了。
alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门 
alert(Chinese.birthPlaces); //北京, 上海, 香港

目前,JQuery库使用的就是这种继承方法。

转载自:http://pcat.s23-213.myverydz.com/forum.php?mod=viewthread&tid=750&extra=page%3D7
分享到:
评论

相关推荐

    Javascript面向对象编程(二) 构造函数的继承

    今天要介绍的是,如何生成一个”继承”多个对象的实例。... 构造函数绑定 最简单的方法,大概就是使用call或apply方法,将父对象的构造函数绑定在子对象上,也就是在子对象构造函数中加一行: 代码如下

    JavaScript 原型继承之构造函数继承

    JavaScript 是基于原型的面向对象语言。也就是说,每个实例对象都具有一个原型。对象从该原型中继承属性和方法。这一篇将具体说说构造函数的继承。

    extend:ES5 面向对象编程,构造函数继承的封装

    Extendv1.0.0ES5 面向对象编程,构造函数继承的封装。Install/安装克隆这个项目的源码或者下载压缩文件文件后,引入build文件夹内的 extend.mini.js 即安装完成。[removed][removed]Using/使用例子: // 构造函数1 ...

    Javascript面向对象编程(三) 非构造函数的继承

    一、什么是”非构造函数”的继承? 比如,现在有一个对象,叫做”中国人”。 代码如下: var Chinese = { nation:’中国’ }; 还有一个对象,叫做”医生”。 代码如下: var Doctor ={ career:’医生’ } 请问怎样...

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

     既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考《面向对象JS基础讲解,工厂模式、构造函数模式、原型模式、混合模式、动态原型模式》,接下来讲一般通过那些方法完成...

    JavaScript面向对象程序设计中对象的定义和继承详解

    本文实例讲述了JavaScript面向对象程序设计中对象的定义和继承。分享给大家供大家参考,具体如下: 在面向对象的Javascript编程中,希望代码优雅有高效是非常重要的。javascript中不存在类的概念,只有对象。要想把...

    《javascript设计模式》学习笔记二:Javascript面向对象程序设计继承用法分析

    本文实例讲述了Javascript面向对象程序设计继承用法。分享给大家供大家参考,具体如下: 1.关于继承: 百度百科对继承的解释是:继承是指一个对象直接使用另一对象的属性和方法。 (话说百科对于计算机概念的继承的...

    深入剖析JavaScript面向对象编程

    Javascript 面向对象编程:构造函数的继承 本节主要介绍,如何生成一个”继承”多个对象的实例。 比如,现在有一个”动物”对象的构造函数, function Animal(){ this.species = "动物"; } 还有一个”猫”对象的...

    javascript面向对象三大特征之继承实例详解

    本文实例讲述了javascript面向对象三大特征之继承。分享给大家供大家参考,具体如下: 继承 在JavaScript中的继承的实质就是子代可以拥有父代公开的一些属性和方法,在js编程时,我们一般将相同的属性放到父类中,...

    学习javascript面向对象 javascript实现继承的方式

    1、【原型链继承】实现的本质是重写原型对象,代之以一个新类型的实例。实际上不是SubType的原型的constructor属性被重写了,而是SubType的原型指向了另一个对象——SuperType的原型,而这个原型对象的construtor...

    浅谈JavaScript面向对象–继承

    第一条路是通过构造函数来继承,这可以理解为子类直接复制了父类构造函数的代码,然后按照一定的规矩“粘贴”在自己的构造函数中,为己所用。举个例子:   如果A要继承B的属性,是不是直接把this.name = name复制...

    JavaScript面向对象继承原理与实现方法分析

    本文实例讲述了JavaScript面向对象继承原理与实现方法。分享给大家供大家参考,具体如下: 1、构造函数、原型和实例的关系 构造函数有一个原型属性prototype指向一个原型对象。 原型对象包含一个指向构造函数的指针...

    不用构造函数(Constructor)new关键字也能实现JavaScript的面向对象

    那是因为JavaScript试图去隐藏它传统的面向对象的特性——最终导致了它的双重人格(译者注:作者意思是JavaScript既有面向过程的特征,又有面向对象的特征)。 我认为正是由于JavaScript对象模型的难以理解和使用,...

    JavaScript面向对象之Prototypes和继承

    一、前言 本文翻译自微软的牛人Scott Allen Prototypes and Inheritance in JavaScript ,本文对到底什么是Prototype和为什么通过Prototype能实现继承做了详细的分析和阐述,是理解JS OO 的佳作之一。翻译不好的地方...

    JavaScript面向对象笔记

    无论什么时候,只要创建了一个新函数,就会根据一组特定的规则为该函数创建一个...在默认情况下,所有的原型对象都会自动获得一个constructor(构造函数)属性,这个属性包含一个指向prototype属性所在函数的指针。

    基于JavaScript实现继承机制之构造函数方法对象冒充的使用详解

    我们知道JavaScript是面向对象的脚本语言,那么既然是面向对象,继承一定是必不可少的了。JavaScript的核心是ECMAScript,JavaScript继承机制的实现其实就是ECMAScript继承机制的实现

    浅谈JavaScript中面向对象技术的模拟

    很多初学者刚开始接触的时候不太理解,但是JavaScript这种以原型函数的形式实现面向对象技术,不仅是可行的,而且还为面向对象技术提供了动态继承的功能,本文主要讨论了JavaScript的面向对象技术。 二、原型对象...

Global site tag (gtag.js) - Google Analytics