淺談JS包裝對(duì)象
對(duì)象是JavaScript語(yǔ)言最主要的數(shù)據(jù)類(lèi)型,三種原始類(lèi)型的值——數(shù)值、字符串、布爾值——在一定條件下,也會(huì)自動(dòng)轉(zhuǎn)為對(duì)象,也就是原始類(lèi)型的“包裝對(duì)象”(wrapper)。
所謂“包裝對(duì)象”,指的是與數(shù)值、字符串、布爾值分別相對(duì)應(yīng)的Number、String、Boolean三個(gè)原生對(duì)象。這三個(gè)原生對(duì)象可以把原始類(lèi)型的值變成(包裝成)對(duì)象。
var v1 = new Number(123);var v2 = new String(’abc’);var v3 = new Boolean(true);typeof v1 // 'object'typeof v2 // 'object'typeof v3 // 'object'v1 === 123 // falsev2 === ’abc’ // falsev3 === true // false
上面代碼中,基于原始類(lèi)型的值,生成了三個(gè)對(duì)應(yīng)的包裝對(duì)象。可以看到,v1、v2、v3都是對(duì)象,且與對(duì)應(yīng)的簡(jiǎn)單類(lèi)型值不相等。
包裝對(duì)象的設(shè)計(jì)目的,首先是使得“對(duì)象”這種類(lèi)型可以覆蓋JavaScript所有的值,整門(mén)語(yǔ)言有一個(gè)通用的數(shù)據(jù)模型,其次是使得原始類(lèi)型的值也有辦法調(diào)用自己的方法。
Number、String和Boolean這三個(gè)原生對(duì)象,如果不作為構(gòu)造函數(shù)調(diào)用(即調(diào)用時(shí)不加new),而是作為普通函數(shù)調(diào)用,常常用于將任意類(lèi)型的值轉(zhuǎn)為數(shù)值、字符串和布爾值。
// 字符串轉(zhuǎn)為數(shù)值Number(’123’) // 123// 數(shù)值轉(zhuǎn)為字符串String(123) // '123'// 數(shù)值轉(zhuǎn)為布爾值Boolean(123) // true
總結(jié)一下,這三個(gè)對(duì)象作為構(gòu)造函數(shù)使用(帶有new)時(shí),可以將原始類(lèi)型的值轉(zhuǎn)為對(duì)象;作為普通函數(shù)使用時(shí)(不帶有new),可以將任意類(lèi)型的值,轉(zhuǎn)為原始類(lèi)型的值。
實(shí)例方法三種包裝對(duì)象各自提供了許多實(shí)例方法。這里介紹兩種它們共同具有、從Object對(duì)象繼承的方法:valueOf()和toString()。
valueOf()
valueOf()方法返回包裝對(duì)象實(shí)例對(duì)應(yīng)的原始類(lèi)型的值。
new Number(123).valueOf() // 123new String(’abc’).valueOf() // 'abc'new Boolean(true).valueOf() // true
toString()
toString()方法返回對(duì)應(yīng)的字符串形式。
new Number(123).toString() // '123'new String(’abc’).toString() // 'abc'new Boolean(true).toString() // 'true'原始類(lèi)型與實(shí)例對(duì)象的自動(dòng)轉(zhuǎn)換
某些場(chǎng)合,原始類(lèi)型的值會(huì)自動(dòng)當(dāng)作包裝對(duì)象調(diào)用,即調(diào)用包裝對(duì)象的屬性和方法。這時(shí),JavaScript 引擎會(huì)自動(dòng)將原始類(lèi)型的值轉(zhuǎn)為包裝對(duì)象實(shí)例,并在使用后立刻銷(xiāo)毀實(shí)例。
比如,字符串可以調(diào)用length屬性,返回字符串的長(zhǎng)度。
’abc’.length // 3
上面代碼中,abc是一個(gè)字符串,本身不是對(duì)象,不能調(diào)用length屬性。JavaScript 引擎自動(dòng)將其轉(zhuǎn)為包裝對(duì)象,在這個(gè)對(duì)象上調(diào)用length屬性。調(diào)用結(jié)束后,這個(gè)臨時(shí)對(duì)象就會(huì)被銷(xiāo)毀。這就叫原始類(lèi)型與實(shí)例對(duì)象的自動(dòng)轉(zhuǎn)換。
var str = ’abc’;str.length // 3// 等同于var strObj = new String(str)// String {// 0: 'a', 1: 'b', 2: 'c', length: 3, [[PrimitiveValue]]: 'abc'// }strObj.length // 3
自動(dòng)轉(zhuǎn)換生成的包裝對(duì)象是只讀的,無(wú)法修改。所以,字符串無(wú)法添加新屬性。
var s = ’Hello World’;s.x = 123;s.x // undefined
上面代碼為字符串s添加了一個(gè)x屬性,結(jié)果無(wú)效,總是返回undefined。
另一方面,調(diào)用結(jié)束后,包裝對(duì)象實(shí)例會(huì)自動(dòng)銷(xiāo)毀。這意味著,下一次調(diào)用字符串的屬性時(shí),實(shí)際是調(diào)用一個(gè)新生成的對(duì)象,而不是上一次調(diào)用時(shí)生成的那個(gè)對(duì)象,所以取不到賦值在上一個(gè)對(duì)象的屬性。如果要為字符串添加屬性,只有在它的原型對(duì)象String.prototype上定義。
自定義方法除了原生的實(shí)例方法,包裝對(duì)象還可以自定義方法和屬性,供原始類(lèi)型的值直接調(diào)用。
比如,我們可以新增一個(gè)double方法,使得字符串和數(shù)字翻倍。
String.prototype.double = function () { return this.valueOf() + this.valueOf();};’abc’.double() // abcabcNumber.prototype.double = function () { return this.valueOf() + this.valueOf();};(123).double() // 246
上面代碼在String和Number這兩個(gè)對(duì)象的原型上面,分別自定義了一個(gè)方法,從而可以在所有實(shí)例對(duì)象上調(diào)用。注意,最后的123外面必須要加上圓括號(hào),否則后面的點(diǎn)運(yùn)算符(.)會(huì)被解釋成小數(shù)點(diǎn)。
Boolean 對(duì)象概述Boolean對(duì)象是 JavaScript 的三個(gè)包裝對(duì)象之一。作為構(gòu)造函數(shù),它主要用于生成布爾值的包裝對(duì)象實(shí)例。
var b = new Boolean(true);typeof b // 'object'b.valueOf() // true
上面代碼的變量b是一個(gè)Boolean對(duì)象的實(shí)例,它的類(lèi)型是對(duì)象,值為布爾值true。
注意,false對(duì)應(yīng)的包裝對(duì)象實(shí)例,布爾運(yùn)算結(jié)果也是true。
if (new Boolean(false)) { console.log(’true’);} // trueif (new Boolean(false).valueOf()) { console.log(’true’);} // 無(wú)輸出
上面代碼的第一個(gè)例子之所以得到true,是因?yàn)閒alse對(duì)應(yīng)的包裝對(duì)象實(shí)例是一個(gè)對(duì)象,進(jìn)行邏輯運(yùn)算時(shí),被自動(dòng)轉(zhuǎn)化成布爾值true(因?yàn)樗袑?duì)象對(duì)應(yīng)的布爾值都是true)。而實(shí)例的valueOf方法,則返回實(shí)例對(duì)應(yīng)的原始值,本例為false。
Boolean 函數(shù)的類(lèi)型轉(zhuǎn)換作用Boolean對(duì)象除了可以作為構(gòu)造函數(shù),還可以單獨(dú)使用,將任意值轉(zhuǎn)為布爾值。這時(shí)Boolean就是一個(gè)單純的工具方法。
Boolean(undefined) // falseBoolean(null) // falseBoolean(0) // falseBoolean(’’) // falseBoolean(NaN) // falseBoolean(1) // trueBoolean(’false’) // trueBoolean([]) // trueBoolean({}) // trueBoolean(function () {}) // trueBoolean(/foo/) // true
上面代碼中幾種得到true的情況,都值得認(rèn)真記住。
順便提一下,使用雙重的否運(yùn)算符(!)也可以將任意值轉(zhuǎn)為對(duì)應(yīng)的布爾值。
!!undefined // false!!null // false!!0 // false!!’’ // false!!NaN // false!!1 // true!!’false’ // true!![] // true!!{} // true!!function(){} // true!!/foo/ // true
最后,對(duì)于一些特殊值,Boolean對(duì)象前面加不加new,會(huì)得到完全相反的結(jié)果,必須小心。
if (Boolean(false)) { console.log(’true’);} // 無(wú)輸出if (new Boolean(false)) { console.log(’true’);} // trueif (Boolean(null)) { console.log(’true’);} // 無(wú)輸出if (new Boolean(null)) { console.log(’true’);} // trueNumber 對(duì)象概述
Number對(duì)象是數(shù)值對(duì)應(yīng)的包裝對(duì)象,可以作為構(gòu)造函數(shù)使用,也可以作為工具函數(shù)使用。
作為構(gòu)造函數(shù)時(shí),它用于生成值為數(shù)值的對(duì)象。
var n = new Number(1);typeof n // 'object'
上面代碼中,Number對(duì)象作為構(gòu)造函數(shù)使用,返回一個(gè)值為1的對(duì)象。
作為工具函數(shù)時(shí),它可以將任何類(lèi)型的值轉(zhuǎn)為數(shù)值。
Number(true) // 1靜態(tài)屬性
Number對(duì)象擁有以下一些靜態(tài)屬性(即直接定義在Number對(duì)象上的屬性,而不是定義在實(shí)例上的屬性)。
Number.POSITIVE_INFINITY:正的無(wú)限,指向Infinity。 Number.NEGATIVE_INFINITY:負(fù)的無(wú)限,指向-Infinity。 Number.NaN:表示非數(shù)值,指向NaN。 Number.MIN_VALUE:表示最小的正數(shù)(即最接近0的正數(shù),在64位浮點(diǎn)數(shù)體系中為5e-324),相應(yīng)的,最接近0的負(fù)數(shù)為-Number.MIN_VALUE。 Number.MAX_SAFE_INTEGER:表示能夠精確表示的最大整數(shù),即9007199254740991。 Number.MIN_SAFE_INTEGER:表示能夠精確表示的最小整數(shù),即-9007199254740991。Number.POSITIVE_INFINITY // InfinityNumber.NEGATIVE_INFINITY // -InfinityNumber.NaN // NaNNumber.MAX_VALUE // 1.7976931348623157e+308Number.MAX_VALUE < Infinity // trueNumber.MIN_VALUE // 5e-324Number.MIN_VALUE > 0 // trueNumber.MAX_SAFE_INTEGER // 9007199254740991Number.MIN_SAFE_INTEGER // -9007199254740991實(shí)例方法
Number對(duì)象有4個(gè)實(shí)例方法,都跟將數(shù)值轉(zhuǎn)換成指定格式有關(guān)。
Number.prototype.toString()
Number對(duì)象部署了自己的toString方法,用來(lái)將一個(gè)數(shù)值轉(zhuǎn)為字符串形式。
(10).toString() // '10'
toString方法可以接受一個(gè)參數(shù),表示輸出的進(jìn)制。如果省略這個(gè)參數(shù),默認(rèn)將數(shù)值先轉(zhuǎn)為十進(jìn)制,再輸出字符串;否則,就根據(jù)參數(shù)指定的進(jìn)制,將一個(gè)數(shù)字轉(zhuǎn)化成某個(gè)進(jìn)制的字符串。
(10).toString(2) // '1010'(10).toString(8) // '12'(10).toString(16) // 'a'
上面代碼中,10一定要放在括號(hào)里,這樣表明后面的點(diǎn)表示調(diào)用對(duì)象屬性。如果不加括號(hào),這個(gè)點(diǎn)會(huì)被 JavaScript 引擎解釋成小數(shù)點(diǎn),從而報(bào)錯(cuò)。
10.toString(2)// SyntaxError: Unexpected token ILLEGAL
只要能夠讓 JavaScript 引擎不混淆小數(shù)點(diǎn)和對(duì)象的點(diǎn)運(yùn)算符,各種寫(xiě)法都能用。除了為10加上括號(hào),還可以在10后面加兩個(gè)點(diǎn),JavaScript 會(huì)把第一個(gè)點(diǎn)理解成小數(shù)點(diǎn)(即10.0),把第二個(gè)點(diǎn)理解成調(diào)用對(duì)象屬性,從而得到正確結(jié)果。
10..toString(2) // '1010'// 其他方法還包括10 .toString(2) // '1010'10.0.toString(2) // '1010'
這實(shí)際上意味著,可以直接對(duì)一個(gè)小數(shù)使用toString方法。
10.5.toString() // '10.5'10.5.toString(2) // '1010.1'10.5.toString(8) // '12.4'10.5.toString(16) // 'a.8'
通過(guò)方括號(hào)運(yùn)算符也可以調(diào)用toString方法。
10[’toString’](2) // '1010'
toString方法只能將十進(jìn)制的數(shù),轉(zhuǎn)為其他進(jìn)制的字符串。如果要將其他進(jìn)制的數(shù),轉(zhuǎn)回十進(jìn)制,需要使用parseInt方法。
Number.prototype.toFixed()
toFixed()方法先將一個(gè)數(shù)轉(zhuǎn)為指定位數(shù)的小數(shù),然后返回這個(gè)小數(shù)對(duì)應(yīng)的字符串。
(10).toFixed(2) // '10.00'10.005.toFixed(2) // '10.01'
上面代碼中,10和10.005先轉(zhuǎn)成2位小數(shù),然后轉(zhuǎn)成字符串。其中10必須放在括號(hào)里,否則后面的點(diǎn)會(huì)被處理成小數(shù)點(diǎn)。
toFixed()方法的參數(shù)為小數(shù)位數(shù),有效范圍為0到20,超出這個(gè)范圍將拋出RangeError錯(cuò)誤。
由于浮點(diǎn)數(shù)的原因,小數(shù)5的四舍五入是不確定的,使用的時(shí)候必須小心。
(10.055).toFixed(2) // 10.05(10.005).toFixed(2) // 10.01
Number.prototype.toExponential()
toExponential方法用于將一個(gè)數(shù)轉(zhuǎn)為科學(xué)計(jì)數(shù)法形式。
(10).toExponential() // '1e+1'(10).toExponential(1) // '1.0e+1'(10).toExponential(2) // '1.00e+1'(1234).toExponential() // '1.234e+3'(1234).toExponential(1) // '1.2e+3'(1234).toExponential(2) // '1.23e+3'
toExponential方法的參數(shù)是小數(shù)點(diǎn)后有效數(shù)字的位數(shù),范圍為0到20,超出這個(gè)范圍,會(huì)拋出一個(gè)RangeError錯(cuò)誤。
Number.prototype.toPrecision()
toPrecision方法用于將一個(gè)數(shù)轉(zhuǎn)為指定位數(shù)的有效數(shù)字。
(12.34).toPrecision(1) // '1e+1'(12.34).toPrecision(2) // '12'(12.34).toPrecision(3) // '12.3'(12.34).toPrecision(4) // '12.34'(12.34).toPrecision(5) // '12.340'
toPrecision方法的參數(shù)為有效數(shù)字的位數(shù),范圍是1到21,超出這個(gè)范圍會(huì)拋出RangeError錯(cuò)誤。
toPrecision方法用于四舍五入時(shí)不太可靠,跟浮點(diǎn)數(shù)不是精確儲(chǔ)存有關(guān)。
(12.35).toPrecision(3) // '12.3'(12.25).toPrecision(3) // '12.3'(12.15).toPrecision(3) // '12.2'(12.45).toPrecision(3) // '12.4'自定義方法
與其他對(duì)象一樣,Number.prototype對(duì)象上面可以自定義方法,被Number的實(shí)例繼承。
Number.prototype.add = function (x) { return this + x;};8[’add’](2) // 10
上面代碼為Number對(duì)象實(shí)例定義了一個(gè)add方法。在數(shù)值上調(diào)用某個(gè)方法,數(shù)值會(huì)自動(dòng)轉(zhuǎn)為Number的實(shí)例對(duì)象,所以就可以調(diào)用add方法了。由于add方法返回的還是數(shù)值,所以可以鏈?zhǔn)竭\(yùn)算。
Number.prototype.subtract = function (x) { return this - x;};(8).add(2).subtract(4) // 6
我們還可以部署更復(fù)雜的方法。
Number.prototype.iterate = function () { var result = []; for (var i = 0; i <= this; i++) { result.push(i); } return result;};(8).iterate() // [0, 1, 2, 3, 4, 5, 6, 7, 8]
上面代碼在Number對(duì)象的原型上部署了iterate方法,將一個(gè)數(shù)值自動(dòng)遍歷為一個(gè)數(shù)組。
注意,數(shù)值的自定義方法,只能定義在它的原型對(duì)象Number.prototype上面,數(shù)值本身是無(wú)法自定義屬性的。
var n = 1;n.x = 1;n.x // undefined
上面代碼中,n是一個(gè)原始類(lèi)型的數(shù)值。直接在它上面新增一個(gè)屬性x,不會(huì)報(bào)錯(cuò),但毫無(wú)作用,總是返回undefined。這是因?yàn)橐坏┍徽{(diào)用屬性,n就自動(dòng)轉(zhuǎn)為Number的實(shí)例對(duì)象,調(diào)用結(jié)束后,該對(duì)象自動(dòng)銷(xiāo)毀。所以,下一次調(diào)用n的屬性時(shí),實(shí)際取到的是另一個(gè)對(duì)象,屬性x當(dāng)然就讀不出來(lái)。
String 對(duì)象概述String對(duì)象是 JavaScript 原生提供的三個(gè)包裝對(duì)象之一,用來(lái)生成字符串對(duì)象。
var s1 = ’abc’;var s2 = new String(’abc’);typeof s1 // 'string'typeof s2 // 'object's2.valueOf() // 'abc'
字符串對(duì)象是一個(gè)類(lèi)似數(shù)組的對(duì)象(很像數(shù)組,但不是數(shù)組)。
new String(’abc’)// String {0: 'a', 1: 'b', 2: 'c', length: 3}(new String(’abc’))[1] // 'b'
上面代碼中,字符串a(chǎn)bc對(duì)應(yīng)的字符串對(duì)象,有數(shù)值鍵(0、1、2)和length屬性,所以可以像數(shù)組那樣取值。
除了用作構(gòu)造函數(shù),String對(duì)象還可以當(dāng)作工具方法使用,將任意類(lèi)型的值轉(zhuǎn)為字符串。
String(true) // 'true'String(5) // '5'靜態(tài)方法
String.fromCharCode()
String對(duì)象提供的靜態(tài)方法(即定義在對(duì)象本身,而不是定義在對(duì)象實(shí)例的方法),主要是String.fromCharCode()。該方法的參數(shù)是一個(gè)或多個(gè)數(shù)值,代表 Unicode 碼點(diǎn),返回值是這些碼點(diǎn)組成的字符串。
String.fromCharCode() // ''String.fromCharCode(97) // 'a'String.fromCharCode(104, 101, 108, 108, 111) // 'hello'
上面代碼中,String.fromCharCode方法的參數(shù)為空,就返回空字符串;否則,返回參數(shù)對(duì)應(yīng)的 Unicode 字符串。
注意,該方法不支持 Unicode 碼點(diǎn)大于0xFFFF的字符,即傳入的參數(shù)不能大于0xFFFF(即十進(jìn)制的 65535)。
String.fromCharCode(0x20BB7) // 'ஷ'String.fromCharCode(0x20BB7) === String.fromCharCode(0x0BB7)// true
上面代碼中,String.fromCharCode參數(shù)0x20BB7大于0xFFFF,導(dǎo)致返回結(jié)果出錯(cuò)。0x20BB7對(duì)應(yīng)的字符是漢字
以上就是淺談JS包裝對(duì)象的詳細(xì)內(nèi)容,更多關(guān)于JS包裝對(duì)象的資料請(qǐng)關(guān)注好吧啦網(wǎng)其它相關(guān)文章!
相關(guān)文章:
1. python excel和yaml文件的讀取封裝2. moment轉(zhuǎn)化時(shí)間戳出現(xiàn)Invalid Date的問(wèn)題及解決3. python爬蟲(chóng)實(shí)戰(zhàn)之制作屬于自己的一個(gè)IP代理模塊4. Android中的緩存5. idea重置默認(rèn)配置的方法步驟6. Android Studio插件7. Python內(nèi)存映射文件讀寫(xiě)方式8. php實(shí)現(xiàn)當(dāng)前用戶(hù)在線人數(shù)9. .net6 在中標(biāo)麒麟下的安裝和部署過(guò)程10. Java CountDownLatch應(yīng)用場(chǎng)景代碼實(shí)例
