欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Javascript非構(gòu)造函數(shù)的繼承

 更新時(shí)間:2015年04月27日 11:06:32   投稿:hebedich  
本文給大家介紹的是不使用構(gòu)造函數(shù)實(shí)現(xiàn)"繼承",非常的簡(jiǎn)單,小伙伴們仔細(xì)了解下就可以非常熟悉了。

一、什么是"非構(gòu)造函數(shù)"的繼承?

比如,現(xiàn)在有一個(gè)對(duì)象,叫做"中國(guó)人"。

復(fù)制代碼 代碼如下:

var Chinese = { nation:'中國(guó)' };

還有一個(gè)對(duì)象,叫做"醫(yī)生"。

復(fù)制代碼 代碼如下:

 var Doctor ={ career:'醫(yī)生' }

請(qǐng)問(wèn)怎樣才能讓"醫(yī)生"去繼承"中國(guó)人",也就是說(shuō),我怎樣才能生成一個(gè)"中國(guó)醫(yī)生"的對(duì)象?

這里要注意,這兩個(gè)對(duì)象都是普通對(duì)象,不是構(gòu)造函數(shù),無(wú)法使用構(gòu)造函數(shù)方法實(shí)現(xiàn)"繼承"。

二、object()方法

json格式的發(fā)明人Douglas Crockford,提出了一個(gè)object()函數(shù),可以做到這一點(diǎn)。

function object(o) {

    function F() {}

    F.prototype = o;

    return new F();

  }

這個(gè)object()函數(shù),其實(shí)只做一件事,就是把子對(duì)象的prototype屬性,指向父對(duì)象,從而使得子對(duì)象與父對(duì)象連在一起。

使用的時(shí)候,第一步先在父對(duì)象的基礎(chǔ)上,生成子對(duì)象:

復(fù)制代碼 代碼如下:

  var Doctor = object(Chinese);

然后,再加上子對(duì)象本身的屬性:

復(fù)制代碼 代碼如下:

  Doctor.career = '醫(yī)生';

這時(shí),子對(duì)象已經(jīng)繼承了父對(duì)象的屬性了。

復(fù)制代碼 代碼如下:

  alert(Doctor.nation); //中國(guó)

三、淺拷貝

除了使用"prototype鏈"以外,還有另一種思路:把父對(duì)象的屬性,全部拷貝給子對(duì)象,也能實(shí)現(xiàn)繼承。

下面這個(gè)函數(shù),就是在做拷貝:

  function extendCopy(p) {

    var c = {};

    for (var i in p) {
      c[i] = p[i];
    }

    c.uber = p;

 return c; }

使用的時(shí)候,這樣寫:

復(fù)制代碼 代碼如下:

  var Doctor = extendCopy(Chinese);
  Doctor.career = '醫(yī)生';
  alert(Doctor.nation); // 中國(guó)

但是,這樣的拷貝有一個(gè)問(wèn)題。那就是,如果父對(duì)象的屬性等于數(shù)組或另一個(gè)對(duì)象,那么實(shí)際上,子對(duì)象獲得的只是一個(gè)內(nèi)存地址,而不是真正拷貝,因此存在父對(duì)象被篡改的可能。

請(qǐng)看,現(xiàn)在給Chinese添加一個(gè)"出生地"屬性,它的值是一個(gè)數(shù)組。

復(fù)制代碼 代碼如下:

  Chinese.birthPlaces = ['北京','上海','香港'];

通過(guò)extendCopy()函數(shù),Doctor繼承了Chinese。

復(fù)制代碼 代碼如下:

  var Doctor = extendCopy(Chinese);

然后,我們?yōu)镈octor的"出生地"添加一個(gè)城市:

復(fù)制代碼 代碼如下:

  Doctor.birthPlaces.push('廈門');

發(fā)生了什么事?Chinese的"出生地"也被改掉了!

復(fù)制代碼 代碼如下:

  alert(Doctor.birthPlaces); //北京, 上海, 香港, 廈門
  alert(Chinese.birthPlaces); //北京, 上海, 香港, 廈門

所以,extendCopy()只是拷貝基本類型的數(shù)據(jù),我們把這種拷貝叫做"淺拷貝"。這是早期jQuery實(shí)現(xiàn)繼承的方式。

四、深拷貝

所謂"深拷貝",就是能夠?qū)崿F(xiàn)真正意義上的數(shù)組和對(duì)象的拷貝。它的實(shí)現(xiàn)并不難,只要遞歸調(diào)用"淺拷貝"就行了。

  function deepCopy(p, c) {

    var c = c || {};

    for (var i in p) {

      if (typeof p[i] === 'object') {

        c[i] = (p[i].constructor === Array) ? [] : {};

        deepCopy(p[i], c[i]);

      } else {

         c[i] = p[i];

      }
}

    return c; }

使用的時(shí)候這樣寫:

復(fù)制代碼 代碼如下:

  var Doctor = deepCopy(Chinese);

現(xiàn)在,給父對(duì)象加一個(gè)屬性,值為數(shù)組。然后,在子對(duì)象上修改這個(gè)屬性:

復(fù)制代碼 代碼如下:

  Chinese.birthPlaces = ['北京','上海','香港'];
  Doctor.birthPlaces.push('廈門');

這時(shí),父對(duì)象就不會(huì)受到影響了。

復(fù)制代碼 代碼如下:

  alert(Doctor.birthPlaces); //北京, 上海, 香港, 廈門
  alert(Chinese.birthPlaces); //北京, 上海, 香港

目前,jQuery庫(kù)使用的就是這種繼承方法。

以上所述就是本文的全部?jī)?nèi)容了,希望大家能夠喜歡。

相關(guān)文章

最新評(píng)論