JavaScript 資料型別轉換

資料型別轉換在轉換方式分為兩種：

（1）.顯式資料型別轉換，指定由某種型別轉換到另一種型別。

（2）.隱式資料型別轉換，程式碼根據上下文自動判斷型別轉換。

資料型別的轉換又可以分為三種：

（1）.值型別之間資料轉換。

（2）.值型別轉換到引用型別。

（3）.引用型別轉換到值型別。

首先看一段程式碼例項：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
console.log("15"==15);

程式碼執行效果截圖如下：

字串與數字也可以比較大小，因為進行隱式資料型別轉換。

首先將字串"15"轉換為數字15，再進行大小比較。

一.值型別之間資料轉換：

JavaScript中的資料型別本文不再介紹，參閱JavaScript 資料型別一章節。

當前具有的值型別有如下六種：

（1）.boolean

（2）.string

（3）.number

（4）.null

（5）.undefined

（6）.symbol（ES2015）

特別說明：

（1）.null與undefined都屬於自有型別，也就是說null型別與undefined型別下都只有一個資料，null與undefined。

（2）.typeof null返回值雖然是object，但它實質是一個值型別資料，這是一個ES設計問題，以後可能會修復。

值型別轉換規則如下：

上述程式碼演示值型別之間資料型別轉換的規則，可以起到舉一反三的作用。

如果是隱式資料型別轉換，上述規則完全適用，但是如果要顯式轉換，則需要根據實際使用的轉換方式。

比如使用parseFloat方法，則會得到不同的轉化結果，程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let numStr="88ant";
console.log(+numStr);
console.log(parseInt(numStr));

程式碼執行效果截圖如下：

轉換結果完全不同，程式碼分析如下：

（1）.使用加號會將字串轉換為數字，進行隱式資料型別轉換，轉換失敗。

（2）.使用parseInt毫無疑問將轉換成功。

二.值型別轉換為引用型別：

值型別資料轉換為對應的引用型別，規則比較簡單。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼
let num=new Number("5");
let str=new String("ant");
let bl=new Boolean(true);

利用各自建構函式，將值型別資料轉換為對應的引用型別資料即可。

再來看一段程式碼例項：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let str="antzone";
let num=8;
console.log(str.length);
console.log(num.toFixed());

通常來講只有引用型別資料才會有屬性和方法，那為什麼值型別字串和數字都可以使用屬性和方法。

這是因為在引用屬性或呼叫方法之前，內部首先會將值型別暫時包裝為引用型別，這也算是一種轉換方式吧。

三.引用型別轉換為值型別:

1.轉為布林值：

任何引用型別物件轉換為布林值都是true，沒有例外。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
let b=new Boolean(false); 
if(obj){console.log("螞蟻部落");}

程式碼執行效果截圖如下：

即便建構函式的引數為false，只要是引用型別資料，轉為布林值一定為true。

2.轉換為字串或者數字：

利用toString()和valueOf()，可以將值型別資料轉換為字串或者數字。

（1）.toString()：

此方法可以將值型別資料轉換為它的字串形式。

String、Array、Date等物件的toString方法都繼承自Object物件。

並且根據需要都進行重寫，所以每一個物件呼叫toString方法返回的結果不同。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
// 返回對應的字串"螞蟻部落"
console.log((new String("螞蟻部落")).toString());
// 將陣列中元素用逗號連線成字串
console.log(["螞蟻部落","成立","4","週年"].toString());
// 返回函式的宣告字串
console.log((function(a,b){return a+b}).toString())
// 返回時間日期物件的字串形式
console.log((new Date()).toString())
// 返回正規表示式直接量
console.log((new RegExp("\\d")).toString())

程式碼執行效果截圖如下：

不同型別物件對toString方法進行了不同的重寫，從而可以返回各自物件的字串表示方式。

（2）.valueOf()：

此方法的目的是返回一個表示引用型別資料值型別資料的值。

引用型別是一個複雜的結構，不同型別物件呼叫此方法，返回值也不同。

一定有一個意識，它的返回值並不一定是數值型別。

返回值規則大致如下：

（1）.函式、陣列和正規表示式返回物件本身。

（2）.Date物件則返回一個時間戳。

（3）.布林型和Number物件則返回對應的布林值。

程式碼例項如下：

3.轉換為數字和字串：

很多朋友會認為，將資料轉換為字串或者數字的規則如下：

（1）.首先嚐試呼叫toString方法。

（2）.如果toString方法不存在,再去嘗試呼叫valueOf方法。

上面這種觀點完全是錯誤的，出去Date物件外，無論轉換成數字還是字串，都是首先嚐試呼叫valueOf方法。

Date物件則比較靈活，會根據上下文判斷呼叫哪個方法，後面會有程式碼演示。

[JavaScript] 純文字檢視 複製程式碼執行程式碼
Object.prototype.toString=function(){ 
  console.log("tostring"); 
  return "螞蟻部落"; 
} 
Object.prototype.valueOf=function(){ 
  console.log("valueOf"); 
  return "88"; 
} 
var obj=new Object(); 
console.log(obj+"");

程式碼執行效果截圖如下：

上面演示的是將obj隱式轉換為字串，可以看到，會首先嚐試呼叫valueOf方法。

對於轉換為數字也是同樣的道理，不做演示，下面再看Date物件的。

Date物件非常的靈活，會根據上下文的不同自行決定呼叫哪個方法，程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
Date.prototype.toString=function(){ 
  console.log("tostring"); 
  return "螞蟻部落"; 
} 
Date.prototype.valueOf=function(){ 
  console.log("valueOf"); 
  return "88"; 
} 
let d=new Date(); 
console.log(+d);
console.log(d+"");

程式碼執行效果截圖如下：

在數值上下文環境則呼叫valueOf方法，字串環境則呼叫toString方法。

四.隱式資料型別轉換：

考慮到文章的篇幅問題，本文不再介紹隱式資料型別轉換的相關知識。

具體參閱JavaScript 隱式資料型別轉換一章節。