前端点滴（JS基础）（三）---- String 对象

JavaScript 内置对象（二）

String 对象

String 对象用于处理文本（字符串）。

1. String 对象实例

var txt = new String("string");
或者更简单方式：
var txt = "string";

2. String 对象方法

String 对象的查询、连接

1. charAt() 返回在指定位置的字符。

语法：string.charAt(index)

定义：
charAt() 方法查询并返回指定位置的字符。
第一个字符位置为 0, 第二个字符位置为 1,以此类推。

实例：

/* 查询字符串中第三个元素，并返回 */
/* 查询第 n 个 ，   index = n-1 */

var str = "HELLO WORLD";
var n = str.charAt(2);
console.log(n);  //=>  L

2. charCodeAt() 返回在指定的位置的字符的 Unicode 编码。

语法：string.charCodeAt(index)

定义：
charCodeAt() 方法可返回指定位置的字符的 Unicode 编码。
字符串中第一个字符的位置为 0， 第二个字符位置为 1，以此类推。

常用的unicode编码范围：
0x表示16进制
汉字：[0x4e00,0x9fa5]（或十进制[19968,40869]）
数字：[0x30,0x39]（或十进制[48, 57]）
小写字母：[0x61,0x7a]（或十进制[97, 122]）
大写字母：[0x41,0x5a]（或十进制[65, 90]）

实例：

/* 查询字符串第三个字符的unicode编码，并返回 */

var str = "HELLO WORLD";
var n = str.charCodeAt(2);
console.log(n);   //=>  76

3. includes() 查找字符串中是否包含指定的完整的子字符串。

语法：string.includes(searchvalue, start)

定义：
includes() 方法用于判断字符串是否包含指定的完整的子字符串。
如果找到匹配的字符串则返回 true，否则返回 false。

注意： includes() 方法区分大小写。
注意： searchvalue 必需，要查找的字符串。
注意： start 可选，设置从那个位置开始查找，默认为 0。
注意： 返回值是一个Boolean类型的值。
注意： 填写 index 时，需要考虑空白字符串。

实例：

/* 默认从字符串开头查找 */
var str = "Hello world, welcome to the Runoob。";
var n = str.includes("world");
console.log(n);  //=> true

/* 从规定的地方开始查找 */
var n = str.includes("world",8);
console.log(n);  //=> false

4. indexOf() 返回某个指定的字符串值在字符串中首次出现的位置。

语法：string.indexOf(searchvalue,start)

定义：
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
如果没有找到匹配的字符串则返回 -1。

注意： indexOf() 方法区分大小写。
注意： 填写 index 时，需要考虑空白字符串，以及一些符号（,!.?）。
参数说明同上；

实例：

var str="Hello world, welcome to the universe.";
var n=str.indexOf("welcome");
console.log(n);  //=> 13

/* 注意区分大小写 */
var str="Hello world, welcome to the universe.";
var n=str.indexOf("Welcome");
console.log(n);  //=> -1

var str="Hello world, welcome to the universe.";
var n=str.indexOf("welcome",13);
console.log(n);  //=> 13

5. lastIndexOf() 从后向前搜索字符串，并从起始位置（0）开始计算返回字符串最后出现的位置。

语法：string.lastIndexOf(searchvalue,start)

定义：
lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置，如果指定第二个参数 start，则在一个字符串中的指定位置从后向前搜索。
开始检索的位置在字符串的 start 处或字符串的结尾（没有指定 start 时）。
如果没有找到匹配字符串则返回 -1 。

注意： lastIndexOf() 方法是区分大小写的。
注意： 定义了start就从start开始往前搜索。没有定义就从0往后搜索。
注意： 该方法将从后向前检索字符串，但返回是从起始位置 (0) 开始计算子字符串最后出现的位置。 看它是否含有字符串。

实例：

/* 没有定义start */
var str="I am from runoob，welcome to runoob site.";
var n=str.lastIndexOf("runoob");
console.log(n);  //=> 28

/* 定义了start */
var str="I am from runoob，welcome to runoob site.";
var n=str.lastIndexOf("runoob",9);
console.log(n);  //=>  -1 

/* 定义了start */
var str="I am from runoob，welcome to runoob site.";
var n=str.lastIndexOf("runoob",20);
console.log(n);  //=>  10

6. match() 查找找到一个或多个正则表达式的匹配。

语法：string.match(regexp)

定义：
match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。regexp 表示正则表达式

注意： match() 方法是区分大小写的。但是可以设置 i 标志忽略大小写。
注意： match() 方法将检索字符串 String Object，以找到一个或多个与 regexp 匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g（全局标志）。如果 regexp 没有标志 g，那么 match() 方法就只能在 stringObject 中执行一次匹配（只返回一个）。如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。

实例：

/* 不区分大小写（ i 标志），全局查找 */
var str="The rain in SPAIN stays mainly in the plain"; 
var n=str.match(/ain/gi);
console.log(n);  //=>  ["ain", "AIN", "ain", "ain"]

/* 区分大小写，全局查找 */
var str="The rain in SPAIN stays mainly in the plain"; 
var n=str.match(/ain/g);
console.log(n);   //=> ["ain", "ain", "ain"]

/* 区分大小写，非全局查找 */
var str="The rain in SPAIN stays mainly in the plain"; 
var n=str.match(/ain/); 
console.log(n);   //=> ["ain"]

/* 返回null */
var str="The rain in SPAIN stays mainly in the plain"; 
var n=str.match(/as/); 
console.log(n);   //=> null

7. search() 查找与正则表达式相匹配的值。

语法：string.search(searchvalue)

定义：
search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。输出的是字符串匹对位置
如果没有找到任何匹配的子串，则返回 -1。

注意： 默认情况下search() 区分大小写。
注意： searchvalue可以是正则表达式，还可以是字符串

实例：

/* 匹配字符串 */
var str="Visit MyBlog!"; 
var n=str.search("MyBlog");
console.log(n);  //=>  6

/* 匹配正则表达式 */
var str="Visit MyBlog!"; 
var n=str.search(/MyBlog/);
console.log(n);  //=>  6

/* 匹配正则表达式 */
var str="Visit MyBlog，Visit MyBlog，Visit MyBlog!"; 
var n=str.search(/MyBlog/g);
console.log(n);  //=>  6

/* 匹配正则表达式，忽略大小写 */
var str="Visit MyBlog，Visit MyBlog，Visit MyBlog!"; 
var n=str.search(/myBlog/gi);
console.log(n);  //=>  6

8. startsWith() 查看字符串是否以指定的子字符串开头。

语法：string.startsWith(searchvalue, start)

定义：
startsWith() 方法用于检测字符串是否以指定的子字符串开始。
如果是以指定的子字符串开头返回 true，否则 false。

注意： startsWith() 方法区分大小写。
注意： start 可选，查找的开始位置，默认为 0。
注意： 返回的是Boolean类型的值

实例：

/* 默认情况 */
var str = "Hello world, welcome to the Runoob.";
var n = str.startsWith("world");
console.log(n);   //=> false

/* 带有start */
var str = "Hello world, welcome to the Runoob.";
var n = str.startsWith("world", 6);
console.log(n);  //=> true

9. valueOf() 返回某个字符串对象的原始值。

语法：string.valueOf()

定义：
valueOf() 方法可返回 String 对象的原始值。

注意： valueOf() 方法通常由 JavaScript 在后台自动进行调用，而不是显式地处于代码中。

实例：

var str="Hello world!";
var n = str.valueOf();
console.log(n);  //=>  "Hello world!"

10. concat() 连接两个或更多字符串，并返回新的字符串。

语法：string.concat(string1, string2, ..., stringX)

定义：
concat() 方法用于连接两个或多个字符串。

注意： 该方法没有改变原有字符串，但是会返回连接两个或多个字符串新字符串。
注意： 连接多个字符串是用逗号“，”隔开。

实例：

var str1 = "Hello ";
var str2 = "world!";
var n = str1.concat(str2);
console.log(n);  //=>  "Hello world!"

String 对象的替换、转换

1. replace() 在字符串中查找匹配的子串， 并替换与正则表达式匹配的子串。

语法：string.replace(searchvalue,newvalue)

定义：
replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。（只替换一次）

注意： replace()不会改变原始的字符串。
注意： 默认情况下区分大小写。
注意： searchvalue 可以是字符串，也可以是正则表达式

实例：

/* 默认情况 */
var str="Visit Microsoft! Visit Microsoft!";
var n=str.replace("Microsoft","MyBlog");
console.log(n);    //=>  "Visit MyBlog! Visit Microsoft!"

/* 使用正则表达式 ，加上全局标志*/
var str="Visit Microsoft! Visit Microsoft!";
var n=str.replace(/Microsoft/g,"MyBlog");
console.log(n);     //=>  "Visit MyBlog! Visit MyBlog!"

/* 使用正则表达式，忽略大小写 ，加上全局标志*/
var str="Visit Microsoft! Visit Microsoft!";
var n=str.replace(/microsoft/gi,"MyBlog");
console.log(n);     //=>  "Visit MyBlog! Visit MyBlog!"

实例二 （知识回顾）（通过 prototype 为 JavaScript 的 String 对象添加方法，来实现将所有 “Microsoft” 替换为 “MyBlog”）：

var str="Visit Microsoft! Visit Microsoft!";
String.prototype.replaceFn = function (search, replacement){
	var target = this;
	return target .replace(new RegExp(search,"g"),replacement);
}
console.log(str.replaceFn("Microsoft","MyBlog"));  //=>  "Visit MyBlog! Visit MyBlog!"

2. toLowerCase() 把字符串全转换为小写。

语法：string.toLowerCase()

定义：
toLowerCase() 方法用于把字符串全转换为小写。

注意： toLowerCase() 不会改变原始字符串。

实例：

var str="MyBlog";
var n = str.toLowerCase();
console.log(str);  //=>  "MyBlog"
console.log(n); //=>  "myblog"

3. toUpperCase() 把字符串全转换为大写。

语法：string.toUpperCase()

定义：
toUpperCase() 方法用于把字符串全转换为大写。

注意： toUpperCase() 不会改变原始字符串。

实例：

var str="myblog";
var n = str.toUpperCase();
console.log(str);  //=>  "myblog"
console.log(n); //=> "MYBLOG"

4. toLocaleLowerCase() 根据本地主机的语言环境把字符串转换为小写。

语法：string.toLocaleLowerCase()

定义：
toLocaleLowerCase() 方法根据本地主机的语言环境把字符串转换为小写。
本地是根据浏览器的语言设置来判断的。
通常，该方法与 toLowerCase() 方法返回的结果相同

注意： toLocaleLowerCase() 不会改变原始字符串。

实例：

var str="MyBlog";
var n = str.toLocaleLowerCase();
console.log(str);  //=>  "MyBlog"
console.log(n); //=>  "myblog"

5. toLocaleUpperCase() 根据本地主机的语言环境把字符串转换为大写。

语法：string.toLocaleUpperCase()

定义：
toLocaleUpperCase() 方法根据本地主机的语言环境把字符串转换为小写。
本地是根据浏览器的语言设置来判断的。
通常，该方法与 toUpperCase() 方法返回的结果相同

注意： toLocaleUpperCase() 不会改变原始字符串。

实例：

var str="myblog";
var n = str.toLocaleUpperCase();
console.log(str);  //=>  "myblog"
console.log(n); //=> "MYBLOG"

6. toString() 返回一个字符串。

语法：string.toString()

定义：
toString() 方法返回一个表示 String 对象的值。

实例：

var str = "MyBlog";
var res = str.toString();
console.log(res);  //=>  "MyBlog"

String 对象的截取、分割、重复（复制粘贴）、去空白

1. slice() 提取字符串的片断，并在新的字符串中返回被提取的部分。

语法：string.slice(start,end)

定义：
slice(start, end) 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。
使用 start 和 end 参数来指定字符串提取的部分。
字符串中第一个字符位置为 0, 第二个字符位置为 1, 以此类推。

注意： slice() 不会改变原始字符串。
注意： 如果是负数，则该参数规定的是从字符串的尾部开始算起的位置。也就是说，-1 指字符串的最后一个字符，-2 指倒数第二个字符，以此类推。

实例：

/* 默认截取全部 */
var str="Hello world!";
var n=str.slice(0);
console.log(n);  //=>  "Hello world!"

/* 带有start，end参数 */
/* 从第n个字符开始截取   start = n-1*/
/* 从第二个字符开始截取（截取第二个字符） ，截取到第六个*/
var str="Hello world!";
var n=str.slice(1,6);
console.log(n);  //=> "ello "

/* 截取第一个字符，并要求返回str字符串首字母大写 */
var str="hello world!";
var n =str.slice(0,1).toUpperCase();
var n2 = str.slice(1);
var n3 = n+n2;
console.log(n3);  //=> "Hello world!"

/* 提取最后一个字符 */
var str="Hello world!";
var n=str.slice(-1);
console.log(n);  //=> !

2. substr() 从起始索引号提取字符串中指定数目的字符。

语法：string.substr(start,length)

定义：
substr() 方法可在字符串中抽取从 开始 下标开始的指定数目的字符。

注意： substr() 不会改变原始字符串。
注意： 不设置length，默认到最后。
注意： substr() 的参数指定的是子串的开始位置和长度，因此它可以替代 substring() 和 slice() 来使用。
在 IE 4 中，参数 start 的值无效。在这个 BUG 中，start 规定的是第 0 个字符的位置。在之后的版本中，此 BUG 已被修正。
ECMAscript 没有对该方法进行标准化，因此反对使用它。

实例：

/* 从第n个字符开始截取（截取第n个）   start = n-1 */
/* 截取第三个字符到最后 */
var str="Hello world!";
var n=str.substr(2);
console.log(n);  //=>  "llo world!"

/* 截取第三个字符*/
var str="Hello world!";
var n=str.substr(2,1);
console.log(n);  //=>  "l"

3. substring() 提取字符串中两个指定的索引号之间的字符。

语法：string.substring(from, to)

定义：
substring() 方法用于提取字符串中介于两个指定下标之间的字符。

注意： substring() 不会改变原始字符串。

实例：

/* 截取第3~7的字符 */
var str="Hello world!";
var n=str.slice(2,7);
console.log(n);  //=> "llo w"

4. split() 把字符串分割为字符串数组。

语法：string.split(separator,limit)

定义：
split() 方法用于把一个字符串分割成字符串数组。

注意： split() 方法不改变原始字符串。
注意： 如果把空字符串 ("") 用作 separator，那么 stringObject 中的每个字符之间都会被分割。（小分割）
注意： limit 该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。

实例：

/* 大分割 */
var str="How are you doing today?";
var n=str.split(' ');
console.log(n)  //=> ["How", "are", "you", "doing", "today?"]

/* 小分割 */
var str="How are you doing today?";
var n=str.split('');
console.log(n)  //=> ["H", "o", "w", " ", "a", "r", "e", " ", "y", "o", "u", " ", "d", "o", "i", "n", "g", " ", "t", "o", "d", "a", "y", "?"]

/* 设置了 length */
var str="How are you doing today?";
var n=str.split(' ',2);
console.log(n)  //=> ["How", "are"]

5. repeat() 复制字符串指定次数，并将它们连接在一起返回。

语法：string.repeat(count)

定义：
epeat() 方法字符串复制指定次数。（复制粘贴）

注意： repeat() 方法不改变原始字符串。
注意： count 为复制粘贴次数，必填，若果不填返回结果为 " "

实例：

var str = "hello";
var res  = str.repeat(2);
console.log(res);   //=> "hellohello"

var str = "hello";
var res  = str.repeat();
console.log(res);   //=> ""

6. trim() 去除字符串两边的空白

语法：string.trim()

定义：
trim() 方法用于删除字符串的头尾空格。

注意： trim() 方法不会改变原始字符串。

实例：

var str = "       hello        ";
var res = str.trim();
console.log(res);  //=> "hello"

如果浏览器不支持 trim() 方法，还可以使用replace()、正则表达式来实现：

function myTrim(x) {
  return x.replace(/^\s+|\s+$/gm,'');   // 此为正则表达式，表示字符串全局头尾空白被''（空）替代
}
function myFunction() {
  var str = myTrim("        Runoob        ");
  console.log(str);
}
myFunction();  //=>  "Runoob"

总结

String 对象中的所有方法均不会改变原始String对象实例。
String 对象中的常用方法：
查询：indexOf、match、search。查询方法默认情况下均对大小写敏感。
连接：concat。
替换：replace。
转换：toLowerCase、toUpperCase。
截取：slice、substr。
分割：split。
复制：repeat。
去空白：trim。
其中涉及到正则表达式，在后期进行表单验证、登录验证…信息验证时显得非常关键