Javascript 類型轉(zhuǎn)換

• 介紹


• 轉(zhuǎn)換到布爾類型 (Boolean)


• 轉(zhuǎn)換到字符串類型 (String)


• 轉(zhuǎn)換到數(shù)值類型 (Number)


• 解析數(shù)值
  
  
  
  • parseFloat
  
  
  • parseInt
  
  
  • parseInt 指定基數(shù)參數(shù)


• ToInt32.


• 轉(zhuǎn)換用戶輸入
  
  
  
  • 正則表達(dá)式例子.

介紹

Javascript (ECMA Script)是一種弱類型的語(yǔ)言.這并不意味著它沒(méi)有數(shù)據(jù)類型,只是變量或者Javascript對(duì)象屬性不需要一個(gè)特定類型的值分配給它或者它始終使用相同的值.Javascript中的變量同樣支持自由類型轉(zhuǎn)換成為適用(或者要求)的內(nèi)容以便于使用.

弱類型的Javascript不會(huì)按照程序員的愿望從實(shí)際的變量類型到所需要的數(shù)據(jù)類型轉(zhuǎn)換,例如一個(gè)非常常見(jiàn)的錯(cuò)誤,在瀏覽器腳本中,從表單控件中獲取用戶將要輸入的一個(gè)數(shù)值類型的變量與另一個(gè)數(shù)值變量的和.因?yàn)樽兞款愋驮诒韱慰丶惺亲址愋?計(jì)時(shí)字符串序列包含一個(gè)數(shù)字)這種嘗試將會(huì)添加那個(gè)字符串到變量,即使這些值碰巧是一些數(shù)字,結(jié)果在第二個(gè)變量將會(huì)被轉(zhuǎn)換為字符串類型,在最后只會(huì)把從表單控件中得到的變量添加到第一個(gè)字符串末尾.

這個(gè)問(wèn)題實(shí)際上就是"+"操作符,數(shù)字和與字符串連接問(wèn)題.操作結(jié)果完全取決于被操作參數(shù),只有在 +  操作兩者參數(shù)都為數(shù)值時(shí)才會(huì)作取和操作,否則,參數(shù)就會(huì)被自動(dòng)轉(zhuǎn)換為字符串進(jìn)行連接操作.

接下來(lái)討論在Javascript 工作中在類型轉(zhuǎn)換操作的變量返回情況.下表反應(yīng)了在Javascript 中所有的類別,比如 123e-2 作為數(shù)值類型,對(duì)于不同的類型賦予了不同的顏色.在接下來(lái)的章節(jié)中,我們將遵循這一規(guī)則.

如果你接受這個(gè)頁(yè)面的變量類型CSS樣式設(shè)置,下表就是關(guān)于不同變量與不同顏色的搭配關(guān)系.操作符將會(huì)成為 typeof 這樣的樣式.( null 類型將會(huì)返回 "object" 當(dāng)現(xiàn)實(shí)中 null 指定了某個(gè)對(duì)象

布爾值同樣會(huì)有高亮背景 true 或者 false.

轉(zhuǎn)換到布爾類型 (Boolean)

當(dāng)表達(dá)式是 if 以及其他一些判斷情況時(shí),類型轉(zhuǎn)換的結(jié)果將會(huì)是布爾型為了用于判斷.這些判斷包括邏輯運(yùn)算比如 與 (&&), 或 (||) 以及 非 (!). 非運(yùn)算轉(zhuǎn)換變量為波爾型并且如果變量是波爾型-真.那么將返回假,反之將返回真.兩次非操作將會(huì)返回等同于變量轉(zhuǎn)換成為波爾型的值.

var boolValue = !!x;

這個(gè)技巧將會(huì)后面將會(huì)用到.

另外一種可選擇的方法就是把目標(biāo)作為參數(shù)傳遞給Boolean 構(gòu)造函數(shù).

var boolValue = Boolean(x);

當(dāng)數(shù)值類型轉(zhuǎn)換為布爾型時(shí),數(shù)值零將會(huì)變成假而其他數(shù)值將會(huì)變成真.除開(kāi)特殊數(shù)值 NaN (Not a Number), NaN 被用于其他類型轉(zhuǎn)換到數(shù)值類型時(shí)當(dāng)沒(méi)有返回一個(gè)有意義的數(shù)值時(shí). NaN 總是返回假. 無(wú)論是無(wú)限大還是無(wú)限小或者是有限數(shù)值,只要不是零,在轉(zhuǎn)換為布爾型時(shí)總是返回 true..

字符串類型轉(zhuǎn)換規(guī)則是簡(jiǎn)單的,字符串類型轉(zhuǎn)換到布爾型除了空字符串外都是返回真,空字符串返回假.

對(duì)于其他類型, undefined 和 null 將會(huì)返回假, Object以及function類型總是返回真.

當(dāng)需要判斷某一對(duì)象是否是未定義的對(duì)象時(shí),這是最有價(jià)值的功能.如果調(diào)用未定義的變量(undefined 或者 null) 將會(huì)產(chǎn)生錯(cuò)誤.當(dāng)這些都還不確定時(shí)(通常是網(wǎng)頁(yè)瀏覽器所關(guān)心的)為了避免代碼產(chǎn)生錯(cuò)誤,需要對(duì)對(duì)象進(jìn)行 if 判斷.建議把對(duì)象作為表達(dá)式,轉(zhuǎn)換為波爾型,如果返回 false 則說(shuō)明對(duì)象不存在,如果返回 true 則說(shuō)明對(duì)象存在.

if(document.documentElement){

scrollX = document.documentElement.scrollLeft;

}

兩次非操作可以判斷對(duì)象是否能被使用.

var hasDocEl = !!document.documentElement;

...

if(hasDocEl){

scrollX = document.documentElement.scrollLeft;

}

轉(zhuǎn)換到字符串類型 (String)

如上文所說(shuō)的,其他類型轉(zhuǎn)換到字符串類型常常來(lái)自于 + 操作符,無(wú)論其中一個(gè)參數(shù)是否為數(shù)值.最簡(jiǎn)單轉(zhuǎn)換到字符串的方法是,把目標(biāo)變量連接到一個(gè)空字符串上.這種技巧的結(jié)果對(duì)應(yīng)如下表.

另外一種可選擇的方法就是把目標(biāo)作為參數(shù)傳遞給 String 構(gòu)造函數(shù).

var stringValue = String(x);

注意上面數(shù)值 123e-2 已經(jīng)被轉(zhuǎn)換為字符串 "1.23" ,因?yàn)橐呀?jīng)由科學(xué)計(jì)數(shù)法轉(zhuǎn)換為普通表達(dá)式了.然而,Javascript 的本質(zhì)數(shù)值類型是來(lái)自于IEEE的雙精度浮點(diǎn)類型,這就意味著只能儲(chǔ)存有限的精度.數(shù)學(xué)操作結(jié)果可能只能產(chǎn)生近似的值,當(dāng)他們轉(zhuǎn)換到字符串時(shí),可能會(huì)收到意想不到(指壞的)的結(jié)果.所以常常需要設(shè)置特定的定制函數(shù)用以獲得可接受的結(jié)果.這種類型轉(zhuǎn)換機(jī)制難以保證正常結(jié)果.

function(){

            return;

            }

當(dāng)一個(gè)對(duì)象或者函數(shù)被轉(zhuǎn)換為字符串時(shí),他們的 toString 方法將會(huì)被調(diào)用.默認(rèn)會(huì)執(zhí)行 Object.prototype.toString 以及Function.prototype.toString 除 除非重寫(xiě) "toString" 方法.把一個(gè)函數(shù)轉(zhuǎn)換到字符串,返回結(jié)果并非是必須的.Function.prototype.toString 方法就能完成大部分需要,它將會(huì)返回 "host objects" 和方法(這個(gè)對(duì)象和方法取決于不同環(huán)境,比如 DOM 元素).

轉(zhuǎn)換到數(shù)值型 (Number)

轉(zhuǎn)換到數(shù)值類型,特別是由字符串轉(zhuǎn)換到數(shù)值類型,有很多通用的方法,任何數(shù)學(xué)操作方法除了加法( + )都會(huì)執(zhí)行類型轉(zhuǎn)換.所以轉(zhuǎn)換字符串類型到數(shù)值類型可以使之與一個(gè)數(shù)值操作,比如減去零或者乘以一.

var numValue = stringValue - 0;

/* or */

var numValue = stringValue * 1;

/* or */

var numValue = stringValue / 1;

但是 + (取正)操作還是可以轉(zhuǎn)換字符串類型到數(shù)值類型.因?yàn)樗蛔鋈魏斡?jì)算操作,所以這種方法是最快的.

順便一提,相反數(shù)操作 - 同樣也會(huì)執(zhí)行類型轉(zhuǎn)換,使得目標(biāo)成為相反的結(jié)果.

var numValue = (+stringValue);

/* 這是不必要的,在 + 操作后已經(jīng)被添加了括弧,只是為了使得代碼更容易被人理解并且使得他很清楚.特別是避免了與添加和連續(xù)操作相混淆.


比較:





var n = anyNumVar++ + +stringVar + ++anotherNumVar;

- 與 -

var n = (anyNumVar++) + (+stringVar) + (++anotherNumVar);

^^     ^              ^^

(后自增)  + (取正數(shù))   +    (前自增)

*/

最終 + (取正)操作是最快的轉(zhuǎn)換字符串類型到數(shù)值類型的方法.傳遞給 Number 構(gòu)造函數(shù)一個(gè)參數(shù),它將會(huì)執(zhí)行類型轉(zhuǎn)換并且返回一個(gè)數(shù)值類型.

var numValue = Number(stringValue);

Number構(gòu)造函數(shù)是最慢的類型轉(zhuǎn)換方法,但是當(dāng)速度不是所考慮的關(guān)鍵時(shí),使用它能夠使得代碼變得很干凈.

接下來(lái)的表格展示了執(zhí)行 + (取正)操作時(shí)所對(duì)應(yīng)的結(jié)果.通過(guò)先前的選了,其他轉(zhuǎn)換操作同樣會(huì)返回相同的結(jié)果.(下表 Octal代表八進(jìn)制,Hex代表十六進(jìn)制. 譯者注)

需要考慮從的是當(dāng)轉(zhuǎn)換字符串類型到數(shù)值類型時(shí),如果需要從不是表示數(shù)值的字符串中返回結(jié)果.空字符串將會(huì)返回?cái)?shù)值零,這對(duì)于程序可能是無(wú)害的也可能是致命傷害,但這是應(yīng)該注意得到可能會(huì)發(fā)生的.在其他各項(xiàng)中都是遵循Javascript格式化結(jié)構(gòu)的,可能對(duì)于十六進(jìn)制數(shù)有些疑問(wèn),因?yàn)樽詈筮€是將他們表示成為了十進(jìn)制.然而字符串想要被解析為十六進(jìn)制必須被認(rèn)為十六進(jìn)制(以 0x 或者 0X 起頭).字符串無(wú)法被識(shí)別為 NaN.它是 isNaN 函數(shù)返回結(jié)果.字符串類型數(shù)字是一個(gè)指數(shù)格式 ("123e-2") ,不再被理解為負(fù)號(hào).

Objects 和 functions 總是被轉(zhuǎn)換為 NaN . undefined 與 null 同樣代表沒(méi)有東西,但是只有 null 被轉(zhuǎn)換為數(shù)值零.可能是因?yàn)樗麄兿缺晦D(zhuǎn)換為波爾型,然后才轉(zhuǎn)換為數(shù)值型,在上文中轉(zhuǎn)換為波爾型的結(jié)果已經(jīng)很清楚了, null 轉(zhuǎn)換為波爾型將會(huì)返回 false . 它將會(huì)變?yōu)閿?shù)值零. 他們幾乎都不必轉(zhuǎn)換為數(shù)值類型.他們?nèi)绾芜M(jìn)行轉(zhuǎn)換的真正意義在于為了考慮一些偶然的結(jié)果,要轉(zhuǎn)換一個(gè)字符串時(shí),結(jié)果返回的是他們這些(或者是由于進(jìn)行了一些數(shù)學(xué)計(jì)算操作才返回了這些).

解析數(shù)值

一種轉(zhuǎn)換字符串類型到數(shù)值類型的可以選擇方法是使用全局函數(shù),它是一個(gè)已經(jīng)設(shè)計(jì)好的解析字符串返回?cái)?shù)值的函數(shù). parseFloat 函數(shù)接受一個(gè)字符串參數(shù),返回一個(gè)單精度數(shù)值.這是一種快速的轉(zhuǎn)換非字符串參數(shù)的方法.

字符解析函數(shù)獲取每一個(gè)字符直到遇到不屬于數(shù)值的字符,然后返回它已獲取的數(shù)值.這個(gè)特性常常被用于開(kāi)發(fā)中.比如一個(gè)代表CSS長(zhǎng)度的字符串,它的值是 "34.5em" parseFloat 函數(shù)不會(huì)理會(huì) "em" 因?yàn)檫@些字符無(wú)法與之前的數(shù)字產(chǎn)生有效的值.它將會(huì)返回 34.5.這個(gè)CSS字符串中的數(shù)字部分.

parseFloat

對(duì)于 parseFloat 解析空字符串將會(huì)返回 NaN ,是因?yàn)榭兆址粚儆跀?shù)字表達(dá)式.指數(shù)可以被解析,由0起頭的八進(jìn)制不會(huì)阻止字符串解析為十進(jìn)制數(shù).十六進(jìn)制數(shù)卻因?yàn)?"x" 無(wú)法作為數(shù)字被解析而停止解析而返回一個(gè)零.

非字符串類型轉(zhuǎn)換成為快速轉(zhuǎn)換,作為一個(gè)字符串傳遞給 parseFloat .當(dāng)那些類型轉(zhuǎn)換作為字符串時(shí)不在是正常的結(jié)果,它的解析結(jié)果是 NaN. Objects 和 functions 可能有自定義 toString 方法返回字符串將會(huì)被解析成為數(shù)值,這是一個(gè)特殊的要求.

parseInt

parseInt 函數(shù)的工作方式和 parseFloat 有些相似.不同之處在于它是嘗試把字符串轉(zhuǎn)換為整型數(shù)值,只能辨認(rèn)幾個(gè)少數(shù)作為數(shù)字的符號(hào).

parseInt 函數(shù)偶爾被用作轉(zhuǎn)換單精度浮點(diǎn)數(shù)值類型為整型.由于這種轉(zhuǎn)換首先要從字符串類型轉(zhuǎn)換到單精度數(shù)值類型所以是不太適用的,另外,由于它會(huì)產(chǎn)生一些錯(cuò)誤,所以變得非常沒(méi)有效率,比如 2e-200 這個(gè)科學(xué)計(jì)數(shù)法的數(shù)值正確的返回因該是零,但是 parseInt 返回 2 .并且由于是Javascript 格式化,數(shù)值常常返回的是一些近似值.比如 1/2 + 1/3 + 1/6 = 0.9999999999999999 ,這個(gè)表達(dá)式的結(jié)果的近似值應(yīng)該是 1 ,但 parseInt 竟會(huì)返回 0.

可以取得近似值的 Math.round, Math.ceil 和 Math.floor 都比較合適這個(gè)工作,為了取得結(jié)果,表達(dá)式將會(huì)被作為32位有符號(hào)整型,這個(gè)規(guī)則同樣適用于下面這些情況.(譯者注 Math.round 函數(shù)執(zhí)行的是常見(jiàn)的四舍五入,0.4以及一下將會(huì)被忽略,0.5以及以上將會(huì)被加1. Math.ceil 函數(shù)在只要有小數(shù)的情況是就加1 . Math.floor 函數(shù)則無(wú)論小數(shù)大小都會(huì)被忽略.由這些函數(shù)的定義可知 parseInt 方法對(duì)于小數(shù)采取的是同 Math.floor 一樣的處理方式)

在結(jié)果中我們可以很明顯的看到函數(shù)執(zhí)行時(shí)先把參數(shù)轉(zhuǎn)換為字符串型然后才進(jìn)行解析.注意那個(gè) 123e-2 值,它就相當(dāng)于數(shù)值 1.23 ,執(zhí)行類型轉(zhuǎn)換時(shí)轉(zhuǎn)換到字符串類型 "1.23" ,所以這項(xiàng)在上表中看起來(lái)很奇怪,但是這是正確的.

進(jìn)行格式化到整型中當(dāng)字符串是八進(jìn)制或者十六進(jìn)制數(shù)時(shí), parseInt 函數(shù)可以以按符合Javascript代碼規(guī)則的方式解析他們,甚至當(dāng)他們帶有負(fù)號(hào)時(shí).

As parseInt type-converts its non-string arguments to strings it always produces the same results for boolean, null, undefined, object and function arguments as parseFloat (assuming objects and functions do not have custom toString methods).
parseInt 和 parseFloat 一樣在接受非字符串的其他類型參數(shù)時(shí),都會(huì)產(chǎn)生相同的結(jié)果.比如 boolean, null, undefined, object and function (假定這些 objectes 和 functions 都沒(méi)有自定義 toString 方法).

parseInt 指定基數(shù)參數(shù)

這是一個(gè)少有讓人滿意的功能, parseInt 允許我們自定義接受參數(shù)的進(jìn)制格式.比如以0開(kāi)頭的字符串很少會(huì)被用于八進(jìn)制格式化(特別是在用戶輸入中). 為了處理這類問(wèn)題, parseInt 接受第二個(gè)參數(shù),基數(shù).它可以指出第一個(gè)字符串參數(shù)要被如何解析.特別指出,第二個(gè)參數(shù)如果是 10 , parseInt 函數(shù)將解析第一參數(shù)字符串只能為十進(jìn)制.

八進(jìn)制字符串現(xiàn)在已經(jīng)被解析為 10 了,十六進(jìn)制字符串則變成了 0 ,因?yàn)榻馕霾襟E停止在了 "x" 字符上.

Number bases 2 to 36 can be used with parseInt. The following is base 16.
parseInt 第二參數(shù)的合法值為 2 到 36.接下來(lái)是基于16進(jìn)制的.

十六進(jìn)制 0x 可以被識(shí)別出,在基于十六進(jìn)制數(shù)時(shí).

最后,嘗試下基于3進(jìn)制.

結(jié)果很明顯,數(shù)字 8 輸出 NaN 是因?yàn)?"8" 字符在三進(jìn)制數(shù)中無(wú)法被解析,這和下面一行中空字符串參數(shù)產(chǎn)生了相同的結(jié)果.

ToInt32

ToInt32 是一個(gè)內(nèi)置函數(shù),雖然很有用,但是無(wú)法像 parseInt 一樣被直接調(diào)用.用它轉(zhuǎn)換Javascript變量到數(shù)值有一些不同尋常的方式.但是它能在一些有限的情況下被使用.位操作,比如按位OR(|)和 按位AND (&) 操作數(shù)值時(shí),在使用它們操作時(shí)能被轉(zhuǎn)換為數(shù)值類型.但是他們只工作在32位有符號(hào)的整形中,所以我們可以通過(guò)調(diào)用內(nèi)置函數(shù) ToInt32 返回已轉(zhuǎn)換的32位有符號(hào)整形變量(進(jìn)行類型轉(zhuǎn)換).

結(jié)果就像是 parseInt 函數(shù)調(diào)用后,只是結(jié)果被限定為32位,因此都是數(shù)值,而沒(méi)有 NaN 或者 Infinity.

就算是用空值進(jìn)行操作,結(jié)果返回的也是一個(gè)數(shù)值,使用一個(gè)位運(yùn)算不會(huì)印象結(jié)果,卻可以調(diào)用 ToInt32 函數(shù).下表表示經(jīng)過(guò)按位OR 0 運(yùn)算后的結(jié)果.

NaN 和 ±Infinity 變成了0, 浮點(diǎn)數(shù)被縮短成了整形.

ToInt32 把字符串類型變量將原被應(yīng)該被轉(zhuǎn)換為 NaN 的結(jié)果變成了 0.

操作后甚至 undefined, objects 和 functions 都被轉(zhuǎn)換為 0,注意,布爾值 true 被轉(zhuǎn)換成了數(shù)值 1.

轉(zhuǎn)換用戶輸入

大多數(shù)的結(jié)構(gòu)都是為了獲取用戶輸入. <input type="text"> 和 prompt .例如在表單中他們的結(jié)果是字符串類型.即使期望用戶只輸入數(shù)字,他們?nèi)匀豢赡茌斎肴院蜄|西(至少他們可能會(huì)輸入一個(gè)制表符).如果想要把字符串類型轉(zhuǎn)換為數(shù)值類型,上文的最后一種方法是最合適的.但是有時(shí)仍然會(huì)有一些錯(cuò)誤的輸入難以發(fā)現(xiàn)和控制.

把字符串類型轉(zhuǎn)換為數(shù)值類型一種更有利的方法是使用正則表達(dá)式(Regular Expression),使得字符串確?？梢员徽_的格式化.它也可以為剔除一些字符串變量而服務(wù).

正則表達(dá)式例子

/^\d+$/                 //所有數(shù)字

/^\s*[-+]?\d+\s*$/      //連續(xù)的數(shù)字

/^\d{1,5}$/             //由1到5組成的數(shù)字

/^\d+\.\d\d$/           //Money

/^\d+(\.\d{2})$/        //Money

/^\d{1,3}(,\d\d\d)*\.\d\d$/  //帶逗號(hào)的 money - 12,432.57

// 可帶逗號(hào)和不帶逗號(hào)的 money - 12,432.57 or 12432.57

/^\d{1,3}(,\d\d\d)*\.\d\d$|^\d+\.\d\d$/