js數(shù)據(jù)類型轉(zhuǎn)化

dmlllll 發(fā)布于2019-08-26 11:42 / 778人閱讀

數(shù)據(jù)類型轉(zhuǎn)化表

首先上數(shù)據(jù)類型轉(zhuǎn)化表，便于遇到問(wèn)題直接查看

值	字符串	數(shù)字	布爾值	對(duì)象
undefined null	"undefined" "null"	NaN	false false	throws TypeError throws TypeError
true false	"true" "false"	1 0		new Boolean(true) new Boolean(false)
""(空字符串) "1.2"(非空，數(shù)字) "one"（非空，非數(shù)字）		0 1.2 NaN	false true true	new String("") new String("1.2") new String("one")
0 -0 NaN Infinity -Infinity 1（非零）	"0" "0" "NaN" "Infinity" "-Infinity" "1"		new Number(0) new Number(-0) new Number(NaN) new Number(Infinity) new Number(-Infinity) new Number(1)
{}（任意對(duì)象） [] [9] ["a"]	{}.toString() -> {}.valueOf() "" "9" 使用join()	{}.valueOf() -> {}.toString() 0 9 NaN NaN	true true true true

顯式轉(zhuǎn)換

顯示轉(zhuǎn)換最簡(jiǎn)單的是使用Boolean()、Number()、String()或Object()構(gòu)造函數(shù)

Number("3"); // 3
String(false); // "false"
Boolean([]); // true
Object(3); // new Number(3)

ps:值得注意的是，試圖把undefined或null轉(zhuǎn)換為對(duì)象，會(huì)拋出一個(gè)類型錯(cuò)誤，而Object()顯示轉(zhuǎn)換不會(huì)，而是返回一個(gè)新創(chuàng)建的空對(duì)象

顯示轉(zhuǎn)換還有toString()、toFixed()、toExponential()、toPrecision()、parseInt()、parseFloat()方法，不細(xì)說(shuō)

隱式轉(zhuǎn)換

隱式轉(zhuǎn)換分為三種：

將值轉(zhuǎn)換為原始值，ToPrimitive(input, PreferredType)

將值轉(zhuǎn)化為數(shù)字，ToNumber()

將值轉(zhuǎn)化為字符串，ToString()

原始類型數(shù)據(jù)轉(zhuǎn)化相對(duì)比較簡(jiǎn)單，下面值看對(duì)象到原始類型的轉(zhuǎn)換方式

對(duì)象的toString()和valueOf()方法

所有對(duì)象繼承了兩個(gè)轉(zhuǎn)換方法：toString()

一般對(duì)象轉(zhuǎn)化成[object object] {x: 1, y: 2}.toString(); // "[object object]"

數(shù)組轉(zhuǎn)化成元素間加逗號(hào) [1, 2, 3].toString(); // "1,2,3"

函數(shù)轉(zhuǎn)化成定義(function(x){}).toString(); // "function(x) {}"

正則轉(zhuǎn)化為直接量字符串 /d+/g.toString(); // "/d+/g"

日期轉(zhuǎn)化為日期字符串 new Date(2000, 1, 1).toString(); // "Tue Feb 01 2000 00:00:00 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)"

valueOf()方法

大多數(shù)對(duì)象無(wú)法真正表示為一個(gè)原始值，valueOf()簡(jiǎn)單返回對(duì)象本身

日期對(duì)象是一個(gè)特例，返回毫秒數(shù) new Date(2010, 0, 1).valueOf(); // 12623328000

對(duì)象到字符串的轉(zhuǎn)換

如果對(duì)象具有toString()方法，則調(diào)用這個(gè)方法，如果它返回一個(gè)原始值，將這個(gè)值轉(zhuǎn)化為字符串，并返回這個(gè)字符串結(jié)果

如果對(duì)象沒(méi)有toString()方法，或者個(gè)這個(gè)方法不返回一個(gè)原始值，那么就會(huì)調(diào)用valueOf()方法。如果存在這個(gè)方法，則調(diào)用它，如果返回值是一個(gè)原始值，將這個(gè)值轉(zhuǎn)化為只服從，并返回這個(gè)字符串結(jié)果

否則，就會(huì)拋出一個(gè)類型錯(cuò)誤異常

對(duì)象到數(shù)字的轉(zhuǎn)換

如果對(duì)象具有valueOf()方法，后者返回個(gè)億原始值，則將這個(gè)原始值轉(zhuǎn)化為數(shù)字，并返回這個(gè)數(shù)字

否則，如果對(duì)象有toString()方法，后者返回一個(gè)原始值，并轉(zhuǎn)化成數(shù)字返回

否則，拋出一個(gè)類型錯(cuò)誤異常

舉個(gè)栗子： ({} + {}) = ?

兩個(gè)對(duì)象的值進(jìn)行+運(yùn)算符，要先進(jìn)行隱式轉(zhuǎn)換成原始類型才能計(jì)算
1. ToPrimitive轉(zhuǎn)換，因?yàn)闆](méi)有指定PreferredType類型，默認(rèn)為Number
2. 執(zhí)行`valueOf()`方法，`{}.valueOf()`返回的還是{}對(duì)象
3. 繼續(xù)執(zhí)行`toString()`方法，`({}).toString()`返回`[Object Object]`，是原始值

所以最后結(jié)果：[Object Object][Object Object]
ps:在Firefox中返回結(jié)果為NaN，因?yàn)榈谝粋€(gè){}被當(dāng)作一個(gè)代碼塊，沒(méi)有解析轉(zhuǎn)換，變成了+{}，也就是+[Object Object]，最終變成NaN

==元算符隱式轉(zhuǎn)換

==運(yùn)算符應(yīng)用和考察點(diǎn)很多，直接上ES5規(guī)范文檔

比較運(yùn)算 x==y, 其中 x 和 y 是值，返回 true 或者 false。這樣的比較按如下方式進(jìn)行：
1、若 Type(x) 與 Type(y) 相同， 則

    1* 若 Type(x) 為 Undefined， 返回 true。
    2* 若 Type(x) 為 Null， 返回 true。
    3* 若 Type(x) 為 Number， 則

        (1)、若 x 為 NaN， 返回 false。
        (2)、若 y 為 NaN， 返回 false。
        (3)、若 x 與 y 為相等數(shù)值， 返回 true。
        (4)、若 x 為 +0 且 y 為 ?0， 返回 true。
        (5)、若 x 為 ?0 且 y 為 +0， 返回 true。
        (6)、返回 false。

    4* 若 Type(x) 為 String, 則當(dāng) x 和 y 為完全相同的字符序列（長(zhǎng)度相等且相同字符在相同位置）時(shí)返回 true。 否則， 返回 false。
    5* 若 Type(x) 為 Boolean, 當(dāng) x 和 y 為同為 true 或者同為 false 時(shí)返回 true。 否則， 返回 false。
    6*  當(dāng) x 和 y 為引用同一對(duì)象時(shí)返回 true。否則，返回 false。
2、若 x 為 null 且 y 為 undefined， 返回 true。
3、若 x 為 undefined 且 y 為 null， 返回 true。
4、若 Type(x) 為 Number 且 Type(y) 為 String，返回比較 x == ToNumber(y) 的結(jié)果。
5、若 Type(x) 為 String 且 Type(y) 為 Number，返回比較 ToNumber(x) == y 的結(jié)果。
6、若 Type(x) 為 Boolean， 返回比較 ToNumber(x) == y 的結(jié)果。
7、若 Type(y) 為 Boolean， 返回比較 x == ToNumber(y) 的結(jié)果。
8、若 Type(x) 為 String 或 Number，且 Type(y) 為 Object，返回比較 x == ToPrimitive(y) 的結(jié)果。
9、若 Type(x) 為 Object 且 Type(y) 為 String 或 Number， 返回比較 ToPrimitive(x) == y 的結(jié)果。
10、返回 false。

總結(jié)起來(lái)有如下幾點(diǎn)值得注意

NaN !== NaN

x,y 為null、undefined兩者中一個(gè) // 返回true

x、y為Number和String類型時(shí)，則轉(zhuǎn)換為Number類型比較

有Boolean類型時(shí)，Boolean轉(zhuǎn)化為Number類型比較

一個(gè)Object類型，一個(gè)String或Number類型，將Object類型進(jìn)行原始轉(zhuǎn)換后，按上面流程進(jìn)行原始值比較

舉一個(gè)栗子：

var a = {
  valueOf: function () {
     return1;
  },
  toString: function () {
     return"123"
  }
}
console.log(rue == a) // true;

1. 首先，x與y類型不同，x為boolean類型，則進(jìn)行ToNumber轉(zhuǎn)換為1,為number類型
2. x為number，y為object類型，對(duì)y進(jìn)行原始轉(zhuǎn)換，ToPrimitive(a, ?),沒(méi)有指定轉(zhuǎn)換類型，默認(rèn)number類型
3. ToPrimitive(a, Number)首先調(diào)用valueOf方法，返回1，得到原始類型1。
4. 1 == 1， 返回true

同理適用于>、<、!=、+運(yùn)算符的隱式轉(zhuǎn)換（但要除去日期對(duì)象）

云服務(wù)器 GPU云服務(wù)器數(shù)據(jù)類型轉(zhuǎn)化 js js轉(zhuǎn)化數(shù)據(jù)類型 js數(shù)據(jù)類型轉(zhuǎn)化類型轉(zhuǎn)化

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/107384.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

dmlllll

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

主機(jī)屋與服務(wù)器有什么關(guān)系-主機(jī)和服務(wù)器的區(qū)別是什么？

閱讀 1834·2021-09-22 15:10
軟件測(cè)試常考面試題-軟件測(cè)試面試寶典【最新】

閱讀 1370·2021-09-07 09:58
收藏 | 產(chǎn)品經(jīng)理不可不知的 7 種技術(shù)思維

閱讀 2392·2019-08-30 15:44
JS中檢查內(nèi)嵌對(duì)象是否存在

閱讀 1713·2019-08-26 18:29
學(xué)習(xí) PixiJS — 小精靈冒險(xiǎn)

閱讀 2117·2019-08-26 13:35
JavaScript的組成結(jié)構(gòu)梳理

閱讀 830·2019-08-26 13:31
js數(shù)據(jù)類型轉(zhuǎn)化

閱讀 779·2019-08-26 11:42
webpack如何查找模塊依賴

閱讀 1140·2019-08-23 18:39

成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲中文字幕日韩无码

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

js數(shù)據(jù)類型轉(zhuǎn)化

相關(guān)文章

JS知識(shí)—面試準(zhǔn)備（一）

JS知識(shí)—面試準(zhǔn)備（一）

JS知識(shí)—面試準(zhǔn)備（一）

【JS基礎(chǔ)】類型轉(zhuǎn)換知多少

原型模式故事鏈(3)--JS的數(shù)據(jù)類型、以及區(qū)別、區(qū)分、轉(zhuǎn)化

發(fā)表評(píng)論

0條評(píng)論

dmlllll

男|高級(jí)講師

TA的文章

主機(jī)屋與服務(wù)器有什么關(guān)系-主機(jī)和服務(wù)器的區(qū)別是什么？

軟件測(cè)試常考面試題-軟件測(cè)試面試寶典【最新】

收藏 | 產(chǎn)品經(jīng)理不可不知的 7 種技術(shù)思維

JS中檢查內(nèi)嵌對(duì)象是否存在

學(xué)習(xí) PixiJS — 小精靈冒險(xiǎn)

JavaScript的組成結(jié)構(gòu)梳理