Successfully reported this slideshow.
Your SlideShare is downloading. ×

4. 使用物件

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 52 Ad
Advertisement

More Related Content

Slideshows for you (20)

Advertisement

Recently uploaded (20)

4. 使用物件

  1. 1. 4.使用物件 • 學習目標 – 掌握this參考 – 運用物件實字 – 認識物件協定 – 使用符號協定 2
  2. 2. 特性與undefined • 試圖存取物件上不存在的特性時,會傳回 undefined • 請問這個物件存不存在x特性呢? 3
  3. 3. • 「特性名稱不存在」與「特性值被設為 undefined」是兩件不同的事 • 避免將物件的特性值設為undefined • 陣列的索引其實是數字為名稱的特性,空 項目則是連數字特性都不存在 4
  4. 4. • 建議別去修改陣列的length • JavaScript中的API,對陣列空項目的處理 方式並不一致 5
  5. 5. • 更嚴格的檢驗 6
  6. 6. 函式與this • 物件在本質上,就像個特性的集合體 • 函式是一級值,也就可以將函式指定給物 件成為特性 7
  7. 7. 8
  8. 8. 9
  9. 9. • this實際參考的對象,是以呼叫方式而定 10
  10. 10. • 如果函式原本具有參數,可接續在第一個 參數之後 11
  11. 11. • 如果有一組引數,必須在多次呼叫間共用, 就可以使用apply()方法 12
  12. 12. • 改變this參考的對象 13
  13. 13. • 函式實例有個bind()方法,執行結果傳回 新函式 • 新函式的this綁定對象,會固定為呼叫 bind()時指定的物件 14
  14. 14. 15
  15. 15. • 部份函式(Partial function) • 對於一個單純就是函式,不需使用到this 的需求下,建議將this設為undefined 16
  16. 16. 全域物件 • Number、Math、Array等API是作為全域 物件的特性存在 • 在不同的環境中想要取得全域物件,會透 過不同的名稱 • 在Node.js中… 17
  17. 17. • 若呼叫函式時,無法透過.運算、call()、 apply()等方法確定this的對象,在嚴格 模式下this會是undefined 18
  18. 18. 箭號函式與this • 箭號函式在this方面的解析方式,與函式 實字不同 19
  19. 19. • 箭號函式中的this是依當時的語彙 (Lexical)環境來綁定 20
  20. 20. • 箭號函式一旦綁定了this,就不會再改變 21
  21. 21. 物件實字增強 22
  22. 22. 23
  23. 23. 24
  24. 24. • 定義設值方法(Setter)、取值方法 (Getter) 25
  25. 25. 解構(Destructuring) 26
  26. 26. • 只要是可迭代的物件,也就是具有可傳回 迭代器的特性,都可以運用解構 27
  27. 27. 餘集(Rest) 28
  28. 28. • 如果可迭代的元素個數少於變數的數量, 那麼多出來的變數會是undefined • 如果可迭代的元素個數少於變數的數量, 也可以指定變數的預設值 29
  29. 29. • 如果只對某幾個元素有興趣呢? • 如果只對尾端元素有興趣 30
  30. 30. • 實現類似Python風格的變數置換 31
  31. 31. 打散(Spread) 32
  32. 32. • 物件也可以解構 • 變數還可以指定預設值 33
  33. 33. • 解構語法也可以用在函式的參數上… 34
  34. 34. • 在ES9時,物件也可以用餘集語法 • 將物件的特性打散 35
  35. 35. valueOf() • 在需要基本型態的場合時會呼叫,而且必 須傳回基本型態值 • 預設的valueOf()只傳回實例本身 36
  36. 36. 37
  37. 37. • 如果是有點年份的API,例如,早期就存在 的API,必須確認行為是否符合預期 38
  38. 38. • 對於必須取得基本型態字串的場合,可以 定義物件的toString()方法 39
  39. 39. 符號 • 從ES6開始,基本資料型態多了一個符號 (symbol) • 為了建立獨一無二的行為象徵而存在 • 對符號值使用typeof,會傳回'symbol' 40
  40. 40. • 被指定的說明文字,ES10以後可以從 Symbol的description特性取得,而且 會成為toString()方法的傳回字串內容 41
  41. 41. • 全域註冊表 – 要將建立的符號值保存到註冊表,或者從註冊 表取得已建立的符號,可以透過 Symbol.for()函式 • 主要是為了開發者自訂協定而存在,務必 小心謹慎,制定好名稱規範,避免協定衝 突問題 42
  42. 42. • 可以使用Symbol.keyFor()傳回它在全 域符號註冊表中的鍵,也就是符號描述字 串,如果傳回字串就表示已登錄符號 43
  43. 43. 運用標準符號 • 在試圖使用Symbol.for()建立自訂協定 前,應該先看看是否有適用的標準符號 • Symbol.iterator • Symbol.toPrimitive 44
  44. 44. Symbol.iterator • 用於迭代器協定的符號 • 陣列就定義了Symbol.iterator方法 45
  45. 45. 46
  46. 46. 47
  47. 47. • 對於簡單迭代,使用產生器語法方便許多 48
  48. 48. Symbol.toPrimitive • 定義了Symbol.toPrimitive方法的物件, 在需要取得基本型態的情況,會使用 Symbol.toPrimitive方法而不是 valueOf() 49
  49. 49. 50
  50. 50. • 為物件定義特性或方法時,預設是可列舉 的,就算使用符號,也是可列舉的 • 然而符號不會被for..in列舉,不過,使 用in測試的話會是true 51
  51. 51. • 定義設值、取值方法時,對象也可以是 Symbol 52

×