JavaScript引用類型之基本包裝類型實(shí)例分析【Boolean、Number和String】
本文實(shí)例講述了JavaScript引用類型之基本包裝類型。分享給大家供大家參考,具體如下:
為了操作基本類型值,ECDMAScript提供了3個(gè)特殊的引用類型——基本包裝類型Boolean、Number和String。每當(dāng)讀取一個(gè)基本類型值時(shí),后臺(tái)會(huì)創(chuàng)建一個(gè)對(duì)應(yīng)的基本包裝類型的對(duì)象。
var str = "Hello world"; var substr = str.substring();
等價(jià)于
var str = new String("Hello world");//創(chuàng)建String類型的實(shí)例
var substr = str.substring();//在實(shí)例上調(diào)用substring()方法
str = null;//銷毀實(shí)例
基本包裝類型是特殊的引用類型,引用類型與基本包裝類型的區(qū)別如下:
(1)對(duì)象的生存期
使用new操作符創(chuàng)建的引用類型的實(shí)例,在執(zhí)行流離開當(dāng)前作用域之前一直存在于內(nèi)存中,而自動(dòng)創(chuàng)建的基本包裝類型的對(duì)象,只存在于代碼執(zhí)行瞬間,然后立即被銷毀,也就是說,不能在運(yùn)行時(shí)為基本包裝類型添加屬性和方法。
var str1 = "Hello world";
var str2 = new String("Hello World");
str1.life = 20;
str2.life = 20;
alert(str1.life);//undefined
alert(str2.life);//20
(2)instanceof操作符測(cè)試結(jié)果
使用instanceof操作符測(cè)試基本包裝類型實(shí)例會(huì)返回true,測(cè)試基本類型值會(huì)返回false。
var str1 = "Hello World";
var str2 = new String("Hello world");
alert(str1 instanceof String);//false
alert(str2 instanceof String);//true
可以顯式地調(diào)用Boolean、Number、String來創(chuàng)建基本包裝類型的對(duì)象,但盡可能不要這樣做,因?yàn)檫@樣不易區(qū)分是在處理基本類型還是引用類型。
Object構(gòu)造函數(shù)會(huì)根據(jù)傳入值的類型返回相應(yīng)基本包裝類型的實(shí)例。
var str = new String("Hello world");
alert(str instanceof String);//true
var num = new Number(16);
alert(num instanceof Number);//true
var bool = new Boolean(true);
alert(bool instanceof Boolean);//true
對(duì)基本包裝類型的實(shí)例調(diào)用typeOf()方法會(huì)返回"Object",實(shí)例變量中保存的是基本類型值。
var str = new String("Hello world");
alert(typeof str);//object
var num = new Number(16);
alert(typeof num);//object
var boolean = new Boolean(true);
alert(typeof boolean);//object
使用new操作符調(diào)用基本包裝類型的構(gòu)造函數(shù),與直接調(diào)用同名的轉(zhuǎn)型函數(shù)是不同的,變量中保存的是基本包裝類型的實(shí)例。
var str = String("Hello world");
alert(typeof str);//string
var num = Number(16);
alert(typeof num);//number
var bool = Boolean(true);
alert(typeof bool);//boolean
所有基本包裝類型的對(duì)象在轉(zhuǎn)換為布爾類型時(shí)值都是true。
var boolean1 = new Boolean(false);
alert(boolean1);//false
alert(boolean1 && true);//true
var boolean2 = new Boolean(0);
alert(boolean2);//false
alert(boolean2 && true);//true
var boolean3 = new Boolean("");
alert(boolean3);//false
alert(boolean3 && true);//true
1、Boolean類型
var boolean = new Boolean(true);
Boolean類型的實(shí)例重寫了valueOf()方法,返回對(duì)應(yīng)的基本類型值true和false;重寫了toString()方法,返回字符串"true"和"false"。
2、Number類型
var num = new Number(16);
Number類型也重寫了繼承的valueOf()、toString()、toLocaleString()方法,重寫后的valueOf()方法返回對(duì)應(yīng)的基本類型值,另外兩個(gè)方法返回對(duì)應(yīng)的字符串??梢詾閠oString()方法傳遞一個(gè)表示基數(shù)的參數(shù)。
除了繼承的方法外,Number還提供了將數(shù)值格式化為字符串的方法:
(1)toFixed()方法:傳入的參數(shù)為小數(shù)位數(shù),返回?cái)?shù)值的字符串表示。
(2)toExponential()方法:傳入的參數(shù)為小數(shù)位數(shù),返回以指數(shù)表示法表示的數(shù)值的字符串形式。
(3)toPrecision()方法:傳入的參數(shù)為數(shù)值的所有數(shù)組位數(shù),不包含指數(shù)部分,返回指定格式的字符串表示。
3、String類型
var str = new String("Hello world");
String類型繼承的valueOf()、toString()、toLocaleString()方法返回對(duì)象所表示的字符串值。
(1)String類型實(shí)例的屬性。
length屬性:表示字符串包含的字符個(gè)數(shù)。
(2)String類型實(shí)例的方法。
---字符方法
不會(huì)修改字符串本身的值,只是返回子字符串,對(duì)原始字符串沒有影響。
1)charAt()方法:傳入的參數(shù)為基于0的字符位置,返回給定位置的字符。
2)charCodeAt()方法:傳入的參數(shù)為基于0的字符位置,返回給定位置的字符編碼。
---字符串操作方法
1)concat()方法:傳入的參數(shù)為任意多個(gè)字符串,返回拼接得到的字符串。
2)substr()、slice()、substring()方法:三個(gè)基于子字符串創(chuàng)建新字符串的方法,傳入一或兩個(gè)參數(shù),返回子字符串。第一個(gè)參數(shù)指定子字符串的開始位置,第二個(gè)參數(shù)可選,slice()和substring()的第二個(gè)參數(shù)指定子字符串的結(jié)束位置,substr()的第二個(gè)參數(shù)指定子字符串的長(zhǎng)度。當(dāng)傳入的參數(shù)是負(fù)數(shù)時(shí),slice()方法會(huì)將負(fù)值與字符串長(zhǎng)度相加,substr()方法將第一個(gè)負(fù)值加上字符串長(zhǎng)度,而第二個(gè)負(fù)值轉(zhuǎn)換為0,substring()方法將所有負(fù)值都轉(zhuǎn)換為0。
---字符串位置方法
搜索給定的子字符串,返回子字符串的位置,未搜索到則返回-1。第一個(gè)參數(shù)指定搜索的子字符串,第二個(gè)參數(shù)可選,指定搜索開始的位置。---
1)indexOf()方法:從頭開始向后搜索。
2)lastIndexOf()方法:從后開始向前搜索。
---trim()方法
創(chuàng)建一個(gè)字符串的副本,刪除前綴和后綴的空格,返回新字符串,原始字符串不變。
---字符串大小寫轉(zhuǎn)換方法
1)toLowerCase()方法:通用的小寫轉(zhuǎn)換方法。
2)toUpperCase()方法:通用的大寫轉(zhuǎn)換方法。
3)toLocaleLowerCase()方法:針對(duì)特定地區(qū)的小寫轉(zhuǎn)換方法。
4)toLocaleUpperCase()方法:針對(duì)特定地區(qū)的大寫轉(zhuǎn)換方法。
---字符串模式匹配方法
1)match()方法:在字符串上調(diào)用match()方法,與在RegExp實(shí)例上調(diào)用exec()方法相同。接收1個(gè)參數(shù)——正則表達(dá)式或RegExp對(duì)象。返回一個(gè)數(shù)組,數(shù)組的第一項(xiàng)是與整個(gè)模式匹配的字符串,之后的每一項(xiàng)是與各個(gè)子模式匹配的字符串。
2)search()方法:從頭開始向后查找。接收1個(gè)參數(shù)——正則表達(dá)式或RegExp對(duì)象。返回第一個(gè)匹配項(xiàng)的索引,未找到匹配結(jié)果則返回-1。
3)replace()方法:替換字符串。接收2個(gè)參數(shù)——第一個(gè)參數(shù)是一個(gè)正則表達(dá)式或RegExp對(duì)象或字符串(字符串不會(huì)被轉(zhuǎn)換為正則表達(dá)式),第二個(gè)參數(shù)是一個(gè)字符串或函數(shù)。若第一個(gè)參數(shù)是字符串,則只會(huì)替換第一個(gè)子字符串,若想替換所以子字符串,需要使用帶有g(shù)標(biāo)志的RegExp對(duì)象。
a、第二個(gè)參數(shù)為字符串時(shí),使用特殊的字符序列,將正則表達(dá)式操作得到的值插入到結(jié)果字符串中。
| 特殊的字符序列 | 替換文本 |
|---|---|
| $$ | $ |
| $& | 匹配整個(gè)模式的子字符串 |
| $' | 匹配的子字符串之前的子字符串 |
| $` | 匹配的子字符串之后的子字符串 |
| $n | 匹配第n個(gè)子模式的子字符串,n等于0-9.若正則表達(dá)式中沒有定義子模式,則使用空字符串 |
| $nn | 匹配第nn個(gè)子模式的子字符串,nn等于01-99.若正則表達(dá)式中沒有定義子模式,則使用空字符串 |
var str = "cat, fat, eat"; var result = str.replace(/(.at)/g, "my($1)"); alert(result);//my(cat), my(fat), my(eat)
b、第二個(gè)參數(shù)為函數(shù)時(shí),可以實(shí)現(xiàn)更為精細(xì)的替換操作。
在只有一個(gè)匹配項(xiàng)(即與模式匹配的字符串)時(shí),向函數(shù)傳遞3個(gè)參數(shù)——模式的匹配性、模式匹配項(xiàng)在字符串中的位置和原始字符串。在正則表達(dá)式中定義了多個(gè)子模式的情況下,向函數(shù)傳遞的參數(shù)依次是模式的匹配項(xiàng)、第一個(gè)子模式的匹配項(xiàng)、第二個(gè)子模式的匹配項(xiàng)、......、模式匹配項(xiàng)在字符串中的位置和原始字符串。返回替換文本。
var str = "<a href = \"test.jsp\">link</a>";
var result = str.replace(/[<>"&]/g, function(match, positon, originalStr) {
switch(match) {
case "<":
return "<";
case ">":
return ">";
case "&":
return "&";
case "\"":
return """;
}
});
alert(result);//<a href = "test.jsp">link</a>
4)split()方法:第一個(gè)參數(shù)為分隔符(字符串或RegExp對(duì)象,字符串不會(huì)被轉(zhuǎn)換為正則表達(dá)式),第二個(gè)參數(shù)可選,指定返回的字符串?dāng)?shù)組的大小。返回分割后的字符串?dāng)?shù)組。
var strs1 = str.split("|", 2);//["cat","fat","eat"]
var str = "cat|fat|eat";
var strs1 = str.split("|");
alert(strs1);//cat,fat,eat
var strs2 = str.split("|", 2);
alert(strs2);//cat,fat
var strs3 = str.split(/[^\|]+/);
alert(strs3);//,|,|,
strs3的分隔符為“cat”、"fat"、“eat”,因此返回的數(shù)組第一項(xiàng)和最后一項(xiàng)時(shí)空字符串。
---localeCompare()方法:
比較兩個(gè)字符串,若字符串在字母表中應(yīng)該排列在字符串參數(shù)之前,返回一個(gè)負(fù)數(shù)(大多數(shù)情況是-1),若在之后,返回一個(gè)正數(shù)(大多數(shù)情況是1),若相等,返回0。
alert("world".localeCompare("hello"));//1
---fromCharCode()方法:
String類的靜態(tài)方法,接收一或多個(gè)字符編碼,轉(zhuǎn)換為字符串,與charCodeAt()是相反的操作。
alert(String.fromCharCode(104, 101, 108, 108, 111));//"hello"
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript常用函數(shù)技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript頁面元素操作技巧總結(jié)》及《JavaScript操作DOM技巧總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
細(xì)說webpack源碼之compile流程-rules參數(shù)處理技巧(2)
這篇文章主要介紹了webpack源碼之compile流程-rules參數(shù)處理技巧的相關(guān)知識(shí),需要的朋友參考下吧2017-12-12
微信小程序?qū)崿F(xiàn)列表項(xiàng)上移下移效果
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)列表項(xiàng)上移下移效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-07-07
微信小程序?qū)崿F(xiàn)簡(jiǎn)易計(jì)算器
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)簡(jiǎn)易計(jì)算器,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-07-07
JavaScript動(dòng)態(tài)添加css樣式和script標(biāo)簽
這篇文章主要介紹了JavaScript動(dòng)態(tài)添加css樣式和script標(biāo)簽的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07
script不刷新頁面的聯(lián)動(dòng)前后代碼
如何實(shí)現(xiàn)script不刷新頁面的聯(lián)動(dòng),在本文有個(gè)不錯(cuò)的示例或許對(duì)大家有所幫助2013-09-09
JavaScript Promise與async/await作用詳細(xì)講解
Promise是異步編程的一種解決方案:從語法上講,promise是一個(gè)對(duì)象,從它可以獲取異步操作的消息;從本意上講,它是承諾,承諾它過一段時(shí)間會(huì)給你一個(gè)結(jié)果2023-01-01

