(一)關於面向對象----繼承

来源:http://www.cnblogs.com/Brookeshan/archive/2016/11/22/6091467.html
-Advertisement-
Play Games

接觸面向對象許久了,對於繼承這一塊也確實琢磨了一段時間,搜集各種資料和網站,也未能得到使自己滿意的,並能快速理解的繼承知識,於是對他們歸類,並得出自己的總結。 先說說繼承是什麼吧?也許我們最早接觸有關繼承的應該是“遺產”??也許電視劇看多了,總有家族為了這玩意兒整的你死我活,確實聽看不下去的哈,但是 ...


接觸面向對象許久了,對於繼承這一塊也確實琢磨了一段時間,搜集各種資料和網站,也未能得到使自己滿意的,並能快速理解的繼承知識,於是對他們歸類,並得出自己的總結。

  先說說繼承是什麼吧?也許我們最早接觸有關繼承的應該是“遺產”??也許電視劇看多了,總有家族為了這玩意兒整的你死我活,確實聽看不下去的哈,但是對於咱大JS而言,可就變得十分和藹,可親。畢竟沒有人來爭奪,也不會有任何事故,最多來些許bug等等。廢話不多說,進入正題!!

1、擴展原型對象繼承:往原型對象中添加新的屬性。

  這應該是最基礎的繼承了吧,往對象中添加新的屬性和方法,實例就可以共用了。

直接上例子:

    function Person(){  };

    Person.prototype.say = function(){};

    var p1 = new Person();

    ====》此時,p1就含有say()這個方法了;

2、替換原型對象繼承:需要給實例添加很多方法,一個一個往預設的原型對象中進行擴展會很麻煩,此時我們就可以把預設的原型對象替換掉,一起添加。

  例子:

     function Bird(){};

    Bird.prototype.say = function(){};

     Bird.prototype={

        constructor:Bird,

        c1:function(){},

        c2:function(){},

        c3:function(){}

    };//新的原型對象

    var maque = new Bird();

    console.log(maque);

    console.log(maque.constructor);

    //通過控制台輸出,你會發現原來的say方法不存在了,取而代之的是新的c1、c2、c3方法

  

3、混入繼承:將一個對象的功能(屬性、方法)拷貝到另一個對象中。

  var o = {name:"王五",age:30};

  var o2 = {gender:"男"};

  //遍歷o的功能,將這些功能添加到o2中去

    for(var key in o) {

      o2[key] = o[key];

    }

  console.log(o2);

4、原型+混入繼承

  function Man(){};

  //這裡將上述的混入繼承封裝成了一個函數如下:

  function extend(target, source) {

    for(var key in source) {

      var value = source[key];

      target[key] = value;

    }

    return value;

 }

  //往Man的原型中擴展多個方法(同一對象),調用上述方法。

  extend(Man.prototype, {

    age:function(){},

    height:function(){},

    nation:function(){}

});

    var hMan = new Man();

    console.log(hMan.age());

5、原型鏈繼承:創建一個對象,讓這個對象繼承自另一個對象

    //想要創建一個對象,就需要一個媒介(構造函數);

    function F(){};

    var o2 = {age:30};

    //設置原型對象

    F.prototype=o2;

    var o1 = new F();

//封裝一下就是如下這個樣子

    function create(o2) {

      function F(){};

      //設置原型對象

      F.prototype = o2;

      //返回創建的新對象

      return new F();

    }

    

6、原型鏈繼承:任何對象都是繼承自原型對象,原型對象也有他自己的原型對象。(學好原型鏈)

7、借用構造函數繼承:在子類構造函數的內部調用超類型構造函數,可以通過apply()和call()方法,在新創建的對象上執行構造函數。

  function SuperType() {

    this.colors = { "red", "blue","green"};

  }

  function SubType(){

    //繼承了SuperType

    SuperType.call(this);

  }

  var instance1 = new SubType();

  instance1.colors.push("black");

  console.log(instance1.colors); //red,blue,green,black

 

  var instance2 = new SubType();

  console.log(instance2.colors);//red,blue,green

 

 

 

 

 

 

 

 

 

    


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • width: 是必須的,因為寬度需要固定它才知道那些文字是超出了範圍 你會覺得這樣的話那怎麼看全部的文字呢?你可以在元素上設置title屬性,讓title來顯示整個文字, 但是我感覺有一個問題就是title反應好慢 感覺用戶體驗不好 ...
  • 正則表達式: 匹配: (1)、直接匹配功能變數名稱地址: (2)、匹配鏈接含(*.htm,*.html,*.php,*.aspx...)尾碼的地址: (3)、匹配含參數的地址: 使用說明: (1)、地址必須以http/https/ftp/ftps開頭; (2)、地址不能包含雙位元組符號或非鏈接特殊字元。 ...
  • 初學時先這樣引入 來一段 easy code 這樣msg內的內容就會渲染到頁面中。 待續。。。 ...
  • css基本知識框架:(一:基本知識縮影。二基本知識框架圖) 1.css樣式表的基本概念 2.樣式表基本類型 1.內嵌樣式 2.內聯樣式3.鏈入外部樣式表4.導入外部?式 3.樣式表配置方法 4.字體屬性 1.font-family 2.font-size(四種尺寸方式:絕對尺寸(xx-small。。 ...
  • 經常用到的圖片插件演示jQuery十種不同的切換圖片列表動畫效果 線上演示 下載地址 實例代碼 <!DOCTYPE html> <html lang="en" class="no-js"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA- ...
  • 哈哈,今天突然興起,想了想自己對ajax的瞭解,來這裡敘述下。心情好,嘿嘿嘿 ajax是一種創建互動式網頁應用的網頁開發技術。就是在不重新載入頁面的情況下,更新部分網頁。 ajax原理:ajax就是相當於在用戶和伺服器之間加了一個中間層,是用戶操作與伺服器操作相應非同步化。並不是所有的用戶請求都提交給 ...
  • 本文同時發佈在本人個人博客上www.yaoxiaowen.com 這段時間在學習前端,並仿著我們公司官網的設計 tongshai.net, 把官網重新實現了一遍。 主要是因為我們公司的官網設計很簡單(就幾個靜態頁面,連什麼控制項都沒用),很適合作為練手項目, 模仿的工程放在了我的另一個測試伺服器上。  ...
  • <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #table { width: 400px; border-collapse: collapse; } </sty ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...