[JavaScriptWeird]No.13 純值

發表於 | 更新於 | 分類於

前言

上一篇提到 JavaScript 是動態型別，會根據我們設定的值自動決定該變數的型別為何， JavaScript 有六種純值(Primitive Types，或稱為基本型別)，讓我們繼續看下去。

純值

純值代表的是一種資料的型別，表示一個值。換句話說這不是一個物件 (名稱 / 值的組合)，而純值也稱為基本型別。

JavaScript 的基本型別 — undefined

在前面的幾篇文章內我們或多或少都有看過它，這是 JavaScript 給所有變數的初始值，這代表這個變數會一直是 undefined 直到給定變數一個值，這也是我們為什麼不應該用 undefined 來設定變數的值，這會很容易讓人混淆「究竟是變數是還未給值或是設定變數為 undefined」

JavaScript 的基本型別 — null

null 表示不存在，如果我們要用來表示一個變數的值為「不存在或是空值」，使用 null 是比使用 undefined 好的。

JavaScript 的基本型別 — Boolean

這個有寫過程式的應該都很熟悉，代表這個變數的值是「真」或是「假」的其中一種可能，在 JavaScript 內直接用 true 或 false 表示。

JavaScript 的基本型別 — Number

在 JavaScript 只有一種數字型態， 所以可以把它想成自動判斷整數或浮點數，不像其他的程式語言，可能有整數型態或者其他特定數值的型態。

JavaScript 的基本型別 — String

由一連串的字符所組成，在 JavaScript 中用單引號或雙引號包覆住，都可以用來表示字串。

JavaScript 的基本型別 — Symbol

Symbol 是 ES6 新增的一個基本型別， Symbol 是一種特殊的、不可變、且獨一無二，可以作為對象屬性的標識符使用。

關於 Symbol 的更多敘述，可參考 這裡

基本的用法大概是這樣的：

  • Symbol 函數可以接受一個字串作為參數
  • Symbol 值不能與其他類型的值進行運算
  • Symbol 值可轉成完全字串，使用 toString() 方法，若有參數也會一同輸出
  • Symbol 值可作為物件中的屬性名，使用中括號[]，能防止此屬性名(關鍵字)被改寫或覆蓋
1
2
3
4
5
6
7
8
9
10
11
12
13
//Symbol 字串用法  
let a = Symbol('name');  
let b = Symbol('name');  
console.log(a === b); //flase

//可轉成字串  
console.log(a.toString()); //Symbol(name)

//作為物件的屬性名稱  
let obj = {  
  [a]:'Tony'  
}  
console.log(obj); // { Symbol(name): "Tony" }

進階用法 & 注意事項：

Symbol 作為屬性名時，該屬性不會出現在 for…in 、 for…of 迴圈迭代中，也不會在 Object.keys() 、 Object.getOwnPropertyNames() 等等之類的方法中被獲取，只有唯一使用 Object.getOwnPropertySymbols() 此方法才能獲取擁有 Symbol 值的屬性名。

另外 Symbol 不可以使用 “new Symbol()“

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
let a = Symbol('name1');  
let b = Symbol('name2');  
const obj = {  
  [a]: 'Tony',  
  [b]: 'John'  
};

for (let key in obj) {  
  console.log(key); // 無輸出  
}

let propertyNames = Object.getOwnPropertyNames(obj);  
console.log(propertyNames); // []

let propertySymbols = Object.getOwnPropertySymbols(obj);  
console.log(propertySymbols); // [ Symbol(name1), Symbol(name2) ]

Symbol.for() & Symbol.keyFor()

  • Symbol.for() : 可以重新使用同一個 Symbol 值，若定義時輸入參數一樣，則 Symbol 值會相等。
  • Symbol.keyFor()：可以取得在使用 Symbol.for() 定義時所輸入的參數值

可以使用這兩個函式方法重複利用資源

1
2
3
4
5
6
7
let a = Symbol.for('name');  
let b = Symbol.for('name');  
console.log(a === b); // true  
console.log(Symbol.keyFor(a)); // 'name';  
// 由於 Symbol() 是沒有登記機制的，所以使用 .keyFor() 會無效  
let c = Symbol('name');  
console.log(Symbol.keyFor(c)); // undefined

0%