關于js中類型轉換的問題

bingo 發布于2019-08-20 16:35 / 1979人閱讀

摘要：把一個值從一個類型轉換成其他的類型的做法叫做類型轉換。抽象值操作類型的轉換涉及到了轉換的基本規則，這里介紹，，，。默認情況下為，內部先執行得到的值如為基本類型則輸出結果，否則再執行得到的值如為則輸出結果，否則報錯。都轉換為數字相加后返回。

先來看一個栗子：

if("0.00"){
  console.log("0.00")
}
var obj = {
    valueOf: function(){ return {} }, 
    toString: function(){ return {} }
}
console.log(obj == 0)

知道上面的栗子輸出上面嗎？

首先，JavaScript的內置類型有：null，undefined，number，string，boolean，object，symbol(ES6)。除去object，其他算是基本類型（primitives）。把一個值從一個類型轉換成其他的類型的做法叫做類型轉換。可以是顯示的，也可以是隱式的。

抽象值操作

類型的轉換涉及到了轉換的基本規則，這里介紹ToString，ToNumber，ToBoolean，ToPrimitive。

ToString

參數	結果
undefined	"undefined"
null	"null"
Boolean	"false" or "true"
Number	將數字轉化成字符串，如"1.1"
String	不變
Object	ToPrimitive后ToString

ToNumber

參數	結果
undefined	NaN
null	+0
Boolean	false->0, true->1
Number	不變
String	轉換規則間下面*
Object	ToPrimitive后ToNumber

String 的ToNumber規則。字符串和數字的字面量差不多（其他情況轉化為NaN），即：

允許字符串前后有空白符

允許前面是0而不會被轉化為8進制

允許用+/-代表符號位

只有空白符的情況下，轉化為0

ToBoolean

參數	結果
undefined	false
null	false
Boolean	不變
Number	0,NaN->false; other->true
String	length等于0->false; other->true
Object	true

ToPrimitive

參數	結果
undefined	不變
null	不變
Boolean	不變
Number	不變
String	不變
Object	轉化規則見下面*

這里涉及到了ToPrimitive ( input [, PreferredType] )，input為輸入的值， PreferredType為可選項（默認情況下是Number。另一個是String，作用和Number相反，先執行toString()，在執行valueOf()）。

默認情況下（PreferredType為Number），內部先執行valueOf()得到的值如為primitive（基本類型）則輸出結果，否則再執行toString()得到的值如為primitive則輸出結果，否則報錯。

兩種轉換

理解了上面的抽象值操作，就可以來看一下下面兩種不同的轉換。

顯式轉換

String()：滿足ToString轉換規則

String(null) //"null"

Number()：滿足ToNumber轉換規則

Number(" 010 ") //10

Boolean：滿足ToBoolean轉換規則

Boolean([1, 2, 3]) //true

parseInt(string, radix)：滿足ToString轉換規則

var a = {
  //先執行toString
  toString: function () {
    return {}
  },
  //再執行valueOf
  valueOf: function () {
    return 0x10
  }
}
parseInt(a) //16

需要注意的是，由于a是對象，需要通過ToPrimitive得到Primitive（此時ToPrimitive ( input [, PreferredType] )的PreferredType為String），再將ToString(Primitive)得到"0x10"

隱式轉換

一元操作符+：滿足ToNumber轉換規則

var a = "6";
+a + 6 //12

二元操作符 +：

分別計算左右操作數，得到lval,rval。（有步驟合并省略）

lprim = ToPrimitive(lval)。

rprim = ToPrimitive(rval)。

如果lprim或rprim是字符串，都轉換為字符串然后相加返回。

都轉換為數字相加后返回。

[1, 2] + 1 //"1,21"

二元操作符 -：

分別計算左右操作數，得到lval,rval。（有步驟合并省略）

lnum = ToNumber(lval)。

rnum = ToNumber(rval)。

相減后返回。

[1, 2] - 1 //NaN

條件 if（express）（||、&&、三元...）：滿足ToBoolean轉換規則

if (" ") {
  console.log("blank")
} 
//blank

==運算：

Type(x)	Type(y)	Result
兩者類型相同		遵循===運算
null	Undefined	true
Undefined	null	true
Number	String	x == toNumber(y)
String	Number	toNumber(x) == y
Boolean	(any)	toNumber(x) == y
(any)	Boolean	x == toNumber(y)
String or Number	Object	x == toPrimitive(y)
Object	String or Number	toPrimitive(x) == y
otherwise…		false

var a = {
  toString () {
    console.log("toString");
    return "1"
  },
  valueOf () {
    console.log("valueOf");
    return 1
  }
}
console.log("1" == a) // true

===運算：

Type(x)	Values	Result
兩者類型不一樣		false
Undefined or Null		true
Number	兩者數值一樣(非NaN)	true
String	兩者完全一樣	true
Boolean	兩者一樣	true
Object	兩者指向同一個對象	true
otherwise…		false

關系比較（如<）

主要步驟：首先都轉換為基礎類型，如果都是字符串，按字符串比較;否則都轉數字比較。

下面借用網上的圖

==運算

===運算

參考

Truth, Equality and JavaScript
You-Dont-Know-JS筆記之類型和語法

云服務器 GPU云服務器 js中數據類型轉換 js的數據類型轉換 js 數據類型的自動轉換 js 中各種數據類型的比較

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

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

關于js類型轉換騷操作

摘要：原文來源于我的前言身為一種弱類型的語言，不用像語言那樣要定義等等數據類型，因為允許變量類型的隱式轉換和允許強制類型轉換。原文來源于我的github 0.前言 js身為一種弱類型的語言，不用像c語言那樣要定義int、float、double、string等等數據類型，因為允許變量類型的隱式轉換和允許強制類型轉換。我們在定義一個變量的時候，就一個var、let、const搞定，不用擔心...

zhangwang 2019-08-22 16:26 評論0 收藏0
【JS】關于JS的一些知識點（JS基礎，純記錄）

摘要：如何讓根據拆箱轉換，以及的隱式轉換，可以如下寫為什么計算機中所有的數據都是以二進制存儲的，所以在計算機計算時要把數據先轉換成二進制進行計算，然后把計算結果轉換成十進制。會存在精度丟失問題和的二進制都是以無線循環的小數的二進制的二進制本想著記筆記里，但是筆記里沒有分類，還是以文章的形式，當個人總結吧，這一篇就當作JS基礎篇的記錄吧，有修改的和新增的持續更新～關于JS的一些小技巧 1:...

SwordFly 2019-08-23 18:11 評論0 收藏0
JavaScript類型轉換的迷糊事兒

摘要：下面分幾步來簡單的探探不同類型的轉換吧以下的內容，都可以從權威指南中找到。其他值轉換成在編寫代碼的過程中，幾乎不用考慮它的取值類型。核心內置類，會嘗試先于可以理解為對象優先轉換成數字例外的是，利用的是轉換。最近在寫公司的登錄注冊模塊，遇到類型不同相比較的時候，就心驚膽戰，每次都要用瀏覽器來驗證一下，決定亂七八糟的隨便寫一下，方便日后自己回顧知識~ 弱類型帶來的那些讓人迷糊的事弱類型...

harriszh 2019-08-22 10:58 評論0 收藏0
分析 JavaScript 的數據類型與變量

摘要：基本數據類型在中，基本數據類型有種，即數值字符串布爾值。兩個布爾值轉為數值進行比較。對于對象和布爾值，調用它們的方法得到對應的字符串值，然后進行字符串相加。減法對于字符串布爾值或者，自動調用，轉換結果若為，那么最終結果為。這篇文章，來聊聊 JS 中的數據類型與變量。這是在學習 JS 時最基礎的一類問題，但卻很重要。希望我的分享有幫助到你。文章開頭，我先提幾個面試中遇到的問題：比如...

Mike617 2019-08-23 13:13 評論0 收藏0
大規模應用TypeScript「2019 JSConf -Brie Bunge」

摘要：眾所周知，在大公司中進行大的改革很難。目前公司有超過名開發人員，其中有個以上是前端。從年起，已經在一些小規模團隊中探索使用。在年的前端調查中，靜態類型系統呼聲最高。在我們的主倉庫中，絕大多數的公共依賴都已經由做到了類型聲明。特別說明這是一個由simviso團隊進行的關于Airbnb大規模應用TypeScript分享的翻譯文檔，分享者是Airbnb的高級前端開發Brie Bunge ...

qpal 2019-08-26 14:04 評論0 收藏0