Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

of

5. 建構式、原型與類別 Slide 1 5. 建構式、原型與類別 Slide 2 5. 建構式、原型與類別 Slide 3 5. 建構式、原型與類別 Slide 4 5. 建構式、原型與類別 Slide 5 5. 建構式、原型與類別 Slide 6 5. 建構式、原型與類別 Slide 7 5. 建構式、原型與類別 Slide 8 5. 建構式、原型與類別 Slide 9 5. 建構式、原型與類別 Slide 10 5. 建構式、原型與類別 Slide 11 5. 建構式、原型與類別 Slide 12 5. 建構式、原型與類別 Slide 13 5. 建構式、原型與類別 Slide 14 5. 建構式、原型與類別 Slide 15 5. 建構式、原型與類別 Slide 16 5. 建構式、原型與類別 Slide 17 5. 建構式、原型與類別 Slide 18 5. 建構式、原型與類別 Slide 19 5. 建構式、原型與類別 Slide 20 5. 建構式、原型與類別 Slide 21 5. 建構式、原型與類別 Slide 22 5. 建構式、原型與類別 Slide 23 5. 建構式、原型與類別 Slide 24 5. 建構式、原型與類別 Slide 25 5. 建構式、原型與類別 Slide 26 5. 建構式、原型與類別 Slide 27 5. 建構式、原型與類別 Slide 28 5. 建構式、原型與類別 Slide 29 5. 建構式、原型與類別 Slide 30 5. 建構式、原型與類別 Slide 31 5. 建構式、原型與類別 Slide 32 5. 建構式、原型與類別 Slide 33 5. 建構式、原型與類別 Slide 34 5. 建構式、原型與類別 Slide 35 5. 建構式、原型與類別 Slide 36 5. 建構式、原型與類別 Slide 37 5. 建構式、原型與類別 Slide 38 5. 建構式、原型與類別 Slide 39 5. 建構式、原型與類別 Slide 40 5. 建構式、原型與類別 Slide 41 5. 建構式、原型與類別 Slide 42 5. 建構式、原型與類別 Slide 43 5. 建構式、原型與類別 Slide 44 5. 建構式、原型與類別 Slide 45 5. 建構式、原型與類別 Slide 46 5. 建構式、原型與類別 Slide 47 5. 建構式、原型與類別 Slide 48 5. 建構式、原型與類別 Slide 49 5. 建構式、原型與類別 Slide 50 5. 建構式、原型與類別 Slide 51 5. 建構式、原型與類別 Slide 52 5. 建構式、原型與類別 Slide 53 5. 建構式、原型與類別 Slide 54 5. 建構式、原型與類別 Slide 55 5. 建構式、原型與類別 Slide 56 5. 建構式、原型與類別 Slide 57 5. 建構式、原型與類別 Slide 58 5. 建構式、原型與類別 Slide 59 5. 建構式、原型與類別 Slide 60 5. 建構式、原型與類別 Slide 61
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

0 Likes

Share

Download to read offline

5. 建構式、原型與類別

Download to read offline

認識建構式之作用
理解原型鏈機制
區別原型與類別典範
善用類別語法

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

5. 建構式、原型與類別

  1. 1. 5.建構式、原型與類別 • 學習目標 – 認識建構式之作用 – 理解原型鏈機制 – 區別原型與類別典範 – 善用類別語法 2
  2. 2. 封裝物件建構流程 3
  3. 3. 4
  4. 4. 定義建構式 5
  5. 5. 6
  6. 6. • 如果建構式使用return指定了傳回值,該 傳回值就會被當作建構的結果 7
  7. 7. • 有些函式既可以當作建構式,也可以作為 一般函式呼叫 • ES6新增了new.target 8
  8. 8. 模擬static • Math.PI • Number.MIN_SAFE_INTEGER • Number.isSafeInteger() 9
  9. 9. 私有性模擬 10
  10. 10. 11
  11. 11. 12
  12. 12. 特性描述器 • 從ES5開始,每個特性都會有四個屬性 – value – writable – enumerable – configurable 13
  13. 13. • Object.getOwnPropertyDescriptor ()傳回的物件只是描述 14
  14. 14. • 若某屬性未曾設定過,那麼預設是false 15
  15. 15. • 陣列的length無法列舉 • 直接對物件新增特性,writable、 enumerable、configurable預設是 true • 當特性本身其實是個方法時,也會被 for..in列舉 16
  16. 16. 17
  17. 17. 不可變動的陣列 18
  18. 18. 19
  19. 19. 擴充、彌封、凍結 • Object.preventExtensions() • Object.isExtensible() • Object.seal() • Object.freeze() 20
  20. 20. 建構式與prototype • 每個函式實例都會有個prototype特性, 基本上是Object的實例 • 不過prototype物件的constructor特 性會參考函式本身 21
  21. 21. • 使用new建構的物件,會有個__proto__ 特性參考至建構式的prototype特性 22
  22. 22. • 存取物件的特性時,會先在實例本身尋找, 如果有就使用 • 沒有的話,就會看看實例的原型物件上有 沒有該特性 • 各個實例間共用的特性,可以定義在建構 式的prototype 23
  23. 23. 24
  24. 24. 25
  25. 25. • 如果要在原型上新增特性,建議將特性設 為不可列舉 26
  26. 26. 27
  27. 27. • 想要知道實例本身是否擁有某個特性,可 以透過hasOwnProperty()方法 28
  28. 28. 29
  29. 29. 30
  30. 30. • 可以將類陣列變得更像是陣列 • 終究不是陣列 • instanceof用來確認物件是否為某建構 式的實例,某些程度上並不可靠 31
  31. 31. • 想要確認某個建構式的prototype,是否 為某實例的原型 32
  32. 32. • 如果不想要修改__proto__來指定原型 33
  33. 33. • Object.create()函式會建立新物件, 物件的原型將被設為指定的原型物件 34
  34. 34. 原型鏈 • 存取物件的特性時,會先在實例本身尋找 • 看看實例的原型物件上有沒有該特性 • 看看原型物件的原型物件有沒有該特性 • 持續到Object.prototype為止, 35
  35. 35. • JavaScript被稱為基於原型(Prototype- based)的物件導向語言 • ES6以後提供了模擬類別的語法,然而,這 並不改變JavaScript基於原型的本質 36
  36. 36. 37
  37. 37. 基於原型的繼承 38
  38. 38. 39
  39. 39. 40
  40. 40. 41
  41. 41. 42
  42. 42. 重新定義方法 • 如果想寫個drawFight()函式… • 在多數的情況下,檢查型態而給予不同的 流程行為,對於程式的維護性有著不良的 影響,應該避免 43
  43. 43. • 單純地定義toString()? 44
  44. 44. 45
  45. 45. 46
  46. 46. 47
  47. 47. 定義類別 • 本質上JavaScript仍是基於原型的物件導向 • ES6的類別語法,主要是提供標準化的類別 模擬,透過語法蜜糖令程式碼變得簡潔 48
  48. 48. 49
  49. 49. • 使用class定義的Account只能使用new 來建立實例 • 直接以函式的呼叫方式,會發生 TypeError 50
  50. 50. 定義方法 51
  51. 51. 52
  52. 52. • 類別上定義的設值、取值方法預設是不可 列舉 53
  53. 53. 54
  54. 54. • 若方法前加上static,那麼該方法會是個 靜態方法 55
  55. 55. • 在類別的static方法中若出現this,代 表的是類別本身 56
  56. 56. 實作繼承 57
  57. 57. • 類別語法的繼承,能夠繼承標準API,而且 內部實作特性以及特殊行為也會被繼承 • 例如,可以繼承Array,子型態實例的 length行為,能隨著元素數量自動調整 58
  58. 58. • 如果沒有使用constructor定義建構式, 會自動建立預設建構式,並自動呼叫 super() • 要明確地使用super()來呼叫父類建構式, 不然new時會引發錯誤 59
  59. 59. 60
  60. 60. super與extends • 如果對原型夠瞭解,是可以來玩玩一些試 驗,接下來的內容純綷是探討,若不感興 趣,可以直接跳過,不會影響後續章節的 內容理解。 61

認識建構式之作用 理解原型鏈機制 區別原型與類別典範 善用類別語法

Views

Total views

169

On Slideshare

0

From embeds

0

Number of embeds

0

Actions

Downloads

21

Shares

0

Comments

0

Likes

0

×