【JavaScript 教程系列第 13 篇】常见的字符串方法及用法汇总

这是【JavaScript 教程系列第 13 篇】，如果觉得有用的话，欢迎关注专栏。

前言 在 JavaScript 中，String 类型作为常见的内置对象之一，有着非常多的属性和方法，但我们也不必全部都知道，不常用的我们作为了解即可，本篇博客针对 JavaScript 中常见的字符串方法及用法做一下简单汇总，接下来是博客正文。

一：获取字符串的长度

说明： 使用字符串的 length 属性可以获取字符串的长度，长度以字符为单位，该属性为只读属性。

示例：

	var str = "su xing!";
	document.write(str.length)   // 返回 8

浏览器运行效果如下 返回的字符串长度是 8 ，因为除了一个字母，一个标点符号各占用一个字符长度外，一个空格也占用一个字符长度。

二：大小写转换 2-1：大写转小写 toLowerCase()

说明： 使用字符串的 toLowerCase() 方法将大写字符串转换为小写字符串，其中 lowercase 是小写的意思。

示例：

	var str = "SU XING";
	document.write(str.toLowerCase())   // 返回字符串 su xing

浏览器运行效果如下

2-2：小写转大写 toUpperCase()

说明： 使用字符串的 toUpperCase() 方法将小写字符串转换为大写字符串，其中 uppercase 是大写的意思。

示例：

	var str = "allen su";
	document.write(str.toUpperCase())   // 返回字符串 ALLEN SU

浏览器运行效果如下

三：字符串查找 3-1：获取指定下标的字符 charAt()

说明： 使用字符串的 charAt(n) 方法可以获取到下标 n 的字符，其中参数 n 的取值范围是 [0，length - 1]。

注意，字符串第一个字符的下标是 0 ，第二个字符的下标是 1，以此类推，第 n 个字符的下标是（n - 1）。

示例：

	var str = "JavaScript";

	// 下标在 [0，length-1] 之间
	document.write(str.charAt(0)+"");   // 获取第 1  个字符，返回 J
	document.write(str.charAt(9)+"");   // 获取第 10 个字符，返回 t

	// 下标不在 [0，length-1] 之间
	document.write(str.charAt(10)+"");  // 获取第 11 个字符，返回 空字符串
	document.write(str.charAt(10).length);   // 返回的长度为 0，说明是一个空字符串

浏览器运行效果如下 总结：

• 如果获取的下标在 [0，length-1] 之间，可以正常获取当前下标对应的字符。
• 如果获取的下标不在 [0，length-1] 之间，则返回空字符串。

3-2：获取指定字符的下标 indexOf()

说明： 使用字符串的 indexOf() 方法，可以根据参数中的字符串，返回该字符串的下标位置。

示例 1：

    var str = "JavaScript";
    document.write(str.indexOf("a"));   // 返回值为 1

浏览器运行效果如下 由此可知，字符 a 出现在字符串下标为 1 的位置处。

不过，在 “JavaScript” 这个字符串中，有两个 a ，为什么输出的不是下标为 3 处的 a 呢 ？

因为 indexOf() 方法是按照从左到右的顺序进行查找的，返回查找到的第一个字符串的起始下标值。

示例 2： indexOf() 方法还有第二个参数，就是指定从哪个位置开始查找，该参数的取值范围是 [0，length-1]

如下代码所示

    var str = "JavaScript";
    document.write(str.indexOf("a",2));   // 返回值为 3

这次我们指定从下标为 2 ，即第 3 个字符 v 开始向右查找出现字符 a 的下标，浏览器运行效果如下 对于参数二，有几个地方需要特别说明一下

• 省略该参数时，默认从字符串中的第一个字符开始查找。
• 如果参数值大于或者等于字符串的长度，则认为当前字符串中不存在要查找的字符，返回结果 -1 。
• 如果参数值为负数，则看做是从下标 0 开始查找，即相当于从第一个字符开始查找。

关于这几点我这边已经测试过了，有兴趣的也可以自己试试。

拓展函数：lastIndexOf() 该方法与 indexOf() 功能一样，只是查找顺序相反，lastIndexOf() 方法的查找顺序是自右向左。

代码如下所示

    var str = "JavaScript";
    document.write(str.lastIndexOf("a"));   // 返回值为 3

返回的结果是 3 ，也许你会问，不是自右向左查找吗 ？不应该返回 6 吗 ？

虽然 lastIndexOf() 方法的查找顺序是自右向左。但是其参数和返回值都是根据字符串的下标，按照自左向右的顺序来计算的，要知道字符的下标是不会变的，即字符串中第一个字符的下标值始终是 0 ，字符串中最后一个字符的下标值始终是（ length - 1）

所以返回 a 字符的下标是 3 ，而不是 6 或者 1 。

四：字符串截取 substring()

说明： 使用字符串的 substring 方法来截字符串的某一部分。语法如下，字符串名.substring(start，end) 。

其中 start 表示开始位置，end 表示结束位置，start 和 end 都是整数，一般都是从 0 开始，其中 end 大于 start 。

参数的取值范围是 [start，end)，也就是包含 start，不包含 end 。end 可以省略，当 end 省略时，参数的取值范围是 start 到结尾

示例：

    var str = "JavaScript";
    document.write(str.substring(0)+'');   // 无 end 参数，默认截取到结尾
    document.write(str.substring(4,10));       // 返回结果 Script 

浏览器运行效果如下 “JavaScript” 这个字符串的长度是 9，所以如果你想用 end 参数截取到结尾，那就要填 10 。这样才可以取到第 9 个字符。

五：字符串替换 replace()

说明： 使用字符串的 replace() 方法，可以用一个字符串替换另一个字符串的某一部分，用法如下

• 字符串名.replace(原字符串，替换字符串)
• 字符串名.replace(正则表达式，替换字符串)

replace 方法有两种使用形式，一种是直接使用字符串来替换，另外一种是使用正则表达式来替换，但不管用的是哪种形式，“替换字符串” 都是第二个参数。

示例 1：原字符串

    var str = "JavaScript";
    document.write(str.replace("Java","Type"));   // 返回 TypeScript

这句代码的意思是将字符串 JavaScript 中的 Java 给换成 Type ， 所以返回的结果是 TypeScript ，浏览器运行效果如下

示例 2：正则表达式

    var str	= "A A A B B B";
    document.write(str.replace(/B/g,"A") + "");   // 正则表达式  返回 A A A A A A
    document.write(str.replace("B","A"));              // 原字符串   返回 A A A A B B

浏览器运行效果如下 str.replace(/B/g,"A") 表示用正则表达式 /B/g ，结合替换字符串 “A” ，来将字符串 str 中的所有 B 字符替换成 A 字符。

通过代码以及浏览器效果，我们可以发现，使用正则表达式的方式会替换掉字符串中所有的 B 字符，而使用原字符的方式，则只会替换掉第一个 B，注意这两个的区别。

六：字符串分割 split()

说明： 使用字符串的 split() 方法可以把一个字符串分割成一个数组，这个数组存放的是原来字符串的所有字符片断，数组的长度等于字符片断的个数。

语法是：字符串名.split(“分割符”)

其中，分割符可以是一个字符，可以是多个字符，也可以是一个正则表达式，需要注意的是，分割符不作为返回数组元素的一部分。

示例 1：

    var str = "c、java、python、php";
    var arr = str.split("、");
    for (var i = 0; i