【 JavaScript 】JavaScript 型別轉換整理

1. JavaScript 型別轉換 – 字串轉換數字

1.1 Number(string)

console.log(Number("3.45"))
// 3.45
console.log(Number("345"))
// 345
console.log(Number("3a5"))
// NaN
console.log(Number("abc"))
// NaN
console.log(Number(undefined)) 
// NaN
console.log(Number(null))
// 0
console.log(Number(true))
// 1
console.log(Number(false))
// 0

1.2 +(string) 一元運算符

console.log(+("3.45"))
// 3.45
console.log(+("345"))
// 345
console.log(+("3a5"))
// NaN
console.log(+("abc"))
// NaN
console.log(+(undefined)) 
// NaN
console.log(+(null))
// 0
console.log(+(true))
// 1
console.log(+(false))
// 0

1.3 parseInt(string, radix)

parseInt 函數中，第一個變數放的是待轉換字串，第二個變數則是幾進位，建議第二個建議要指定進位，才不會讓人混淆。
parseInt 會將字串轉換為數字，並無條件捨去取整數。根據MDN的說明：若是解析字串的過程中碰上了無法被 radix 指定的進位制所轉換的字元，它會忽略該字元、以及其後所有字元，並只回傳至該位置為止的解析數值結果。
若整段字串都無數字，則會回傳 NaN 。

console.log(parseInt("3.45"))
// 3
console.log(parseInt("345", 10))
// 345
console.log(parseInt("3a5", 10))
// 3
console.log(parseInt("abc", 10))
// NaN
console.log(parseInt(undefined)) 
// NaN
console.log(parseInt(null))
// NaN
console.log(parseInt(true))
// NaN
console.log(parseInt(false))
// NaN

1.4 parseFloat(string)

parseFloat 會將字串轉換為浮點數。

console.log(parseFloat("3.45"))
// 3.45
console.log(parseFloat("345"))
// 345
console.log(parseFloat("3a5"))
// 3
console.log(parseFloat("abc"))
// NaN
console.log(parseFloat(undefined)) 
// NaN
console.log(parseFloat(null))
// NaN
console.log(parseFloat(true))
// NaN
console.log(parseFloat(false))
// NaN

1.5 JSON.parse(string)

使用 JSON.parse(string) 方法要注意，若是 string 包含無法解析為數字的字串，則會出錯。

console.log(JSON.parse("3.45"))
// 3.45
console.log(JSON.parse("345"))
// 345
console.log(JSON.parse("3a5"))
// SyntaxError: Unexpected token a in JSON at position 1
console.log(JSON.parse("abc"))
// SyntaxError: Unexpected token a in JSON at position 0

2. JavaScript 型別轉換 – 數字轉換字串

2.1 String(thing)

String() 中的 thing 放任何想要轉換為數字的物件。
除此之外， String() 還可以將編碼轉換為特殊符號，詳情請參考 MDN 。

console.log(String(3.45))
// "3.45"
console.log(String(345))
// "345"
console.log(String("\0"))
// " "
console.log(String("\\"))
// "\"
console.log(String({age: 35}))
// [object Object]

2.2 Object.prototype.toString()

console.log((3.45).toString())
// "3.45"
console.log((345).toString())
// "345"
console.log(("\0").toString())
// " "
console.log(("\\").toString())
// "\"
console.log(({age: 35}).toString())
// [object Object]

2.3 JSON.stringify()

console.log(JSON.stringify(3.45))
// "3.45"
console.log(JSON.stringify(345))
// "345"
console.log(JSON.stringify("\0"))
// "\u0000"
console.log(JSON.stringify("\\"))
// "\\"
console.log(JSON.stringify({age: 35}))
// {"age":35}

如果覺得我的文章有幫助的話，歡迎幫我的粉專按讚哦~謝謝你！