簡單介紹JavaScript數(shù)據(jù)類型之隱式類型轉換
JavaScript的數(shù)據(jù)類型分為六種,分別為null,undefined,boolean,string,number,object。object是引用類型,其它的五種是基本類型或者是原始類型。我們可以用typeof方法打印來某個是屬于哪個類型的。不同類型的變量比較要先轉類型,叫做類型轉換,類型轉換也叫隱式轉換。隱式轉換通常發(fā)生在運算符加減乘除,等于,還有小于,大于等。。
typeof '11' //string typeof(11) //number '11' < 4 //false
本章節(jié)單獨介紹一下javascript中的隱式數(shù)據(jù)類型轉換,對于它的良好掌握,在實際應用能夠簡化很多操作。
看如下代碼實例:
var arr = [5]; console.log(arr+"");
上面的代碼就是將數(shù)組隱式轉換為字符串的一個操作,是不是要比下面的方式要簡單不少:
var arr = [5]; console.log(arr.toString());
像上面類似的隱式數(shù)據(jù)類型轉換在實際編碼中應用很多,下面進入正題。
一.值類型之間的數(shù)據(jù)類型轉換:
javascript中的數(shù)據(jù)類型可以參閱javascript數(shù)據(jù)類型詳解一章節(jié)。
(1).數(shù)字和字符串使用+運算符:
數(shù)字和字符串如果使用+運算符進行操作,那么會將數(shù)字先轉換為字符串,然后進行字符串連接操作:
var antzone = "antzone"; var num = 8; console.log(antzone+num);
(2).布爾值參與的+運算符操作:
如果有布爾型參與,那么首先會將布爾值轉換為對應的數(shù)字或者字符串,然后再進行相應的字符串連接或者算數(shù)運算。
var bool = true; var num = 8; console.log(bool + num);
上面的代碼是先將true轉換為數(shù)字1,然后再進行算數(shù)加運算。
var bool = true; var num = "8"; console.log(bool + num);
上面的布爾值會被轉換為對應的字符串形式"true",然后再進行字符串連接。
(3).減法操作:
如果進行減法操作,那么兩個操作數(shù)都會先被轉換為數(shù)字,然后在進行算數(shù)運算:
var bool = true; var num = "8"; console.log(bool - num);
true會被轉換為數(shù)字1,字符串"8"會被轉換為數(shù)字8,然后進行算術運算。
乘,除,大于,小于跟減的轉換也是一樣,就不再舉例子了。
(4).==等性運算:
undefined和null比較特殊,它們兩個使用==運算符返回值是true。
console.log(undefined==null);
其他值類型進行比較的時候都會將運算數(shù)轉換為數(shù)字
console.log("3"==3);
上面的代碼會將字符串"3"轉換成數(shù)字,然后再進行比較。
console.log("1"==true);
上面的代碼會分別將"1"和true轉換成數(shù)字,然后進行比較。
二.引用類型轉值類型:
引用類型(對象)轉換為值類型則要復雜很多,下面分布展開介紹。
對象繼承的兩個方法可以幫助我們實現(xiàn)對象到值類型的轉換功能:
(1).toString()方法。
(2).valueOf()方法。
通常情況下我們認為,將一個對象轉換為字符串要調用toString()方法,轉換為數(shù)字要調用valueOf()方法,但是真正應用的時候并沒有這么簡單,看如下代碼實例:
var obj = { webName: "腳本之家", url:"softwhy.com" } console.log(obj.toString());
從上面的代碼可以看出,toString()方法并沒有將對象轉換為一個能夠反映此對象的字符串。
var arr = [1, 2, 3]; console.log(arr.valueOf());
從上面的代碼可以看出,valueOf()方法并沒有將對象轉換為能夠反映此對象的一個數(shù)字。
var arr = [1, 2, 3]; console.log(arr.toString());
數(shù)組對象的toString()方法能夠將數(shù)組轉換為能夠反映此數(shù)組對象的字符串。
總結如下:
(1).有些對象只是簡單繼承了toString()或者valueOf()方法,比如第一個例子。
(2).有些對象則不但是繼承了兩個方法,而且還進行了重寫。
所以有些對象的方法能夠達成轉換成字符串或者數(shù)字的目標,有些則不能。
調用toString()或者valueOf()將對象轉換成字符串或者數(shù)字的規(guī)則如下:
調用toString()時,如果對象具有這個方法,則調用此方法;如果此方法返回一個值類型數(shù)據(jù),那么就返回這個值類型數(shù)據(jù),然后再根據(jù)所處的上下文環(huán)境進行相關數(shù)據(jù)類型轉換。如果沒有toString(),或者此方法返回值并不是一個值類型數(shù)據(jù),那么就會調用valueOf()(如果此方法存在的話),如果valueOf()返回一個值類型數(shù)據(jù),那么再根據(jù)所處的上下文環(huán)境進行相關的數(shù)據(jù)類型轉換。
進一步說明:
(1).上面介紹了通常默認情況下valueOf()和toString()方法的作用(將對象轉換為數(shù)字或者字符串),但是需要注意的是,這并不是硬性規(guī)定,也就是說并不是valueOf()方法必須要返回數(shù)字或者toString()方法必須要轉換為字符串,比如簡單繼承的這兩個方法就無法進行實現(xiàn)轉換為數(shù)字和字符串的功能,再比如,我們可以自己稱謝這兩個方法,返回值也沒有必要是數(shù)字或者字符串。
(2).還有需要特別注意的一點就是,很多朋友認為,轉換為字符串首先要調用toString()方法, 其實這是錯誤的認識,我們應該這么理解,調用toString()方法可以轉換為字符串,但不一定轉換字符串就是首先調用toString()方法。
看如下代碼實例:
var arr = []; arr.valueOf = function () { return "1"; } arr.toString = function () { return "2"; } console.log(arr + "1");
上面的代碼中,arr是要被轉換為字符串的,但是很明顯是調用的valueOf()方法,而沒有調用toString()方法。有些朋友可能會有這樣的質疑,難道[2]這樣的數(shù)字轉換成字符串"2",不是調用的toString()方法嗎。
代碼如下:
var arr = [2]; console.log(arr + "1");
其實過程是這樣的,首先arr會首先調用valueOf()方法,但是數(shù)字的此方法是簡單繼承而來,并沒有重寫(當然這個重寫不是我們實現(xiàn)),返回值是數(shù)組對象本身,并不是一個值類型,所以就轉而調用toString()方法,于是就實現(xiàn)了轉換為字符串的目的。
總結如下:
大多數(shù)對象隱式轉換為值類型都是首先嘗試調用valueOf()方法。但是Date對象是個例外,此對象的valueOf()和toString()方法都經(jīng)過精心重寫,默認是調用toString()方法,比如使用+運算符,如果在其他算數(shù)運算環(huán)境中,則會轉而調用valueOf()方法。
代碼實例如下:
var date = new Date(); console.log(date + "1"); console.log(date + 1); console.log(date - 1); console.log(date * 1);
以上內容是小編給大家介紹的JavaScript數(shù)據(jù)類型之隱式類型轉換的全部內容,希望大家喜歡。
相關文章
Firefox/Chrome/Safari的中可直接使用$/$$函數(shù)進行調試
偶然發(fā)現(xiàn)的,頁面中沒有引入Prototype和jQuery??刂婆_中敲$卻發(fā)現(xiàn)是一個函數(shù)。又試著敲$$,也是個function2012-02-02JavaScript常用函數(shù)工具集:lao-utils
現(xiàn)在Javascript庫海量,流行的也多,比如jQuery,YUI等,雖然功能強大,但也是不萬能的,功能不可能涉及方方面面,這里給大家分享一個的JS庫是對這些的補充,很多也比較實用,把應用到項目中中去也比較方面,這也是對工作的一些積累,也加深對知識的理解。2016-03-03基于JavaScript實現(xiàn)通用tab選項卡(通用性強)
選項卡在大量的網(wǎng)站都有應用,雖然形式各有不同,但是索要達成的目的都是一樣的,一般都是為了進行分類或者節(jié)省網(wǎng)頁空間只用,算是一件利器,下面就是一個選項卡的代碼實例,通用性很強,下面就和大家分享一下2016-01-01Js得到radiobuttonlist選中值的兩種方法(推薦)
下面小編就為大家?guī)硪黄狫s得到radiobuttonlist選中值的兩種方法(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-08-08《javascript設計模式》學習筆記四:Javascript面向對象程序設計鏈式調用實例分析
這篇文章主要介紹了Javascript面向對象程序設計鏈式調用,結合實例形式分析了《javascript設計模式》中鏈式調用的原理與簡單使用技巧,需要的朋友可以參考下2020-04-04