JavaScript-字符串对象（String）

JavaScript字符串对象（String）

呆呆的小草

3099人浏览 · 2023-01-28 13:53:27

呆呆的小草 · 2023-01-28 13:53:27 发布

1、描述

字符串对于保存以文本形式表示的数据很有用。一些最常用的字符串操作是检查他们的长度，使用 + 和 += 字符串操作符构建和连接它们，使用 indexOf() 方法检查子字符串的存在或者位置，或使用 ?>substring() 方法提取子字符串。
————————引用自官网

2、创建字符串

从字符串字面量将字符串创建为原始值或使用 String() (en-US) 构造函数将字符串创建为对象。
————————引用自官网

（1）字面量创建

① 语法格式：

	let 变量名 = "字符串内容";
	//typeof查看类型，值为String;

② 示例：

	<script>
		let str = "value";
		console.log(typeof str);
	</script>

③ 运行效果

（2）new关键字创建

① 语法格式：

	let 变量名 = new String("字符串内容");
	//typeof查看类型，值为object，new是产生一个新对象;

② 示例：

	<script>
		let str = new String("value");
		console.log(typeof str);
	</script>

③ 运行效果

（3）String()创建

① 语法格式：

	let 变量名 = String("字符串内容");
	//typeof查看类型，值为String;

② 示例：

	<script>
		let str = String("value");
		console.log(typeof str);
	</script>

③ 运行效果

3、字符串属性

（1）字符串长度（length）

① 语法格式：

	let 变量名 = "字符串内容";
	//length查看字符串长度;

② 示例：

	<script>
		let str = "value";
		console.log(str.length);
	</script>

③ 运行效果

4、字符串方法

（1）charAt()：获取字符串指定下标的字符

获取指定下标的字符，如果没有指定下标位置，返回0，如果没有找到对应下标，返回空字符；

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.charAt(下标位置);

② 示例：

	<script>
		let str = "value";
		console.log(str.charAt(3));
	</script>

③ 运行效果

（2）slice：字符串截取

会生成一个新的字符串；
结束下标可以省略，省略后表示到字符串的最后；
开始位置可以为负，为负的时候表示从字符串最后一位开始；

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.slice(起始下标，结束下标)	//起始下标字符保留，结束下标字符不保留

② 示例：

	<script>
		let str = "hello world";
		console.log(str.slice(2,6));
	</script>

③ 运行效果

（3）indexOf()：查询字符串指定字符下标

返回指定字符，第一次出现的下标位置，如果没有找到，则返回-1；

1）默认查询

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.indexOf('要查询下标位置的字符');

② 示例：

	<script>
		let str = "javascript";
		console.log(str.indexOf("s"));
	/script>

③ 运行效果

2）指定查询起始位置（正数位置）

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.indexOf("要查询下标位置的字符",查询起始位置);

② 示例：

	<script>
		let str = "Hello World";
		console.log(str.indexOf("l",5));
	</script>

③ 运行效果

3）指定查询起始位置（负数位置）

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.indexOf("要查询下标位置的字符",查询起始位置);

② 示例：

	<script>
		let str = "Hello World";
		console.log(str.indexOf("l",-5));
	</script>

③ 运行效果

注意

查询起始位置可选，如果指定了起始位置，则返回值要大于与等于这个指定的起始位置，如果指定起始位置为负值，则相当于从0开始查找

（4）search()：返回指定字符串的位置

search() 与 indexOf()区别

search()与indexOf()的区别是，search()支持正则匹配

正则表达式，请参考官网文档

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.search("要查询的下标位置的字符，或者正则表达式");

② 示例：

	<script>
		let str = "Hello World";
		console.log(str.search("W"));
	</script>

③ 运行效果

（5）replace()：字符串中字符替换

replace()用于字符串中的字符替换，但是默认只能替换一个，支持正则表达式

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.replace("替换前的字符","替换后的字符");

② 示例：

	<script>
		let str = "javascript";
		console.log(str.replace("j","J"));
	</script>

③ 运行效果

（6）split()：拆分字符串，返回一个数组

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.split("分隔符");

② 示例：

	<script>
		let str = "name:sex:age:height";
		console.log(str.split(":"));	//以:作为分隔，取:前后内容;
	</script>

③ 运行效果

（7）trim()：清空首尾空格

1）清理首尾空格 — trim()

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.trim();

② 示例：

	<script>
		let str = " JavaScript ";
		console.log(str);	//清理前
		console.log(str.trim());	//清理后
	</script>

③ 运行效果

2）清理首部空格 — trimStart()

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.trimStart();

② 示例：

	<script>
		let str = " JavaScript ";
		console.log(str);	//清理前
		console.log(str.trimStart());	//清理后
	</script>

③ 运行效果

3）清理尾部空格 — trimEnd()

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.trimEnd();

② 示例：

	<script>
		let str = " JavaScript ";
		console.log(str);	//清理前
		console.log(str.trimEnd());		//清理后
	</script>

③ 运行效果

（8）includes()：查询字符串是否包含指定字符

查询字符串是否包含指定字符，返回布尔值（boolean），返回 true 为包含，返回 false 为不包含

① 语法格式：

	let 变量名 = "字符串内容";
	变量名.includes("要查找得字符");

② 示例：

	<script>
		let str = "JavaScript";
		console.log(str.includes("Script"));	//包含
		console.log(str.includes("Hello"));	//不包含
	</script>

③ 运行效果

（9）扩展

字符串也可以看成一个数组，通过下标来获取指定下标位置的字符

① 语法格式：

	let 变量名 = "字符串内容";
	变量名[下标位置];	//可以通过字符串名[下标位置]获取对应的字符，但是只能获取，不能进行修改

② 示例：

	<script>
		let str = "JavaScript";
		console.log(str[0]);
		console.log(str[1]);
		console.log(str[2]);
		console.log(str[3]);
		console.log(str[4]);
		console.log(str[5]);
		console.log(str[6]);
		console.log(str[7]);
		console.log(str[8]);
		console.log(str[9]);
	</script>