[19] 原生功能 Natives - Symbol、Native Prototypes


keywords:symbol,native prototypes

Symbol

  • symbol() 不是 object 它只是簡單的純量基型值,就算使用一樣的描述值,也保證每一個 symbol 都是獨立唯一的值

      let Sym1 = Symbol("Sym");
    
      let Sym2 = Symbol("Sym");
    
      console.log(Sym1 === Sym2); // returns "false"
    
  • 使用原生建構器的獨特之處在於不能加上 new,這樣做會擲出一個錯誤,並且可以當作物件的特性 ( property )

      let sym = Symbol('hi');
    
      sym; // Symbol(hi)
    
      sym.toString(); // 'Symbol(hi)'
    
      typeof sym; // 'symbol'
    
      let a = {};
    
      a[sym] = 'hello';
    
      a; // {Symbol(hi): "hello"}
    
      Object.getOwnPropertySymbols(a); // [Symbol(hi)]
    

    Object.getOwnPropertySymbols(..) 會檢視物件,並以相當公開的方式接露這些 symbols

  • symbols 實際上不是私有的,用於私有或特殊特性,很有可能是主要的用法。對大多數的開發人員它可能可以取代帶有底線 ( _ ) 前綴的特性名稱,這幾乎一定是一種慣例,帶有底線的特性代表的是『 這是一個私有 / 特殊 / 內部特性,別去動它!』

原生的原型 ( Native Prototypes )

  • 每個內建的原生建構器都有自己的 .prototype 物件:Array.prototype、String.prototype,這些物件含有特殊物件子型別專屬的行為
  • 舉例來說,所有字串物件以及藉由封裝的 string 基型值,都能取用 String.prototype 上被定義為方法的預設行為
  • 依照說明文件上的慣例, String.prototype.XYZ 縮寫為 String#XYZ ,其他的 .prototype 也是如此
  • .prototype 的方法都不會就地修改字串,修改動作會從現有的值建立出一個新的值來

      let a = ' xyz ';
    
      a.indexOf('z'); // 3  空格不算
    
      a.toUpperCase(); //' XYZ ' 
    
      a.trim(); // 'xyz'
    
      a; // ' xyz '
    
  • 雖然是非常糟糕的主意,但其實是能修改這些原生的原型

      Array.isArray(Array.prototype); // true
    
      Array.prototype.push(4,5,6); // 3
    
      Array.prototype; // [4,5,6,constructor: ƒ, concat: ƒ, copyWithin: ƒ, fill: ƒ, find: ƒ, …]
    
      Array.prototype.length; // 3
    
      不過還是重置為空吧,以免碰上怪事
    
      Array.prototype.length = 0;
    
  • 如果有一個簡單的純量基本型別值,像是 'xyz' ,要存取它的 length 特性或某個 String.prototype 方法,JavaScript 會自動封裝該值,將它包裹在對應的物件包裹器中,讓你能夠取用那些特性或方法
#symbol #Native Prototypes
「你所不知道的 JS 」系列書籍閱讀心得,未閱讀前對於 JavaScript 皆是懵懵懂懂,因面試時發現自己很多觀念都不正確不清楚,所以這次一探 JavaScript 的運作方式。 * 系列一開始會先把大方向簡短的整理,之後會以每個項目做詳細的筆記






Related Posts

D3v4 工作坊 - React + D3 繪製 svg 動態路線地圖

D3v4 工作坊 - React + D3 繪製 svg 動態路線地圖

ArvinH
自動化測試 x Puppeteer - 玩偶QA參一咖 Day07

自動化測試 x Puppeteer - 玩偶QA參一咖 Day07

Ratherman
如何在 Windows 打造 Python Web 開發環境入門教學 Part2

如何在 Windows 打造 Python Web 開發環境入門教學 Part2

HappyCoder 自學程式設計學院


Comments