瞭解JavaScript 面向對象基礎 & 原型與對象

来源:http://www.cnblogs.com/JianweiWang/archive/2016/02/24/5207518.html
-Advertisement-
Play Games

面向對象語言中的對象 老是能聽到什麼基於對象, 面向對象. 什麼是對象, 如果有面向對象基礎的人可以無視了, 下麵舉個簡單的例子給大家講講面向對象中, 對象的定義, 這個是比較通用的, 不過對於JS來說不太一樣, 但是理解總是好的. 首先, 先有類型(Class), 這個類是指具有本質相同的一類事物


  面向對象語言中的對象

  老是能聽到什麼基於對象, 面向對象. 什麼是對象, 如果有面向對象基礎的人可以無視了, 下麵舉個簡單的例子給大家講講面向對象中, 對象的定義, 這個是比較通用的, 不過對於JS來說不太一樣, 但是理解總是好的.

  首先, 先有類型(Class), 這個類是指具有本質相同的一類事物, 比如大自然中的, 動物類, 植物類, 岩石類, 他們在根本上面具有本質相同的特性, 類下麵也區分小的類, 比如同是動物類, 動物類裡面也可以有貓類, 狗類, 當然啦, 人類也是一種類, 而在編程中, 類就是這一類東西用代碼體現的一種抽象.

  然後, 就有了對象(Object), 對象就是類中的一個個體, 比如人類中的一個人, 這就是對象, 再舉些例子, 比如貓類中一隻貓, 狗類裡面具體到個體的一隻狗, 都可以理解為對象, 在編程中, 對象就是類抽象出來的一個個體的實例.

  可能上面說的有點晦澀, 但是久了就好理解了, 現在舉點更具體的例子, 老師這一個職業, 算是一類人, 也就是類, 而你最喜歡的那個老師就是這個類的對象, 說白了就是類有種包含關係, 人類裡面可以有男人類, 女人類, 也可以有教師類, 消防員類, 在日後的學習中, 大家也會知道, 這些小的類都可以稱之為人類的子類, 也可以說這些類繼承了人類, 而對象卻不具備這種特性, 它只是某個類抽象到個體之後的單個實例(也就是實際的例子), 比如一位老師, 一個消防員, 這都是對象.

  JS中的對象

  JS中對對象的描述也差不太多, 只是JS是一種基於對象的語言, 並不是完全意義上的面向對象, 想要實現JS的類, 應該是一種使用函數模擬的方式, 所以可以這麼說, JS中有模擬的類, 不存在真實意義上的類. 不過我們這裡不糾結類, 著重講對象.

  上面說的讓大家對對象也有一定理解了, 那麼下麵給大家再加一個新的概念, 那就是屬性, 屬性是一個對象的一些特點, 比如拿人作為一個對象, 那麼人就有名字, 年齡, 身高, 體重這些特點, 這些特點也就是這個人作為一個對象的屬性. 所以現在我們知道了, 一個對象它是具有很多屬性的.

  那麼概念性的東西差不多了, 現在我們開始著重用代碼講對象.

  首先我們先創建出一個對象.

  var person = {

      name : "Jianwei",

      age : 23,

      gender : "male"

    };

  var peron大家都知道, 變數的聲明, 指向了一個對象, 對象的類型如上所示, {}中間用" : "分隔的屬性和屬性值, 通常我個人習慣稱之為鍵值對(key-value), 這裡面創建了一個對象, 這個對象共有三個屬性, name, age, gender, 屬性名, 也就是key, 這個key的類型沒有特殊的限制(可以是值, 可以是字元串, 甚至於可以是另一個對象), 但是會通過toString()方法自動轉化為字元串, 所以可以理解為key最後都會是一個字元串, 而value的類型沒有特殊的限定(可以是值, 可以是字元串, 對象等等). 要註意的是, 屬性是無序的, 所以聲明的時候不需要註意順序之類的.

  對象創建方法

  第一種, 使用{}包含鍵值對的方式創建對象(對象直接量).

  var person = {

      name : "Jianwei",

      age : 23,

      gender : "male"

      profession : {

              compang : "Oricle",

              job : "iOS"

            }          

    };

  第二種, 使用new構造器關鍵字.

  var person = new Object();

  第三種, 使用Object.create()方法創建對象.

  var person = Object.create({

      name : "Jianwei",

      age : 23,

      gender : "male"

 

  });

  前兩個方式比較好理解, 最後的這種方式, 簡單介紹下, Object.create這個方法需要一個對象類型的參數, 創造出的對象的原型指向的就是這個參數, 這個參數是字面量對象, 原型指向的自然是Object.prototype了, 具體使用哪個, 要因地制宜.  

  對象屬性的訪問

  對象的屬性一般通過兩種方式訪問, 最常見的是通過點方法來進行訪問, 也可以通過key索引的方式, 如上的代碼案例.

  var person = {

      name : "Jianwei",

      age : 23,

      gender : "male"

    };

  如果我想要為oerson的name屬性重新賦值, 那麼使用如下語句的實現效果是相同的.

  person.name = "Jianwei Wang";

  person["name"] = "Jianwei Wang";

  對象的原型(prototype)

  這裡我還是用不嚴謹的個人理解來給大家講, 這樣有助於大家理解, 當大家能夠理解我的看法, 再去查看嚴謹的理論, 我相信這樣的學習是更好令人消化的.

  之前我們有講父類和子類, 就比如人類, 和教師類, 人類是教師類的父類(super class), 教師類是人類的子類, 所以人類具有的所有屬性, 教師類都繼承了下來, 比如姓名, 年紀, 教師類也可以有自己新的, 父類所沒有的屬性, 比如教過了多少學生, 帶過多少班級. 所以現在大家先給自己一個這樣的思想, 就是父類的不作特殊修飾的屬性, 子類都可以繼承.

  現在我們再來看JS中的對象, 首先, 有兩種創建對象的方式, 上面說過了, 繼承也簡單的解釋了, 那麼很噁心的知識下麵是, 建議大家用一天的時間來理解.

  每個JS對象(null除外, 其實它本來自己有一個類型的, 但是官方那邊修改之後發現, 大量的瀏覽器都出錯了, 所以當使用typeof的時候, null顯示的類型還是Object類型), 都和另一個對象相關聯, "另一個"對象就是原型.

  通過直接量創建的對象都繼承自Object.prototype(這句代碼其實是對原型對象的引用).

  var person = {

      name : "Jianwei",

      age : 23,

      gender : "male"

    };

  那麼這個person對象繼承的就是Object.prototype, 如果這時候為其添加了一個屬性, 語句如下:

  Object.prototype.hobby = "eat";

  那麼這個時候, 也能夠從person上面訪問到hobby這個屬性, 也可以對hobby進行修改(能否修改會取決於一些條件, 我這段代碼是允許, 後面會講具體的設置方法).

  通過關鍵字new和構造函數調用創建的對象的原型就是構造函數的prototype屬性的值.

  function person(){

      name : "Jianwei",

      age : 23,

      gender : "male"

  };

  var jianweiWang = new person();

  那麼這個jianweiWang對象繼承的就是person.prototype, 如果這時候為其添加了一個屬性, 語句如下:

  person.prototype.hobby = "eat";

  那麼這個時候, 也能夠從jianweiWang上面訪問到hobby這個屬性, 也可以對hobby進行修改(能否修改會取決於一些條件, 我這段代碼是允許, 後面會講具體的設置方法).

  這個繼承關係也可以稱之為原型鏈, jianweiWang繼承的是person.prototype, 再往上繼承的是Object.prototype, 所以如果Object.prototype上的屬性, 幾乎所有的對象都會有.

  所以假如為一個對象的一個屬性賦值, 首先會順著原型鏈向上找, 如果整個原型鏈都沒有, 才會為這個對象添加一個屬性.

  所有的繼承來的屬性並不是實際擁有了, 只是通過原型鏈獲取到了, 複製給了自己一份, 所以假如上面的例子.

  jianweiWang.hobby = "run";

  但是這個時候列印person.prototype.hobby, 結果還是"eat", 因為只是副本變了, 本身並不會變.

  


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

-Advertisement-
Play Games
更多相關文章
  • 實時監控Cat是大眾點評研發並使用的,它由吳其敏團隊開發,在InfoQ說有一些關於Cat的介紹,但一般是理論的介紹,對如何使用說的不多,DEMO也很少,所以還是需要我們自己去研究一下的。 InfoQ上兩個視頻 http://www.infoq.com/cn/presentations/public-
  • 本節目錄 什麼是多租戶 多部署-多資料庫 單部署-多資料庫 單部署-單資料庫 在ABP中的多租戶 啟用多租戶 Host vs Tenant Session Data Filters IMustHaveTenant IMayHaveTenant 保存實體 什麼是多租戶 維基百科:軟體多租戶是1個軟體架
  • OWIN 集成 如果你在應用中使用OWIN,你可以nuget添加Abp.Owin程式集到你的宿主項目中(通常是Web項目),併在Startup文件中調用UseAbp擴展方法.如下: [assembly: OwinStartup(typeof(Startup))] public class Start
  • 本節目錄 配置ABP 配置Module 為模塊創建配置 ABP在模塊啟動的時候提供了配置功能. 配置ABP 在模塊的PreInitialize 方法中做配置.如下: public class SimpleTaskSystemModule : AbpModule { public override v
  • 本節目錄 介紹模塊 生命周期事件 PreInitialize Initialize PostInitialize Shutdown 模塊依賴 自定義模塊方法 介紹模塊 ABP提供基礎設施讓我們創建application,就是創建和組合使用modules. 1個module可以依賴其他的module,
  • 本文只是簡單得實現一下事務的小例子,事務的具體內容,比如事務的等級,事務的具體實現原理等等。。。 菜鳥水平有限,暫時還更不了這個,以後的博客可能會涉及。 如果您看完本博客之後能簡單的實現一個事務,本文目的就達到了。
  • 定義 原型模式:用原型實例指定創建對象的種類,並且通過複製這些原型創建新的對象。 從定義來看,我覺得最重要的一個詞就是 複製 ,所謂原型模式,你可以把它理解成對象的複製粘貼. 適用於比較複雜的對象,比如說你new一個對象,要傳十個參數(A a =new A(1,2,3,4,5,6,7,8,9,0))
  • 一種方法為: function test(str){ var iNum = str.length % 3; var prev = ''; var iNow = 0; var temp = ''; var arr = []; if (iNum != 0){ prev = str.substring(0...
一周排行
    -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.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...