JavaScript字符串对象完全指南

JavaScript字符串(String)对象完全指南

编程小白也能看懂的详细知识点汇总

字符串是编程中最常用的数据类型之一，用于表示文本信息。在JavaScript中，字符串既可以是基本类型，也可以是对象。

1. 字符串基础

字符串是什么？ 字符串就是由零个或多个字符组成的序列，用来表示文本数据。

创建字符串的两种方式：

                    // 方式1：字面量（最常用）

                    let str1 = “Hello, World!”;

                    let str2 = ‘JavaScript 字符串’;

                    // 方式2：使用String构造函数

                    let str3 = new String(“这也是一个字符串”);

💡 提示：通常使用字面量方式创建字符串，这样更简洁高效。

字符串基本特征：

不可变性：一旦创建，字符串内容无法直接修改
有序性：字符串中的字符按顺序排列，有固定位置
Unicode支持：JavaScript字符串支持所有Unicode字符

2. 字符串属性

length属性

返回字符串中字符的数量（包括空格和标点）

                    let message = “Hello, 世界!”;

                    console.log(message.length); // 输出: 10

                    // H e l l o ,   世 界 ! → 10个字符

实际应用：表单验证时检查输入长度

访问单个字符

使用方括号[]或charAt()方法访问特定位置的字符

                    let text = “JavaScript”;

                    // 两种访问方式

                    console.log(text[0]); // “J”

                    console.log(text.charAt(4)); // “S”

                    // 超出范围的情况

                    console.log(text[20]); // undefined

                    console.log(text.charAt(20)); // “” (空字符串)

3. 常用方法（一）

大小写转换

toUpperCase()：转成大写字母
toLowerCase()：转成小写字母

                    let city = “New York”;

                    console.log(city.toUpperCase()); // “NEW YORK”

                    console.log(city.toLowerCase()); // “new york”

查找字符串位置

indexOf()：查找子串首次出现的位置
lastIndexOf()：查找子串最后一次出现的位置

                    let phrase = “To be or not to be”;

                    console.log(phrase.indexOf(“be”)); // 3

                    console.log(phrase.lastIndexOf(“be”)); // 16

                    console.log(phrase.indexOf(“javascript”)); // -1 (未找到)

实际应用：检查字符串中是否包含特定内容

4. 常用方法（二）

提取子字符串

slice(start, end)：提取部分字符串，支持负数索引
substring(start, end)：类似slice，但不支持负数
substr(start, length)：从指定位置提取指定长度的字符

                    let language = “JavaScript”;

                    console.log(language.slice(0, 4)); // “Java”

                    console.log(language.slice(-6)); // “Script”

                    console.log(language.substring(4)); // “Script”

                    console.log(language.substr(4, 3)); // “Scr”

替换内容

replace(old, new)：替换第一个匹配的子串
replaceAll(old, new)：替换所有匹配的子串

                    let text = “I like cats. Cats are cute.”;

                    console.log(text.replace(“cats”, “dogs”));

                    // “I like dogs. Cats are cute.”

                    console.log(text.replaceAll(“cats”, “dogs”));

                    // “I like dogs. Dogs are cute.”

                    // 使用正则表达式替换所有（不区分大小写）

                    console.log(text.replace(/cats/gi, “dogs”));

                    // “I like dogs. dogs are cute.”

5. 常用方法（三）

去除空白

trim()：去除字符串两端的空白字符
trimStart()：只去除开头的空白
trimEnd()：只去除结尾的空白

                    let userInput = ”   user@example.com   “;

                    console.log(userInput.trim()); // “user@example.com”

                    console.log(userInput.trimStart()); // “user@example.com   “

                    console.log(userInput.trimEnd()); // ”   user@example.com”

连接字符串

concat()：连接多个字符串
+ 运算符：更常用的连接方式
模板字符串：ES6引入的高级字符串拼接

                    let firstName = “张”;

                    let lastName = “三”;

                    // 使用concat方法

                    console.log(firstName.concat(lastName)); // “张三”

                    // 使用+运算符

                    console.log(firstName + lastName); // “张三”

                    // 使用模板字符串

                    console.log(`${firstName}${lastName}`); // “张三”

                    console.log(`欢迎${firstName}${lastName}访问我们的网站！`);

6. 高级特性

模板字符串 (ES6+)

使用反引号(`)创建，支持多行文本和嵌入表达式

                    let name = “李四”;

                    let age = 25;

                    // 多行字符串

                    let multiLine = `这是一行文本

                    这是第二行文本

                    这是第三行文本`;

                    // 嵌入表达式

                    let greeting = `你好，${name}！

                    你今年${age}岁了，

                    明年你就${age + 1}岁了。`;

                    console.log(greeting);

分割字符串

split(separator)：将字符串拆分为数组

                    let fruits = “苹果,香蕉,橙子,葡萄”;

                    let fruitArray = fruits.split(“,”);

                    console.log(fruitArray); // [“苹果”, “香蕉”, “橙子”, “葡萄”]

                    let letters = “Hello”;

                    console.log(letters.split(“”)); // [“H”, “e”, “l”, “l”, “o”]

其他实用方法

includes()：检查是否包含某个子串
startsWith()：检查是否以某个子串开头
endsWith()：检查是否以某个子串结尾
repeat()：重复字符串指定次数

                    let sentence = “JavaScript is awesome!”;

                    console.log(sentence.includes(“awesome”)); // true

                    console.log(sentence.startsWith(“Java”)); // true

                    console.log(sentence.endsWith(“!”)); // true

                    console.log(“Ha “.repeat(3)); // “Ha Ha Ha ”

1. 字符串基础

创建字符串的两种方式：

字符串基本特征：

2. 字符串属性

length属性

访问单个字符

3. 常用方法（一）

大小写转换

查找字符串位置

4. 常用方法（二）

提取子字符串

替换内容

5. 常用方法（三）

去除空白

连接字符串

6. 高级特性

模板字符串 (ES6+)

分割字符串

其他实用方法

发表评论 取消回复

发表评论取消回复