JS中的面向對象OOP理論基礎

標記語言:javascript

  • HTML5
  • CSS3
  • ...

編程語言:java

  • POP(Procedure Oriented)面向過程程序設計:
    • C語言
    • ...
  • OOP(object Oriented Programming)面向對象程序設計:
    • JAVA
    • PHP
    • PYTHON / GO / RUBY
    • ...
    • JAVASCRIPT / NODE.JS

面向對象程序設計中的三大概念:編程

  • 對象:泛指,JS中咱們操做和研究的事務都是對象
  • 類:把抽象的對象,按照功能特色,進行的詳細劃分,劃分紅爲不少的類別
  • 實例:每一種類別中具體的事務

1、對象

有句話說的好:面向對象編程的世界裏「萬物皆對象」;數組

就好像咱們的大天然同樣,咱們畫圖瞭解一下瀏覽器

對象就像是咱們上圖中的大天然,這裏面的東西是在是太太多了...,咱們就先了解一下就好;編程語言

2、內置類

根據JS中事務的特徵,進行類別劃分,而默認劃分好的類別,就是內置類函數

  • -1).數據類型中的內置類學習

    • Number類:每個數字都是這個類的一個實例
    • String
    • Boolean
    • Null類 / Undefined類(瀏覽器中禁止咱們本身訪問這兩個類)
    • Symbol
    • Object 對象數據類型類:全部的對象數據類型都是這個類的一個實例
      • Object {}普通對象就是它的實例
      • Array數組類 每個數組是Array類的實例也是Object類的實例
      • RegExp正則類
      • Date日期類
      • ...
    • Function類:全部的函數都是這個類的實例
  • -2).DOM元素對象或者DOM元素集合也都有本身的內置類ui

    • ...spa

    • Node 節點類

      • Element 元素標籤類
        • HTMLElement HTML元素標籤類
          • HTMLDivElement 每個DIV元素對象是它的一個實例
          • HTMLAnchorElement每一個A元素對象是它的一個實例
          • 每個元素標籤對象都有一個本身對應的內置類
        • XMLElement
        • ...
      • Text 文本節點類
      • Document 文檔節點類
        • HTMLDocument每個document都是它的一個實例
      • ...
    • HTMLCollection 元素集合類:基於getElementsByTagName等方法獲取到的元素集合都是它的一個實例

    • NodeList 節點集合類

  • ......

JS自己就是按照「面向對象思想(類和實例)」設計出來的語言,因此咱們不管是研究和學習JS,仍是在工做中進行項目開發(組件封裝),也都應該按照面向對象的思想來學習和開發,例如:我想研究數組

3、以研究數組爲例

  • 1.每個數組都是Array這個類的實例,每一個實例都是單獨的一個個體(互相是不衝突的,相似於沒有如出一轍的兩我的,在JS中也基本上沒有徹底同樣的兩個實例[有特殊狀況])
  • 2.咱們拿出某一個實例去分析其特色和結構,那麼Array的其它實例也具有相同的特色和結構
  • 3.數組中有不少瀏覽器內置的方法,這些方法都是類提供給實例的,每個實例都能具有和使用這些方法(前提是當前類的實例才能使用,若是不是它的實例,則不能使用)
let arr1=[12,23];
let arr2=[12,23];
console.log(arr1===arr2); //=>false 不一樣的堆內存地址

// push是Array這個類提供的方法,只要是Array類的實例(數組是它的實例)均可以調用這些方法
let arr = [10, 20];
arr.push(30);
console.log(arr); //=>[10,20,30]

// ARGUMENTS不是Array的實例,不能調它提供的方法
function func() {
	// ARGUMENTS實參集合中存儲了傳遞的實參信息,它是一個類數組(相似於數組的結構,可是它不是數組,不是Array類的實例)
	arguments.push(30); //=>Uncaught TypeError: arguments.push is not a function
	console.log(arguments);
}
func(10, 20);
複製代碼

內置類咱們先簡單瞭解這些;

當咱們須要本身作一些事情的時候,咱們本身基於構造函數,建立的類就是自定義類;

構造函數模式也是咱們JS學習的重點,因此單獨拿出一篇講解,今天的內容到此結束,下一篇內容爲「構造函數建立自定義類」

思惟導圖

相關文章
相關標籤/搜索