# ECMAScript 類型轉換
**所有程序設計語言最重要的特征之一是具有進行類型轉換的能力。**
**ECMAScript 給開發者提供了大量簡單的類型轉換方法。**
**大部分類型具有進行簡單轉換的方法,還有幾個全局方法可以用于更復雜的轉換。無論哪種情況,在 ECMAScript 中,類型轉換都是簡短的一步操作。**
## 轉換成字符串
ECMAScript 的 Boolean 值、數字和字符串的原始值的有趣之處在于它們是偽對象,這意味著它們實際上具有屬性和方法。
例如,要獲得字符串的長度,可以采用下面的代碼:
```
var sColor = "red";
alert(sColor.length); //輸出 "3"
```
盡管 "red" 是原始類型的字符串,它仍然具有屬性 length,用于存放字符串的大小。
總而言之,3 種主要的原始類型 Boolean 值、數字和字符串都有 toString() 方法,可以把它們的值轉換成字符串。
提示:您也許會問,“字符串還有 toString() 方法嗎,這不是多余嗎?”是的,的確如此,不過 ECMAScript 定義所有對象都有 toString() 方法,無論它是偽對象,還是真對象。因為 String 類型屬于偽對象,所以它一定有 toString() 方法。
Boolean 類型的 toString() 方法只是輸出 "true" 或 "false",結果由變量的值決定:
```
var bFound = false;
alert(bFound.toString()); //輸出 "false"
```
Number 類型的 toString() 方法比較特殊,它有兩種模式,即_默認模式_和_基模式_。采用默認模式,toString() 方法只是用相應的字符串輸出數字值(無論是整數、浮點數還是科學計數法),如下所示:
```
var iNum1 = 10;
var iNum2 = 10.0;
alert(iNum1.toString()); //輸出 "10"
alert(iNum2.toString()); //輸出 "10"
```
注釋:在默認模式中,無論最初采用什么表示法聲明數字,Number 類型的 toString() 方法返回的都是數字的十進制表示。因此,以八進制或十六進制字面量形式聲明的數字輸出的都是十進制形式的。
采用 Number 類型的 toString() 方法的基模式,可以用不同的_基_輸出數字,例如二進制的基是 2,八進制的基是 8,十六進制的基是 16。
_基_只是要轉換成的基數的另一種加法而已,它是 toString() 方法的參數:
```
var iNum = 10;
alert(iNum.toString(2)); //輸出 "1010"
alert(iNum.toString(8)); //輸出 "12"
alert(iNum.toString(16)); //輸出 "A"
```
在前面的示例中,以 3 種不同的形式輸出了數字 10,即二進制形式、八進制形式和十六進制形式。HTML 采用十六進制表示每種顏色,在 HTML 中處理數字時這種功能非常有用。
注釋:對數字調用 toString(10) 與調用 toString() 相同,它們返回的都是該數字的十進制形式。
#### 參閱:
請參閱 [JavaScript 參考手冊](/jsref/index.asp "JavaScript 和 HTML DOM 參考手冊")提供的有關 toString() 方法的詳細信息:
* [arrayObject.toString()](/jsref/jsref_toString_array.asp "JavaScript toString() 方法")
* [booleanObject.toString()](/jsref/jsref_toString_boolean.asp "JavaScript toString() 方法")
* [dateObject.toString()](/jsref/jsref_toString_date.asp "JavaScript toString() 方法")
* [NumberObject.toString()](/jsref/jsref_tostring_number.asp "JavaScript toString() 方法")
* [stringObject.toString()](/jsref/jsref_toString_string.asp "JavaScript toString() 方法")
## 轉換成數字
ECMAScript 提供了兩種把非數字的原始值轉換成數字的方法,即 parseInt() 和 parseFloat()。
正如您可能想到的,前者把值轉換成整數,后者把值轉換成浮點數。只有對 String 類型調用這些方法,它們才能正確運行;對其他類型返回的都是 NaN。
### parseInt()
在判斷字符串是否是數字值前,parseInt() 和 parseFloat() 都會仔細分析該字符串。
parseInt() 方法首先查看位置 0 處的字符,判斷它是否是個有效數字;如果不是,該方法將返回 NaN,不再繼續執行其他操作。但如果該字符是有效數字,該方法將查看位置 1 處的字符,進行同樣的測試。這一過程將持續到發現非有效數字的字符為止,此時 parseInt() 將把該字符之前的字符串轉換成數字。
例如,如果要把字符串 "12345red" 轉換成整數,那么 parseInt() 將返回 12345,因為當它檢查到字符 r 時,就會停止檢測過程。
字符串中包含的數字字面量會被正確轉換為數字,比如 "0xA" 會被正確轉換為數字 10。不過,字符串 "22.5" 將被轉換成 22,因為對于整數來說,小數點是無效字符。
一些示例如下:
```
var iNum1 = parseInt("12345red"); //返回 12345
var iNum1 = parseInt("0xA"); //返回 10
var iNum1 = parseInt("56.9"); //返回 56
var iNum1 = parseInt("red"); //返回 NaN
```
parseInt() 方法還有基模式,可以把二進制、八進制、十六進制或其他任何進制的字符串轉換成整數。基是由 parseInt() 方法的第二個參數指定的,所以要解析十六進制的值,需如下調用 parseInt() 方法:
```
var iNum1 = parseInt("AF", 16); //返回 175
```
當然,對二進制、八進制甚至十進制(默認模式),都可以這樣調用 parseInt() 方法:
```
var iNum1 = parseInt("10", 2); //返回 2
var iNum2 = parseInt("10", 8); //返回 8
var iNum3 = parseInt("10", 10); //返回 10
```
如果十進制數包含前導 0,那么最好采用基數 10,這樣才不會意外地得到八進制的值。例如:
```
var iNum1 = parseInt("010"); //返回 8
var iNum2 = parseInt("010", 8); //返回 8
var iNum3 = parseInt("010", 10); //返回 10
```
在這段代碼中,兩行代碼都把字符 "010" 解析成一個數字。第一行代碼把這個字符串看作八進制的值,解析它的方式與第二行代碼(聲明基數為 8)相同。最后一行代碼聲明基數為 10,所以 iNum3 最后等于 10。
#### 參閱
請參閱 [JavaScript 參考手冊](/jsref/index.asp "JavaScript 和 HTML DOM 參考手冊")提供的有關 parseInt() 方法的詳細信息:[parseInt()](/jsref/jsref_parseInt.asp "JavaScript parseInt() 函數")。
### parseFloat()
parseFloat() 方法與 parseInt() 方法的處理方式相似,從位置 0 開始查看每個字符,直到找到第一個非有效的字符為止,然后把該字符之前的字符串轉換成整數。
不過,對于這個方法來說,第一個出現的小數點是有效字符。如果有兩個小數點,第二個小數點將被看作無效的。parseFloat() 會把這個小數點之前的字符轉換成數字。這意味著字符串 "11.22.33" 將被解析成 11.22。
使用 parseFloat() 方法的另一不同之處在于,字符串必須以十進制形式表示浮點數,而不是用八進制或十六進制。該方法會忽略前導 0,所以八進制數 0102 將被解析為 102。對于十六進制數 0xA,該方法將返回 NaN,因為在浮點數中,x 不是有效字符。(**注釋:**經測試,具體的瀏覽器實現會返回 0,而不是 NaN。)
此外,parseFloat() 方法也沒有基模式。
下面是使用 parseFloat() 方法的一些示例:
```
var fNum1 = parseFloat("12345red"); //返回 12345
var fNum2 = parseFloat("0xA"); //返回 NaN
var fNum3 = parseFloat("11.2"); //返回 11.2
var fNum4 = parseFloat("11.22.33"); //返回 11.22
var fNum5 = parseFloat("0102"); //返回 102
var fNum1 = parseFloat("red"); //返回 NaN
```
#### 參閱
請參閱 [JavaScript 參考手冊](/jsref/index.asp "JavaScript 參考手冊")提供的有關 parseFloat() 方法的詳細信息:[parseFloat()](/jsref/jsref_parseFloat.asp "JavaScript parseFloat() 函數")。
## 強制類型轉換
您還可以使用_強制類型轉換(type casting)_來處理轉換值的類型。使用強制類型轉換可以訪問特定的值,即使它是另一種類型的。
編者注:cast 有“鑄造”之意,很貼合“強制轉換”的意思。
ECMAScript 中可用的 3 種強制類型轉換如下:
* Boolean(value) - 把給定的值轉換成 Boolean 型;
* Number(value) - 把給定的值轉換成數字(可以是整數或浮點數);
* String(value) - 把給定的值轉換成字符串;
用這三個函數之一轉換值,將創建一個新值,存放由原始值直接轉換成的值。這會造成意想不到的后果。
### Boolean() 函數
當要轉換的值是至少有一個字符的字符串、非 0 數字或對象時,Boolean() 函數將返回 true。如果該值是空字符串、數字 0、undefined 或 null,它將返回 false。
可以用下面的代碼測試 Boolean 型的強制類型轉換:
```
var b1 = Boolean(""); //false - 空字符串
var b2 = Boolean("hello"); //true - 非空字符串
var b1 = Boolean(50); //true - 非零數字
var b1 = Boolean(null); //false - null
var b1 = Boolean(0); //false - 零
var b1 = Boolean(new object()); //true - 對象
```
### Number() 函數
Number() 函數的強制類型轉換與 parseInt() 和 parseFloat() 方法的處理方式相似,只是它轉換的是整個值,而不是部分值。
還記得嗎,parseInt() 和 parseFloat() 方法只轉換第一個無效字符之前的字符串,因此 "1.2.3" 將分別被轉換為 "1" 和 "1.2"。
用 Number() 進行強制類型轉換,"1.2.3" 將返回 NaN,因為整個字符串值不能轉換成數字。如果字符串值能被完整地轉換,Number() 將判斷是調用 parseInt() 方法還是 parseFloat() 方法。
下表說明了對不同的值調用 Number() 方法會發生的情況:
| 用法 | 結果 |
| --- | --- |
| Number(false) | 0 |
| Number(true) | 1 |
| Number(undefined) | NaN |
| Number(null) | 0 |
| Number("1.2") | 1.2 |
| Number("12") | 12 |
| Number("1.2.3") | NaN |
| Number(new object()) | NaN |
| Number(50) | 50 |
### String() 函數
最后一種強制類型轉換方法 String() 是最簡單的,因為它可把任何值轉換成字符串。
要執行這種強制類型轉換,只需要調用作為參數傳遞進來的值的 toString() 方法,即把 12 轉換成 "12",把 true 轉換成 "true",把 false 轉換成 "false",以此類推。
強制轉換成字符串和調用 toString() 方法的唯一不同之處在于,對 null 和 undefined 值強制類型轉換可以生成字符串而不引發錯誤:
```
var s1 = String(null); //"null"
var oNull = null;
var s2 = oNull.toString(); //會引發錯誤
```
在處理 ECMAScript 這樣的弱類型語言時,強制類型轉換非常有用,不過應該確保使用值的正確。
- JavaScript 基礎
- JavaScript 簡介
- JavaScript 使用
- JavaScript 輸出
- JavaScript 語句
- JavaScript 注釋
- JavaScript 變量
- JavaScript 數據類型
- JavaScript 對象
- JavaScript 函數
- JavaScript 運算符
- JavaScript 比較和邏輯運算符
- JavaScript If...Else 語句
- JavaScript Switch 語句
- JavaScript For 循環
- JavaScript While 循環
- JavaScript Break 和 Continue 語句
- JavaScript 錯誤 - Throw、Try 和 Catch
- JavaScript 表單驗證
- JavaScript 保留關鍵字
- JavaScript JSON
- javascript:void(0) 含義
- JavaScript 高級
- JavaScript 對象
- JavaScript Number 對象
- JavaScript 字符串(String)對象
- JavaScript Date(日期)對象
- JavaScript Array(數組)對象
- JavaScript Boolean(邏輯)對象
- JavaScript Math(算數)對象
- JavaScript RegExp 對象
- JavaScript BOM
- JavaScript Window - 瀏覽器對象模型
- JavaScript Window Screen
- JavaScript Window Location
- JavaScript Window History
- JavaScript Window Navigator
- JavaScript 消息框
- JavaScript 計時
- JavaScript Cookies
- HTML DOM
- HTML DOM 簡介
- HTML DOM 節點
- HTML DOM 方法
- HTML DOM 屬性
- HTML DOM 訪問
- HTML DOM - 修改
- HTML DOM - 修改 HTML 內容
- HTML DOM - 元素
- HTML DOM - 事件
- HTML DOM - 導航
- JavaScript HTML DOM EventListener
- AJAX 教程
- AJAX 簡介
- AJAX 實例
- AJAX - 創建 XMLHttpRequest 對象
- AJAX - 向服務器發送請求
- AJAX - 服務器響應
- AJAX - onreadystatechange 事件
- AJAX ASP/PHP 請求實例
- AJAX 數據庫實例
- AJAX XML 實例
- jQuery 基礎
- jQuery 簡介
- jQuery 安裝
- jQuery 語法
- jQuery 選擇器
- jQuery 事件
- jQuery 效果
- jQuery 效果 - 隱藏和顯示
- jQuery 效果 - 淡入淡出
- jQuery 效果 - 滑動
- jQuery 效果 - 動畫
- jQuery 停止動畫
- jQuery Callback 函數
- jQuery - Chaining
- jQuery HTML
- jQuery - 獲得內容和屬性
- jQuery - 設置內容和屬性
- jQuery - 添加元素
- jQuery - 刪除元素
- jQuery - 獲取并設置 CSS 類
- jQuery - css() 方法
- jQuery - 尺寸
- jQuery 遍歷
- jQuery 遍歷
- jQuery 遍歷 - 祖先
- jQuery 遍歷 - 后代
- jQuery 遍歷 - 同胞
- jQuery 遍歷 - 過濾
- jQuery - AJAX
- jQuery - AJAX 簡介
- jQuery - AJAX load() 方法
- jQuery - AJAX get() 和 post() 方法
- jQuery 雜項
- jQuery - noConflict() 方法
- JavaScript 高級教程
- JavaScript 的歷史
- JavaScript 實現
- ECMAScript 基礎
- ECMAScript 語法
- ECMAScript 變量
- ECMAScript 關鍵字
- ECMAScript 保留字
- ECMAScript 原始值和引用值
- ECMAScript 原始類型
- ECMAScript 類型轉換
- ECMAScript 引用類型
- ECMAScript 運算符
- ECMAScript 一元運算符
- ECMAScript 位運算符
- ECMAScript Boolean 運算符
- ECMAScript 乘性運算符
- ECMAScript 加性運算符
- ECMAScript 關系運算符
- ECMAScript 等性運算符
- ECMAScript 條件運算符
- ECMAScript 賦值運算符
- ECMAScript 逗號運算符
- ECMAScript 語句
- ECMAScript if 語句
- ECMAScript 迭代語句
- ECMAScript 標簽語句
- ECMAScript break 和 continue 語句
- ECMAScript with 語句
- ECMAScript switch 語句
- ECMAScript 函數
- ECMAScript 函數概述
- ECMAScript arguments 對象
- ECMAScript Function 對象(類)
- ECMAScript 閉包(closure)
- ECMAScript 對象
- ECMAScript 面向對象技術
- ECMAScript 對象應用
- ECMAScript 對象類型
- ECMAScript 對象作用域
- ECMAScript 定義類或對象
- ECMAScript 修改對象
- ECMAScript 繼承
- ECMAScript 繼承機制實例
- ECMAScript 繼承機制實現
- Google 地圖API
- Google 地圖API Key
- Google Maps 基礎
- Google 地圖疊加層
- Google 地圖事件
- Google 地圖控件集
- Google 地圖類型
- Google 地圖 API 參考手冊
- 地圖 API Map() 構造器
- 免責聲明