重學JS：顯式強制類型轉換

xiangchaobin 發布于2019-08-23 18:23 / 1996人閱讀

ToString

ToString負責處理非字符串到字符串的強制類型轉換，常用的字符串化方法String()、toString()。

基本類型值的字符串化規則：

null轉換為"null"

undefined轉換為"undefined"

true轉化為"true"

數字的字符串化遵循通用規則，極大值或者極小值采用科學計數法表示

普通對象在字符串化時，實際執行Object.prototype.toString()，返回該對象的類型[object type]，例如：

var test = {a : "test"}
console.log(test.toString()) // "[object Object]"
console.log(String(test)) // "[object Object]"

但是當對象有自己的toString方法時，字符串化時就會調用該方法并返回該方法的返回值，例如：

var obj = {
  a: "test",
  toString: function () {
    return 1
  }
}
console.log(obj.toString()) // 1
console.log(String(obj)) // 1

數組在做字符串化時，將數組所有元素字符串化再用"，"連接，例如：

var arr = [1, 2]
console.log(arr.toString()) // "1,2"
console.log(String(arr)) // "1,2"

JSON.stringify()

JSON.stringify()在將JSON對象序列化為字符串時，也涉及到了字符串化的相關規則。

對大多數簡單值來說，JSON字符串化和toString()的效果基本相同，例如：

console.log(JSON.stringify("test")) // ""test""
console.log(JSON.stringify(1)) // "1"
console.log(JSON.stringify(null)) // "null"

但是JSON.stringify()在對象中遇到function() {}、undefined、Symbol時會自動將其忽略，在數組中則會返回null，例如：

var obj1 = {
  a: undefined,
  b: function () {},
  c: Symbol()
}
console.log(JSON.stringify(obj1)) // "{}"
console.log(JSON.stringify([undefined, function () {}, 1])) // "[null, mull, 1]"

當對象執行JSON.stringify()方法時，如果對象中存在toJSON方法，用它的返回值來進行序列化，例如：

var obj2 = { 
  a: undefined,
  b: function () {},
  c: Symbol(),
  toJSON: function () {
    return {a: "replace"}
  }
}
console.log(JSON.stringify(obj2)) // "{"a":"replace"}"

ToNumber

ToNumber負責將非數字轉化為數字，Number()、parseInt()和parseFloat()都可以將非數字轉化為數字

Number()

Number()函數的轉換規則：

如果是Boolean類型，true和false分別轉換為0和1

如果是數字值，只是簡單的傳入和返回

如果是null值，返回0

如果是undefined，返回NaN

如果是字符串，遵循下列規則：

如果字符串中只包含數字，則將其轉變為十進制數

如果字符串中包含有效的浮點格式，則將其轉換為對應的浮點數值

如果字符串中包含有效的十六進制格式，則將其轉換為相同大小的十進制數

如果字符串是空，則將其轉換為0

如果字符串中包含除上述格式之外的字符串，則將其轉換為NaN

如果是對象，則調用對象的valueOf()方法，然后依照前面的規則轉換值。如果轉換的結果是NaN，則調用對象的toString()方法，然后再依次照前面的規則轉換返回的字符串值

例如：

console.log(Number(true)) // 1
console.log(Number(1)) // 1
console.log(Number(null)) // 0
console.log(Number(undefined)) // NaN
console.log(Number("11")) // 11
console.log(Number("1.1")) // 1.1
console.log(Number("0xf")) // 15
console.log(Number("")) // 0
var a = {
  valueOf: function () {
    return "10"
  }
}
var b = {
  toString: function () {
    return "10"
  }
}
var c = [1, 0]
c.toString = function () {
  return c.join("")
}
console.log(Number(a)) // 10
console.log(Number(b)) // 10
console.log(Number(c)) // 10

parseInt()

parseInt()轉換規則：

parseInt()函數在轉換字符串時，會忽略字符串前面的空格，直到找到第一個非空格字符

如果第一個字符不是數字字符或者負號，parseInt()就會返回NaN

如果第一個字符是數字字符，parseInt()就會繼續解析，直到解析完所有后續字符或者遇到一個非數字字符

如果字符串中的第一個字符是數字字符，parseInt()也能識別各種進制數

例子：

console.log(parseInt("a")) // NaN
console.log(parseInt("11")) // 11
console.log(parseInt("11aa")) // 11
console.log(parseInt("0xf")) // 15

parseFloat()

parseFloat()轉換規則:

與parseInt()函數類似，parseFloat()也是從第一個字符開始解析每一個字符，而且也是一直解析到字符串末尾，或者解析到遇見一個無效的浮點數字字符為止

解析時會忽略前導的0

只會解析十進制數

例子：

console.log(parseFloat("12.3a")) // 12.3
console.log(parseFloat("0xf")) // 0
console.log(parseFloat("01.1")) // 1.1

ToBoolean

布爾強制類型轉換的假值列表：

undefined

null

false

+0、-0和NaN

除了上述列表以外的值在轉換的時候都應該是真值，強制布爾類型轉換常用Boolean()或者!!，第一個!將值強制轉為布爾類型，但同時還將真假值反轉，第二個!將結果返回原值，例子：

console.log(Boolean("0")) // true
console.log(Boolean([])) // true
console.log(Boolean(undefined)) // false
console.log(!!"0") // true
console.log(!![]) // true
console.log(!!undefined) // false

總結

這篇文章對JS中的常見顯式強制類型轉換做了一個小結，希望能對大家理解有所幫助。如果有錯誤或不嚴謹的地方，歡迎批評指正，如果喜歡，歡迎點贊

云服務器 GPU云服務器顯式類型轉換強制轉換類型類型強制轉換強制類型轉換

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/105149.html

重學JS: 隱式強制類型轉換

摘要：隱式強制類型轉換指的是那些隱藏的強制類型轉換，副作用也不是很明顯，事實上，只要自己覺得不夠明顯的強制類型轉換都可以算作隱式強制類型轉換，接下來，此文將會介紹幾種常見的隱式類型轉換。隱式強制類型轉換指的是那些隱藏的強制類型轉換，副作用也不是很明顯，事實上，只要自己覺得不夠明顯的強制類型轉換都可以算作隱式強制類型轉換，接下來，此文將會介紹幾種常見的隱式類型轉換。加法操作符轉換規則： ...

Fourierr 2019-08-23 18:31 評論0 收藏0
重學前端學習筆記（六）--JavaScript類型有哪些你不知道的細節？

摘要：的碼點被稱為基本字符區域。關于的介紹，我準備用文檔阮一峰來做一些介紹，具體的可以參考文檔引入的原因的對象屬性名都是字符串，這容易造成屬性名的沖突。其他的一些屬性可以去看文檔阮一峰注意函數前不能使用命令，否則會報錯。筆記說明重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完...

Lsnsh 2019-08-02 16:15 評論0 收藏0
重學前端學習筆記（六）--JavaScript類型有哪些你不知道的細節？

摘要：的碼點被稱為基本字符區域。關于的介紹，我準備用文檔阮一峰來做一些介紹，具體的可以參考文檔引入的原因的對象屬性名都是字符串，這容易造成屬性名的沖突。其他的一些屬性可以去看文檔阮一峰注意函數前不能使用命令，否則會報錯。筆記說明重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完...

joyvw 2019-08-23 17:13 評論0 收藏0
重學前端學習筆記（六）--JavaScript類型有哪些你不知道的細節？

摘要：的碼點被稱為基本字符區域。關于的介紹，我準備用文檔阮一峰來做一些介紹，具體的可以參考文檔引入的原因的對象屬性名都是字符串，這容易造成屬性名的沖突。其他的一些屬性可以去看文檔阮一峰注意函數前不能使用命令，否則會報錯。筆記說明重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完...

zlyBear 2019-08-29 18:46 評論0 收藏0