JavaScript中的字符串

@(javascript)[js字符串] [toc]

JavaScript中的字符串

字符串是JavaScript中7种数据中的一种，用于表示由零个或多个16位的Unicode字符组成的字符序列。建立字符串有两种方式，一种是字面量，另外一种是构造函数。

1. 字面量

var str = "一个字符串";
复制代码

2. 构造函数

var str = new String("一个字符串");
复制代码

上面就是两个字符串，可是字面量对构造函数说：“咱们不同。”那有啥不同？好。下面来看看具体的。

var str1 = "一个字符串";
console.log(str1);	// 一个字符串
console.log(typeof str1);	// string
var str2 = new String("一个字符串");
console.log(str2);	// String {"一个字符串"}
console.log(typeof str2);	// object
复制代码

能够看出来两个的值与类型都不相同。使用字面量就是返回一个字符串。使用构造函数则是一个字符串对象。若是要将字符串对象转换为字符串。能够使用toString，toLocalSring，valueOf转换为字符串。

var str2 = new String("一个字符串");
console.log(str2);	// String {"一个字符串"}
console.log(typeof str2);	// object
console.log(str2.toString())	// 一个字符串
console.log(str2.toLocaleString())	// 一个字符串
console.log(str2.valueOf())	// 一个字符串
复制代码

这样要使用一个字符串费劲。因此通常看不到这样的操做，都是使用的字面量定义。下面的关于字符串的一些方法都将使用字面量的形式。

字符串是有长度的

字符串是有长度这个属性的。从刚刚的构造函数中能够看出来。获取长度使用length属性就不在过多的说明。

字符方法

字符串用于两个访问特定字符的方法： charAt：一个参数，返回给定位置的字符 charCodeAt：一个参数，返回给定位置的字符的字符编码 以及一个将字符编码转换为字符的方法，这个是String构造函数的 fromCharCode

var str = "测试字符方法";
console.log(str.charAt(2));	// 字
console.log(str.charCodeAt(2));	// 23383

console.log(String.fromCharCode(23383)) // 字

// charAt()方法获取指定位置的字符还能够直接使用下标获取，由于字符串是有长度的。
console.log(str[2]);	// 字
复制代码

虽然说能够使用下标获取指定位置的字符。可是此方法不兼容IE8如下。因此若是使用须要谨慎。

字符操做方法

concat() - 拼接字符串

concat方法用于讲一个或者多个字符串拼接起来。因此他接收一个或者多个字符创做为参数。

var str = "我";
var res = str.concat("喜","欢","你","！");
console.log(str);	// 我
console.log(res);	// 我喜欢你！
复制代码

通过上面的代码发现，使用concat是不会影响原字符串的。这个方法在数组中也存在，不过那是链接数组了。 虽然说能够使用concat方法链接两个或者两个以上的字符串，可是基本不使用。开发中仍是使用+号拼接的使用更多。

substr()，substring()，slice() - 切割字符串

三个方法都是基于字符串建立新字符的方法，都接收一个或者两个参数，返回一个新字符串，不影响原字符串。第一个参数是切割的开始位置（包括这个位置）。

substr：第二个参数指切割的字符串的个数，由于是个数。因此包含最后一个 substring：第二个参数指切割的字符串的位置，不包含最后一个 slice：第二个参数指切割的字符串的位置，不包含最后一个 三个若都没有第二个参数。默认都字符串末尾

var str = "我喜欢你一辈子一世！";
// 传递的参数是一个正数
console.log(str.substr(2)); // 欢你一辈子一世！
console.log(str.substring(2)); // 欢你一辈子一世！
console.log(str.slice(2)); // 欢你一辈子一世！

console.log(str.substr(2,3));	// 欢你一
console.log(str.substring(2,3));	// 欢
console.log(str.slice(2,3));	// 欢

// 传递的参数是一个负数
console.log(str.substr(-3));	// 一世！
console.log(str.substring(-3));	// 我喜欢你一辈子一世！
console.log(str.slice(-3));	// 一世！

console.log(str.substr(3,-4));	// 空字符串
console.log(str.substring(3,-4));	// 我喜欢
console.log(str.slice(3,-4));	// 你一
复制代码

对比上面的代码。当两个参数都是正数的时候很简单。可是当两个都是负数的时候，问题就来了。substr会将负的第一个参数从后往前数第几位做为开始位置。负的第二个参数转化为0。slice会将负数所有从后往前数。可是substring像是没事人同样。把负数忽略了。转化为0，同时以较小数做为开始位置。

字符串位置方法 - 查找字符串

indexOf：从头至尾的找 lastIndexOf：从尾到头的找 两个方法都接收一个或者两个参数，第一个是须要查找的字符，第二个是从哪一个位置开始查找（下标，默认是0）。

var str = "我是真的真的喜欢你！";
// 0 1 23 4 56 7 8
console.log(str.indexOf("真"));	// 2
console.log(str.lastIndexOf("真"));	// 4

console.log(str.indexOf("真",3));	// 4
console.log(str.lastIndexOf("真",3));	// 2

console.log(str.indexOf("他"));	// -1
console.log(str.lastIndexOf("他"));	// -1
复制代码

能够看的，无论是indexOf仍是lastIndexOf找到字符串后都会返回这个字符的下标。不过一个是正着数一个是倒着数。可是当去寻找小三他的时候没有发现小三旧放回一个-1。

因此，两个方法都是找到返回下标(注意从哪头开始的)。未找到返回 -1。

trim()方法

trim()方法很简单，就是取出字符串的收尾的空格。可是此方法不兼容IE8及如下。

var str = " 我喜欢你！ ";
console.log(str);	// 我喜欢你！ 
console.log(str.trim()); // 我喜欢你！
复制代码

若是是要兼容IE8及如下，但是使用正则去替换。

var str = " 我喜欢你！ ";
var res = str.replace(/^\s*|\s*$/g,"");
console.log(res); // 我喜欢你！

var str = " 我喜 欢你！ ";
var res = str.replace(/^\s*|\s*$/g,"");
console.log(res);	// 我喜 欢你！
复制代码

大小写转化方法

四个方法： toLowerCase：转换为小写 toLocaleLowerCase：转换为当地时区小写，一些地方专用 toUpperCase：转换为大写 toLocaleUpperCase：转换为当地时区大写，一些地方专用

var str = "I Love You!";
console.log(str.toLowerCase());	// i love you!
console.log(str.toLocaleLowerCase());	// i love you!
console.log(str.toUpperCase());	// I LOVE YOU!
console.log(str.toLocaleUpperCase());	// I LOVE YOU!
复制代码

为了保险起见，使用带Locale的更好。

字符串匹配方法

match() - 匹配

match本质上与RegExp的exec()方法是同样的。接收一个参数，正则表达式或者是RegExp对象。返回一个数组。

var str = "bat,cat,fat,hat";
var reg = /.at/g;
var res = str.match(reg);
console.log(res)	// (4) ["bat", "cat", "fat", "hat"]
复制代码

var res = str.match(reg);与var res = reg.exec(str);本质上相同。可是后面的不管是否是全局都是返回长度为1的数组。若是不是全局匹配，二者没有区别。

search() - 搜索

search的参数与match同样。search方法返回字符串中第一个匹配项的索引。没有则返回-1。

var str = "bat,cat,fat,hat";
var reg = /at/;
var res = str.search(reg);
console.log(res); // 1。由于第一个 a 的下标为 1
复制代码

replace() - 替换

replace方法是字符串中十分重要的一个方法，必须掌握。接收两个参数。

第一个参数：能够是一个字符串或者是一个正则 第二个参数：能够是一个字符串或者是一个函数

第二个参数是字符串：

var str = "abcdcba";
var res1 = str.replace("b","逼");
console.log(res1);	// a逼cdcba

var res2 = str.replace(/b/g,"逼");
console.log(res2);	// a逼cdc逼a
复制代码

第一个参数为字符串基本不用，由于他只能匹配第一个，且只能匹配一个

第二个参数是函数： 若是是函数 第一个参数：匹配项 中间的参数：捕获组1，捕获组2，捕获组3······ 倒数第二个：位置 最后一个：原始字符串

var str = "fathermatherbrothersister";
var reg = /father(mather(brother(sister)))/;

var res = str.replace(reg,function(match,capture1,capture2,capture3,pos,originalText){
	console.log(match); // fathermatherbrothersister
	console.log(capture1); // matherbrothersister
	console.log(capture2); // brothersister
	console.log(capture3); // sister
	console.log(pos); // 0
	console.log(originalText); // fathermatherbrothersister
})
console.log(res); // undefined 。由于第二个参数无返回值
复制代码

第二个参数既然能够拿到这些东西。那咱们就能够作任何事情。

split() - 分割

split方法能够将字符串按指定的符号进行分割，返回一个数组。 第一个参数：分隔符。字符串或者正则 第二个参数：可选。返回数字的长度，不能大于可切割的长度

var color = "yellow,red,green,blue";
console.log(color.split(","));	// (4) ["yellow", "red", "green", "blue"]
console.log(color.split(",",2));	//(2) ["yellow", "red"]
console.log(color.split(/[^,]+/));	(5) ["", ",", ",", ",", ""] 。[^,]除了 , 之外
复制代码