摘要:下面分幾步來簡單的探探不同類型的轉換吧以下的內容,都可以從權威指南中找到。其他值轉換成在編寫代碼的過程中,幾乎不用考慮它的取值類型。核心內置類,會嘗試先于可以理解為對象優先轉換成數字例外的是,利用的是轉換。
弱類型帶來的那些讓人迷糊的事最近在寫公司的登錄注冊模塊,遇到類型不同相比較的時候,就心驚膽戰,每次都要用瀏覽器來驗證一下,決定亂七八糟的隨便寫一下,方便日后自己回顧知識~
弱類型帶來的好處之一:終于不用自己確定數據類型了。
寫C++這類的強類型語言,每次都要先確定是int、char還是string之類的,但是僅僅通過var,怎么解決工作過程中的不同數據類型的比較問題的呢?
這個問題煩了我很久,當初學js的時候就只能記住最簡單的其他類型到boolean的轉換,涉及到其他的,只能暈菜。。。
下面分幾步來簡單的探探不同類型的轉換吧~
以下的內容,都可以從《JavaScript權威指南》中找到。
其他值轉換成boolean在編寫JavaScript代碼的過程中,幾乎不用考慮它的取值類型。在工作過程中,我們有可能會需要在if的條件判斷中對參數進行判斷,這就涉及到了boolean值的轉換。
當JavaScript期望使用一個布爾值的時候,你可以提供任意類型值,JavaScript將根據需要自行轉換類型,一些值(真值)轉為true,其他值(假值)轉為false--《JavaScript權威指南》(page 48)
對于布爾值類型的轉換,實際上只需要特別記住幾個特殊的會轉換成false的值就可以了
這些值包括:undefined、null、false、""、0、-0、NaN
所有的其他值(包括所有對象)都會轉換成true
一般在工作中,我們可以直接使用:
if (value){ ... }
根據js的語言特性,可以讓瀏覽器直接替我們判斷,省時省力,我個人不太喜歡下面的寫法:
if (value == null){ ... }
盡管這樣也可以達成目標,但是總感覺多敲了代碼,還需要特別注意如果不是null或者undefined,但也是假值的情況。
需要特別注意:假值中包含0 or -0的情況
還有一個小點需要特別注意一下:jQuery中選擇符選擇某個DOM節點,也許這個DOM節點并不存在,但是$(selector)返回的值是一個對象,所以,我們判斷是否存在這個DOM,需要通過$(selector).length > 0來判斷是否存在。
原始值轉換成字符串原始值:數字、字符串、布爾值、null、undefined
原始值轉換成字符串的情況估計是最簡單的了,可以直接理解成在原始值的兩邊加上""就行了
undefined --> "undefined" null --> "null" true --> "true" false --> "false" 0 --> "0" -0 --> "-0" NaN --> "NaN" Infinity --> "Infinity" -Infinity --> "-Infinity" 1 --> "1" ......原始值轉換成數字
除了字符串,大部分原始值都會有固定的轉換結果,如下:
undefined --> NaN null --> 0 true --> 1 false --> 0
但是,字符串的轉換有點微妙,給我的感覺有點類似Number()方法,但是注意,只是類似,調用Number()會生成包裝對象,而不是一個數字。
字符串轉換成數字,會有以下的特點:
以數字表示的字符串可以直接轉換成數字
允許字符串開頭跟結尾帶有空格
在開始和結尾處的任意非空格符都不會被當成數字直接量的一部分,轉換結果變成NaN
結果如下:
"one" --> NaN "u123" --> NaN " 123" --> 123 "123 " --> 123 " 12 " --> 12原始值轉換成對象
原理:原始值通過調用String()、Number()、Boolean()構造函數,轉換成他們各自的包裝對象
存取字符串、數字或者布爾值的屬性的時候創建的臨時對象叫做包裝對象,他只是偶爾用來區分字符串值和字符串對象、數字和數值對象以及布爾值布爾對象。通常,包裝對象只是被看做是一種實現細節,而不用特別關注。--《JavaScript權威指南》(page46)
但是null和undefined信仰比較堅定,就是不想轉成對象,從而,當將它們用在期望是一個對象的地方都會拋出一個錯誤throws TypeError
注意:只是在轉換的過程中會拋出Error,在顯性創建對象的時候,不會報錯
對象轉換成原始值,可以分成以下三種:
對象轉換成boolean值
對象轉換成字符串(object-to-string)
對象轉換成數字(object-to-number)
其中,對象轉換成boolean值,規則非常簡單:所有的對象都轉換成true(包括包裝對象)
注意:new Boolean(false)是一個對象,轉換成布爾值也是true
而對象轉換成字符串以及對象轉換成數字根據場景不同,有些復雜,在學習了解他們的轉換過程之前,先來看兩個函數:toString()以及valueOf()
1、在MDN中搜索toString,你會發現如下情形:
如果細細查看,你會發現:所有的對象都有toString()方法,作用就是返回一個反映這個對象的字符串。
但是,這個方法返回的值有些時候不是那么的好。
例如:Object.prototypr.toString()
默認情況下,每個對象都會從Object上繼承到toString()方法,如果這個方法沒有被這個對象自身或者更接近的上層原型上的同名方法覆蓋(遮蔽),則調用該對象的toString()方法時會返回"[object type]",這里的字符串type表示了一個對象類型。
例如:
var o = new Object(); o.toString() //返回[object Object]
很多類定義了很多特定版本的toString()方法:
數組類Array.prototype.toString()
函數類Function.prototype.toString()
日期類Date.prototype.toString()
正則類RegExp.prototype.toString()
······
使用方法及返回結果如下:
2、在MDN搜索valueOf,可以得到與toString相似的結果。
但是,這個方法的任務并沒有詳細的定義,我甚至無法從MDN的描述中得出它與toString的區別。
JavaScript calls the valueOf method to convert an object to a primitive value. You rarely need to invoke the valueOf method yourself; JavaScript automatically invokes it when encountering an object where a primitive value is expected.
也許從下面的代碼中我們可以初窺一二:
[1,2,3].toString() // --> "1,2,3" [1,2,3].valueOf() // --> [1, 2, 3] (function(x){f(x);}).toString() // --> "function (x){f(x);}" (function(x){f(x);}).valueOf() // --> function anonymous(x) /d+/g.toString() // -->"/d+/g" /d+/g.valueOf() // --> /d+/g new Date(2010,0,1).toString() // --> "Fri Jan 01 2010 00:00:00 GMT+0800 (中國標準時間)" new Date(2010,0,1).valueOf() // --> 1262275200000
根據上面的結果,可以嘗試得出以下的結論:
對象是復合值,而且大多數對象無法真正表示為一個原始值,因此默認的`valueOf()`方法簡單地返回對象本身,而不是返回一個原始值
數組、函數以及正則表達式簡單地繼承了這個默認的方法,而日期類定義的valueOf()方法返回它的一個內部表示:1970年1月1日以來的毫秒數
有了上面的兩個方法,我們就可以進行對象到字符串以及對象到數字的轉換了。
對象到字符串的轉換的步驟如下:
如果對象具有toString()方法,那么就調用這個方法,返回一個原始值,如果這個值本身不是字符串,JavaScript會將其轉換成字符串,并返回字符串的結果。
如果沒有toString()方法,或者這個方法不返回一個原始值,那么調用valueOf()方法,返回一個原始值,如果這個值本身不是字符串,JavaScript會將其轉換成字符串,并返回字符串的結果。
否則JavaScript無法從toString()或者valueOf()獲得一個原始值,這時拋出一個類型錯誤。
對象到數字的轉換的步驟如下:
如果對象具有valueOf()方法,那么就調用這個方法,返回一個原始值,如果這個值本身不是字符串,JavaScript會將其轉換成字符串,并返回字符串的結果。
如果沒有valueOf()方法,或者這個方法不返回一個原始值,那么調用toString()方法,返回一個原始值,如果這個值本身不是字符串,JavaScript會將其轉換成字符串,并返回字符串的結果。
否則JavaScript無法從toString()或者valueOf()獲得一個原始值,這時拋出一個類型錯誤。
結束了?你還沒考慮應用呢!由于JavaScript是弱類型語言,所以我們對于類型轉換的應用其實有許多。
例如:if判斷、+運算符以及==運算符等等
關于+:
進行數字加法以及字符串連接操作
如果其中的一個操作數是對象,則將對象轉換成原始值
==也是js判斷中常用的涉及到類型轉換的一個運算符
關于==:
如果兩個值類型相同,進行===比較
如果兩個值類型不同,他們可能相等,需要按照一定的規則來進行類型轉換并比較
==類型不同時的轉換規則:
如果一個值是null,另一個值是undefined,則相等
如果一個是字符串,另一個值是數字,則把字符串轉換成數字,進行比較
如果任意值是true,則把true轉換成1再進行比較;如果任意值是false,則把false轉換成0再進行比較
如果一個是對象,另一個是數值或字符串,把對象轉換成基礎類型的值再比較。對象轉換成基礎類型,利用它的toString或者valueOf方法。 js核心內置類,會嘗試valueOf先于toString(可以理解為對象優先轉換成數字);例外的是Date,Date利用的是toString轉換。非js核心的對象,通過自己的實現中定義的方法轉換成原始值
關于比較運算符<、|、>、|、<、=、|、>、=
如果操作數為對象,那么這個對象將轉換成原始值:如果valueof()返回一個原始值,那么直接使用這個原始值。否則,使用toString()的轉換結果進行比較操作
在對象轉換成原始值之后,如果兩個操作數都是字符串,那么將按照字母表的順序對兩個字符串進行比較,字母表的順序是指組成這個字符串的16位unicode字符的索引順序。注意:字符串比較是區分大小寫的,所有大寫的ASCII字母都小于所有小寫的ASCII字母
在對象轉換成原始值之后,如果至少有一個操作數不是字符串,那么兩個操作數都將轉換成數字進行數值比較。0與-0是相等的。Infinity比其他任何數字都大(除了Infinity本身),-Infinity比其他任何數字都要小(除了它本身)。如果其中一個操作數是(或轉換后是)NaN,那么比較操作符總是返回false
加號運算符與比較運算符的區別
加法運算符更偏愛字符串的操作,比較運算符更偏愛數字
只有兩個操作數都是字符串,才進行字符串的比較
1+2 //加法,結果是3 "1"+"2" //字符串連接,結果是"12" "1"+2 //字符串連接,結果是"12" 11 < 2 //數字的比較,結果是false "11" < "3" //字符串比較,結果為true "11" < 3 // 數字比較,"11"轉換成11,結果為false "one" < 3 //數字的比較,"one"轉換成NaN,結果為false
注意:<=以及>=在判斷相等的情況的時候,并不依賴相等或者嚴格相等運算符的比較規則,它們只是簡單的不大于、不小于
反思昨天公司的一件事對我的觸動挺大的,公司里面的兩個后臺為了表單提交是用GET還是POST爭吵了半個小時。有些時候,不經意就會忽略一些問題,比如代碼的質量,性能的提高,這些都是值得程序猿們深入探究的問題。
記得有過這樣一句話“你對待技術的態度,就是你對待生命的態度”。
作為一名小猿,繼續奮斗去嘍~
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/91541.html
摘要:數據類型轉換原文鏈接是一種弱類型語言,即不需要明確聲明變量的類型,可以隨時賦予任意類型的值。強制轉換顯式轉換強制轉換主要指使用和三個構造函數,手動將各種類型的值,轉換成數字字符串或者布爾值。如果該值不能完全轉換為整型或浮點型,則返回。 JavaScript 數據類型轉換 原文鏈接 JavaScript 是一種弱類型語言,即不需要明確聲明變量的類型,可以隨時賦予任意類型的值。 強制轉換...
摘要:但是,我們可以借用類數組方法不難看出,此時的在調用數組原型方法時,返回值已經轉化成數組了。很多時候,深入看看源代碼也會讓你對這個理解的更透徹。的前端樂園原文鏈接深入理解類數組 起因 寫這篇博客的起因,是我在知乎上回答一個問題時,說自己在學前端時把《JavaScript高級程序設計》看了好幾遍。于是在評論區中,出現了如下的對話:showImg(https://segmentfault.c...
摘要:同理,若為,返回的結果若為或者,且為,返回的結果。同理,若為或者,且為,返回的結果是對象轉換基本類型的方法。看個例子根據上述規則來解析為,上式為第條上式為第條上式為,上式為第條上式為 前不久因為一個項目設計的問題,煩心了好幾天,為了不留坑擁抱強類型語言特點,還是選擇了===作為數據判斷是否相等,對于==今天來探究一下貓膩(弱類型的JavaScript的坑真的太多了,typescript...
摘要:抽象語法樹大致流程生成然后通過類型斷言進行相應的轉換反編譯工具全集小程序推薦逆向反編譯四大工具利器年支持的反編譯工具匯總原文 像軟件加密與解密一樣,javascript的混淆與解混淆同屬于同一個范疇。道高一尺,魔高一丈。沒有永恒的黑,也沒有永恒的白。一切都是資本市場驅動行為,現在都流行你能為人解決什么問題,這個概念。那么市場究竟能容納多少個能解決這種問題的利益者。JS沒有秘密。 其實本...
摘要:的目標是對高級程序中間表示的適當低級抽象,即代碼旨在由編譯器生成而不是由人來寫。表示把源代碼變成解釋器可以運行的代碼所花的時間表示基線編譯器和優化編 WebAssembly 那些事兒 什么是 WebAssembly? WebAssembly 是除 JavaScript 以外,另一種可以在網頁中運行的編程語言,并且相比之下在某些功能和性能問題上更具優勢,過去我們想在瀏覽器中運行代碼來對網...
閱讀 1682·2019-08-30 15:54
閱讀 3332·2019-08-26 17:15
閱讀 3522·2019-08-26 13:49
閱讀 2582·2019-08-26 13:38
閱讀 2291·2019-08-26 12:08
閱讀 3035·2019-08-26 10:41
閱讀 1369·2019-08-26 10:24
閱讀 3376·2019-08-23 18:35