学习笔记9—原始值包装类型

为了方便操作原始值,ECMAScript提供了3种特殊的引用类型:Boolean、Number和String。这些类型具有与其他引用一样的特点,但也具备与各自原始类型对应的特殊行为。每当用到某个原始值的方法或属性时,后台都会创建一个相应原始包装类型的对象,从而暴露出操作原始值的各种方法。

let s1 = "some text";
let s2 = s1.substring(2);

在这里,s1是一个包含字符串的变量,它是一个原始值。第二行紧接着s1上调用substring()方法,并把结果保存在s2中。我们知道,原始值本身不是对象,因此逻辑上不应有方法。而实际上这个例子又确实按照预期运行了。这是因为后台进行了很多处理,从而实现了上述操作。具体来说,当第二行访问s1时,是以读模式访问的,也就是要从内存中读取变量保存的值。在以读模式访问字符串值的时候,后台都会执行以下3步:

  1. 创建一个String类型的实例;
  2. 调用实例上的特定方法;
  3. 销毁实例

可以把这3步想象成执行了如下3行ECMAScript代码:

let s1 = new String("some text");
let s2 = s1.substring(2);
s1 = null;

这种行为可以让原始值拥有对象的行为。对布尔值和数值而言,以上3步也会在后台发生,只不过使用的是Boolean和Number包装类型而已。
引用类型与原始值包装类型的主要区别在于对象的生命周期。在通过new实例化引用类型后,得到的实例会在离开作用域时被销毁,而自动创建的原始值包装对象则只存在于访问它的那行代码执行期间。这意味着不能在运行时给原始值添加属性和方法,比如下面例子:

let s1 = "some text";
s1.color = "red";
console.log(s1.color);//undefined

这里的第二行代码尝试给字符串s1添加了一个color属性。可是,第三行代码访问color属性时,它却不见了。原因是第二行代码运行时会临时创建一个String对象,而当第三行代码执行时,这个对象已经被销毁了。实际上,第三行代码在这里创建了自己的String对象,但这个对象没有color属性。
可以显式地使用Boolean、Number和String构造函数创建原始值包装对象。不过应该在确实必要的时候再这么做,否则容易让开发者疑惑,分不清它们到底是原始值还是引用值。在原始值包装类型的实例上调用typeof会返回"object",所有原始值包装对象都会转换为布尔值true。
另外,Object构造函数作为一个工厂方法,能够根据传入值的类型返回相应原始值包装类型的实例:

let obj = new Object("some text");
console.log(obj instanceof String); //true

如果传给Object的是字符串,则会创建一个String的实例。如果是数值,则会创建Number的实例。布尔值则会得到Boolean的实例。
注意:使用new调用原始值包装类型的构造函数与调用同名的转型函数并不一样:

let value = "25";
let number = Number(value);//转型函数
console.log(typeof number);//"number"
let obj = new Number(value);//构造函数
console.log(typeof obj);//"object"

在这个例子中,变量number中保存的是一个值为25的原始数值,而变量obj中保存的是一个Number的实例。

1 Boolean

Boolean是对应布尔值的引用类型。要创建一个Boolean对象,就使用Boolean构造函数并传入true或false:

let booleanObject = new Boolean(true);

Boolean的实例会重写valueOf()方法,返回一个原始值true或false。toString()方法被调用时也会被覆盖,返回字符串"true"或"false"。不过,Boolean对象在ECMAScript中用得很少,不仅如此,它们还容易引起误会,尤其是在布尔表达式中使用Boolean对象时:

let falseObject = new Boolean(false);
let result = falseObject && true;
console.log(result);//true

let falseValue = false;
result = falseValue && true;
console.log(result); //false

在这段代码中,我们创建一个值为false的Boolean对象。然后,在一个布尔表达式中通过&&操作将这个对象与一个原始值true组合起来。在布尔算术中,false&&true等于false。可是,这个表达式是对falseObject对象而不是对它表示的值(false)求值。前面刚刚说过,所有的对象在布尔表达式中都会自动转换为true,因此falseObject在这个表达式里实际上表示一个true值。
除此之外,原始值和引用值(Boolean对象)还有几个区别。首先,typeof操作符对原始值返回”boolean“,但对引用值返回”object“。同样,Boolean对象是Boolean类型的实例,在使用instanceof操作符返回true,但对原始值则返回false。

2 Number

Number是对应数值的引用类型。要创建一个Number对象,就使用Number构造函数并传入一个数值:

let numberObject = new Number(10);

与Boolean类型一样,Number类型重写了valueOf()、toLocaleString()和toString()方法。valueOf()方法返回Number对象表示的原始数值,另外两个方法返回数值字符串。toString()方法可选地接收一个表示基数的参数,并返回相应基数形式的数值字符串:

let num = 10;
console.log(num.toString());//"10"
console.log(num.toString(2)); //"1010"
console.log(num.toString(8)); //"12"
console.log(num.toString(10));//"10"
console.log(num.toString(16));//"a"

除继承的方法,Number类型还提供了几个用于将数值格式化为字符串的方法。
toFixed()方法返回包含指定小数点位数的数值字符串:

let num = 10;
console.log(num.toFixed(2)); //"10.00"

这里toFixed()方法接收了参数2,表示返回的数值字符串要包含两位小数。结果返回值为"10.00"。小数位填充了0.如果数值本身的小数位数超过了参数指定的位数,则四舍五入到最接近的小数位数。
另一个用于格式化数值的方法是toExponential(),返回以科学计数法表示的数值字符串。与toFixed()一样,toExponential()也接收一个参数,表示结果中小数的位数。

let num = 10;
console.log(num.toExponential(1)); //"1.0e+1"

如果想要得到最适当的形式,那么可以使用toPrecision(),会根据情况返回最合理的输出结果,可能是固定长度,也可能是科学计数法。这个方法接收一个参数,表示结果中数字的总位数(不包含指数):

let num = 99;
console.log(num.toPrecision(1)); //"1e+2"
console.log(num.toPrecision(2));//"99"
console.log(num.toPrecision(3));//"99.0"

与Boolean对象类似,Number对象也为数值提供了重要的能力。但是,考虑到两者存在同样的潜在问题,因此并不建议直接实例化Number对象。在处理原始数值和引用数值时,typeof和instanceof操作符会返回不同的结果:

let numberObject = new Number(10);
let numberValue = 10;
console.log(typeof numberObject);//"Object"
console.log(typeof numberValue); //"number"
console.log(numberObject instanceof Number); //true
console.log(numberValue instanceof Number);//false

3 String

String是对应字符串的引用类型。要创建一个String对象,使用String构造函数并传入一个数值:

let stringObject = new String("hello world");

String对象的方法可以在所有字符串原始值上调用。3个继承的方法valueOf()、toLocaleString()和toString()都返回对象的原始字符串值。
每个String对象都有一个length属性,表示字符串中字符的数量:

let stringValue = "hello world";
console.log(stringValue.length);//"11"

注意,即使字符串中包含双字节字符(而不是单字节的ASCⅡ字符),也仍然会按单字符来计数。String类型提供了很多方法来解析和操作字符串。
(1)、JavaScript字符
JavaScript字符串由16位码元(code unit)组成。对多数字符来说,每16位码元对应一个字符。换句话说,字符串的length属性表示字符串包含多少16位码元。
此外charAt()方法返回给定索引位置的字符,由传给方法的整数参数指定。具体来说,这个方法查找指定索引位置的16位码元,并返回该码元对应的字符:

let message = "abcde";

console.log(message.charAt(2)); //"c"

JavaScript字符串使用两种Unicode编码混合的策略:UCS-2和UTF-16。对于可以采用16位编码的字符(U+0000~U+FFFF),这两种编码实际上是一样的。
使用charCodeAt()方法可以查看指定码元的字符编码。这个方法返回指定索引位置的码元值,索引以整数指定:

let message = "abcde";

//Unicode "Latin small letter C"的编码是U+0063
console.log(message.charCodeAt(2));//99

fromCharCode()方法用于根据给定的UTF-16码元创建字符串中的字符。这个方法可以接受任意多个数值,并返回将所有数值对应的字符拼接起来的字符串:

//Unicode "Latin small letter A"的编码是U+0061
//Unicode "Latin small letter B"的编码是U+0062
//Unicode "Latin small letter C"的编码是U+0063
//Unicode "Latin small letter D"的编码是U+0064
//Unicode "Latin small letter E"的编码是U+0065

console.log(String.fromCharCode(0x61,0x62,0x63,0x64,0x65));//"abcde"

//0x0061 === 97
//0x0062 === 98
//0x0063 === 99
//0x0064 === 100
//0x0065 === 101
console.log(String.fromCharCode(97,98,99,100,101));//"abcde"

对于U+0000~U+FFFF范围内的字符,length、charAt()、charCodeAt()和fromCharCode()返回的结果都跟预期是一样的。这是因为在这个范围内,每个字符都是用16位表示的,而这几个方法也都基于16位码元完成操作。只要字符编码大小与码元大小一一对应,这些方法就能如期工作。
这个对应关系在扩展到Unicode增补字符平面时就不成立了。问题很简单,即16位只能唯一表示65536个字符。这对于大多数语言字符集是足够了,在Unicode中称为基本多语言平面(BMP)。为了表示更多的字符,Unicode采用了一个策略,即每个字符使用另外16位去选择一个增补平面。这种每个字符使用两个16位码元的策略称为代理对。
为正确解析既包含单码元字符又包含代理对字符的字符串,可以使用codePointAt()来代替charCodeAt()。跟使用charCodeAt()时类似,codePointAt()接收16位码元的索引并返回该索引位置上的码点(code point)。码点是Unicode中一个字符的完整标识。比如"c"的码点是0x0063。
(2)、字符串操作方法
concat(),用于将一个或多个字符串拼接成一个新字符串:

let stringValue = "hello";
let result = stringValue.concat("world");

console.log(result);//"hello world"
console.log(stringValue);//"hello"

在这个例子中,对stringValue调用concat()方法的结果是得到”hello world“,但stringValue的值保持不变。concat()方法可以接收任意多个参数,因此可以一次性拼接多个字符串:

let stringValue = "hello "
let result = stringValue.concat("world","!");

console.log(result);//"hello world!"
console.log(stringValue);//"hello ";

ECMAScript提供了3个从字符串中提取子字符串的方法:slice()、substr()和substring()。这3个方法都返回调用它们的字符串的一个子字符串,而且都接收一个或两个参数。第一个参数表示字符串开始的位置,第二个参数表示子字符串结束的位置。
对slice()和substring()而言,第二个参数是提取结束的位置(即该位置之前的字符会被提取出来)。对substr()而言,第二个参数表示返回子字符串数量。任何情况下,省略第二个参数都意味着提取到字符串末尾。与concat()方法一样,slice()、substr()和substring()也不会修改调用它们的字符串,而只会返回提取到的原始字符串值:

let stringValue = "hello world";
console.log(stringValue.slice(3));//"lo world"
console.log(stringValue.substring(3));//"lo world"
console.log(stringValue.substr(3));//"lo world"
console.log(stringValue.slice(3,7));//"lo w"
console.log(stringValue.substring(3,7));//"lo w"
console.log(stringValue.substr(3,7));//"lo worl"

当某个参数是负值时,这3个方法的行为又有不同:

  • slice()方法将所有负值参数都当成字符串长度加上负参数值。
  • 而substr()方法将第一个负参数值当成字符串长度加上该值,将第二个负参数值转换为0.
  • substring()方法会将所有负参数值都转换位0
let stringValue = "hello world";
console.log(stringValue.slice(-3));//"rld"
console.log(stringValue.substring(-3));//"hello world"
console.log(stringValue.substr(-3));//"rld"
console.log(stringValue.slice(3,-4);//"lo w"
console.log(stringValue.substring(3,-4);//"hel"
console.log(stringValue.substr(3,-4));""(empty string)

(3)字符串位置方法
有两个方法用于在字符串中定位子字符串:indexOf()和lastIndexOf()这两个方法从字符串中搜索传入的字符串,并返回位置(如果没找到,则返回-1)。两者的区别在于indexOf()方法从字符串开头开始查找子字符串,而lastIndexOf()方法从字符串末尾开始查找子字符串:

let stringValue = "hello world";
console.log(stringValue.indexOf("o"));//4
console.log(stringValue.lastIndexOf("o"));//7

这两个方法都可以接收可选的第二个参数,表示开始搜索的位置。这意味着indexOf()会从这个参数指定的位置开始向字符串末尾搜索,忽略该位置之前的字符。lastIndexOf()则会从这个参数指定的位置开始向字符串开头搜索,忽略该位置之后直到字符串末尾的字符:

let stringValue = "hello world";
console.log(stringValue.indexOf("o",6));//7
console.log(stringValue.lastIndexOf("o",6));//4

像这样使用第二个参数并循环调用indexOf()或lastIndexOf(),就可以在字符串中找到所有的目标子字符串:

let stringValue = "Lorem ipsum dolor sit amet,consectetur adipisicing elit";
let positions = new Array();
let pos = stringValue.indexOf("e");

while(pos>-1){
	position.push(pos);
	pos = StringValue.indexOf("e",pos+1);
}
console.log(positions);

(4)字符串包含方法
ECMAScript6增加了3个用于判断字符串中是否包含令一个字符串的方法:startsWith()、endsWith()和includes()。这些方法都会从字符串中搜索传入的字符串,并返回一个表示是否包含的布尔值。它们的区别在于startsWith()检查开始于索引0的匹配项,endsWith()检查开始于索引(string.length-substring.length)的匹配项,而includes()检查整个字符串。

let message = "footbarbaz";

console.log(message.startsWith("foo"));//true
console.log(message.startsWith("bar"));//false

console.log(message.endsWith("baz"));//true
console.log(message.endsWith("bar"));//false

console.log(message.includes("bar"));//true
console.log(message.includes("qux");//false

startsWith()和includes()方法接收可选的第二个参数,表示开始搜索的位置。如果传入第二个参数,则意味着这两个方法会从指定位置开始向着字符串末尾搜索,忽略该位置之前的所有字符:

let message = "foobarbaz";

console.log(message.startsWith("foo"));//true
console.log(message.startsWith("foo",1));//false

console.log(message.includes("bar"));//true
console.log(message.includes("bar",4));//false

endsWith()方法接收可选第二个参数,表示应该当作字符串末尾的位置。如果不提供这个参数,那么默认就是字符串长度。如果提供这个参数,那么就好像字符串只有那么多字符一样:

let message = "foobarbaz";

console.log(message.endsWith("bar"));//false
console.log(message.endsWith("bar",6));//true

(4)trim()方法
ECMAScript在所有字符串上都提供了trim()方法。这个方法会创建字符串的一个副本,删除前、后所有空格符,再返回结果:

let stringValue = "  hello world  ";
let trimmedStringValue = stringValue.trim();

console.log(stringValue); //"  hello world  "
console.log(trimmedStringValue);//"hello world"

由于trim()返回的是字符串得到副本,因此原始字符串不受影响,即原本的前、后空格符都会保留。另外trimLeft()和trimRight()方法分别用于从字符串开始和末尾清理空格符。
(5)repeat()方法
ECMAScript在所有字符串上都提供了repeat()方法。这个方法接收一个整数参数,表示要将字符串复制多少次,然后返回拼接所有副本后的结果:

let stringValue = "na ";
console.log(stringValue.repeat(4)+"batman");
//na na na na batman

(6)字符串大小写转换
包括4个方法:toLowerCase()、toLocaleLowerCase()、toUpperCase()和toLocaleUpperCase()。toLowerCase()和toUpperCase()方法是原来就有的方法,于java.lang.String中的方法同名。toLocaleLowerCase()和toLocaleUpperCase()方法旨在基于特定地区实现。在很多地区,地区特定的方法与通用的方法是一样的。但在少数语言中,Unicode大小写转换需要应用特殊规则,要使用地区特定的方法才能实现正确转换。
(7)字符串模式匹配方法
String类型专门为在字符串中实现模式匹配设计了几个方法。第一个是match()方法,这个方法本质上跟RegExp对象的exec()方法相同。match()方法接收一个参数,可以是一个正则表达式字符串,也可以是一个RegExp对象:

let text = "cat,bat,sat,fat";
let pattern = /.at/;

let matches = text.match(pattern);
console.log(matches.index);//0
console.log(matches[0]);//"cat"
console.log(pattern.lastIndex);//0

match()方法返回的数组与RegExp对象的exec()方法返回的数组是一样的:第一个元素是与整个模式匹配的字符串,其余元素则是与表达式中的捕获组匹配的字符串。
另一个查找模式的字符串方法是search()。这个方法唯一的参数与match()方法一样:正则表达式字符串或RegExp对象,这个方法返回模式第一个匹配的位置索引,如果没有找到则返回-1。search()始终从字符串开头向后匹配模式。

let text = "cat,bat,sat,fat";
let pos = text.search(/at/);
console.log(pos);//1

为了简化子字符串替换操作,ECMAScript提供了replace()方法,这个方法接收两个参数,第一个参数可以是一个RegExp对象或一个字符串(这个字符串不会转换为正则表达式),第二个参数可以是一个字符串或一个函数。如果第一个参数是字符串,那么只会替换第一个子字符串。想要替换所有子字符串,第一个参数必须为正则表达式并且带全局标记:

let text = "cat,bat,sat,fat";
let result = text.replace("at","ond");
console.log(result);//"cond,bat,sat,fat"

result = text.replace(/at/g,"ond");
console.log(result);//"cond,bond,sond,fond"
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值