1. 程式人生 > >簡單說 JavaScript中的tostring( ) 與 valueOf( )方法

簡單說 JavaScript中的tostring( ) 與 valueOf( )方法

說明

所有的物件都繼承有toString() 和 valueOf() 方法,物件到字串,物件到數字的轉換,會通過呼叫待轉換物件的這兩個方法中的一個來完成。

解釋

toString( )方法的作用是:

返回一個反映這個物件的字串,而很多類都定義了不同版本的toString( )。

物件 操作
預設 返回 “[object class]”,其中 class是物件型別的名稱。其中class是該物件的類:值為”Object”、”String”、”Number”、”Function”、”Window”、”Document”、等。
Array 將 Array 的元素轉換為字串。結果字串由逗號分隔,且連線起來。
Boolean 如果 Boolean 值是 true,則返回 “true”。否則,返回 “false”。
Date 返回日期的文字表示法。
Error 返回一個包含相關錯誤訊息的字串。
Function 返回如下格式的字串,其中 functionname 是被呼叫 toString 方法函式的名稱:function functionname( ) { [native code] }
RegExp 返回正則表示式直接量的字串
Number 返回數字的文字表示。
String 返回 String 物件的值。
({}.toString());       //
=> "[object Object]" [1,2].toString(); //=> "1,2" true.toString(); //=> "true" new Date(1970,0,1).toString(); //=> "Thu Jan 01 1970 00:00:00 GMT+0800 (CST)" Error("一個錯誤資訊").toString(); //=> "Error: 一個錯誤資訊" (function (x){return x}).toString(); //=> "function (x){return x}"
/\d/.toString(); //=> "/\\d/" 或者 "/\d/" 瀏覽器不同返回也可能會不同

valueOf() 方法,它的作用是:

如果物件存在任意原始值,它就預設將物件轉換為表示它的原始值,如果物件是複合值,而且大多數物件無法真正表示為一個原始值,因此預設的valueOf( )方法簡單地返回物件本身,而不是返回一個原始值。

陣列、函式、和正則表示式簡單的繼承了這個預設方法,呼叫這些型別的例項的valueOf( )方法只是簡答返回物件本身。

日期類定義的valueOf( )方法會返回它的一個內部表示:1970年1月1日以來的毫秒數。

[1,2].valueOf();  //=>  [1,2]  

(function (){}).valueOf();   //=>  function (){}

/\d/.valueOf();    //=>  /\d/  

new Date().valueOf();   //=>  1502941383029

原始值:不可變更的值,包括undefined、null、布林值、數字、和字串。
看下面這張圖,列出了一些基本的型別轉換,這張圖來自 JavaScript權威指南。
這裡寫圖片描述

好了,我們現在已經瞭解toString( )方法 和 valueOf( )方法了,下來我們來說說,物件到字串和物件到數字的轉換。

物件到字串的轉換:

1、如果物件具有toString( )方法,則呼叫這個方法。如果她返回一個原始值,JavaScript將這個值轉換為字串(如果本身不是字串的話),並返回這個字串結果。
2、如果物件沒有toString( )方法,或者這個方法並不返回一個原始值,那麼JavaScript會呼叫valueOf( )方法。如果存在這個方法,則JavaScript呼叫它。如果返回值是原始值,JavaScript將這個值轉換為字串(如果本身不是字串的話),並返回這個字串結果。
3、否則,JavaScript無法從toString()或者valueOf( )獲得一個原始值,因此這時它將丟擲一個型別錯誤異常。

這裡寫圖片描述

物件到數字的轉換:

1、如果物件具有valueOf( )方法,後者返回一個原始值,則JavaScript將這個原始值轉換為數字(如果需要的話)並返回這個數字。
2、否則,如果物件具有toString( )方法,後者返回一個原始值,則JavaScript將其轉化並返回。
3、否則,JavaScript丟擲一個型別錯誤異常。

這裡寫圖片描述

所以這就解釋了,為什麼空陣列會被轉換為數字0,為什麼具有單個元素的陣列同樣會轉換成一個數字。
陣列繼承了預設的valueOf( )方法,這個方法返回一個物件而不是一個原始值,因此,陣列到數字的轉換則呼叫toString( )方法。空陣列轉換為空字串,空字串轉換為數字0。
含有一個元素的陣列轉換為字串的結果和這個元素轉換字串的結果一樣。
如果陣列只包含一個數字元素,這個數字轉換為字串,在轉換回數字。

JavaScript中的”+”運算子可以進行數學加法和字串連線操作。如果它的其中一個運算元是物件,則JavaScript將使用特殊的方法將物件轉換為原始值,而不是使用其他算術運算子的方法執行物件到數字的轉換,”= =”相等運算子與此類似。如果將物件和一個原始值比較,則轉換將會遵照物件到原始值的轉換方式進行。

“+” 和 “= =”應用的物件到原始值的轉換包含日期物件的一種特殊情形。日期類是JavaScript語言核心中唯一的預先定義型別,它定義了有意義的向字串和數字型別的轉換。
對於所有非日期的物件來說,物件到原始值的轉換基本上是物件到數字的轉換(首先呼叫valueOf( )),日期物件則使用物件到字串的轉換模式,然而,這裡的轉換和上文講述的並不完全一致:通過valueOf( )或者toString( )返回的原始值將被直接使用,而不會被強制轉換為數字或字串。

和”= =”一樣,”<”運算子以及其他關係運算符也會做物件到原始值的轉換,但要除去日期物件的特殊情形:任何物件都會首先嚐試呼叫valueOf( ),然後呼叫toString( )。不管得到的原始值是否直接使用,它都不會進一步被轉換為數字或字串。

總結

本文說了說 toString( )方法 和 valueOf( )方法的基礎知識,文中的許多概念是出自JavaScript權威指南一書,大家可以多看看書。
如果這篇文章理解了,大家可以看看下面這兩篇文章,相信你會知道更多有趣的事。
簡單說 !![]==true 與 []==true 引發的思考
簡單說 通過JS的隱式轉換,關鍵時刻救你一命

這裡寫圖片描述