大家好，我是格子。今天给大家分享 JavaScript 中字符串和数组方法的使用
在 JavaScript 编程中，字符串和数组是最常用的数据类型之一，它们提供了丰富的方法来操作和处理数据。今天，我们将深入探讨 JavaScript 中字符串和数组的各种方法，帮助大家更好地理解和运用它们。
一、字符串方法
1. charAt()
charAt() 方法返回指定位置的字符。字符串中的字符索引从 0 开始。
let str = "Hello";
let char = str.charAt(1); // char 的值为 'e'，因为索引 1 对应的字符是 'e'
2. charCodeAt()
charCodeAt() 方法返回指定位置字符的 Unicode 码点。
let str = "A";
let code = str.charCodeAt(0); // code 的值为 65，因为字符 'A' 的 Unicode 码点是 65
3. concat()
concat() 方法用于连接两个或多个字符串，返回连接后的新字符串，原字符串不变。
let str1 = "Hello";
let str2 = " World";
let newStr = str1.concat(str2); // newStr 的值为 "Hello World"
4. includes()
includes() 方法判断一个字符串是否包含在另一个字符串中，返回布尔值。
let str = "JavaScript";
let result = str.includes("Script"); // result 的值为 true，因为 "JavaScript" 包含 "Script"
5. endsWith()
endsWith() 方法判断字符串是否以指定的字符串结尾，返回布尔值。
let str = "example.txt";
let result = str.endsWith(".txt"); // result 的值为 true，因为字符串以 ".txt" 结尾
6. startsWith()
startsWith() 方法判断字符串是否以指定的字符串开头，返回布尔值。
let str = "https://example.com";
let result = str.startsWith("https://"); // result 的值为 true，因为字符串以 "https://" 开头
7. indexOf()
indexOf() 方法返回指定子字符串在字符串中第一次出现的位置索引。如果没有找到，返回 -1。
let str = "apple,banana,apple";
let index = str.indexOf("banana"); // index 的值为 6，因为 "banana" 从索引 6 的位置开始
8. lastIndexOf()
lastIndexOf() 方法返回指定子字符串在字符串中最后一次出现的位置索引。如果没有找到，返回 -1。
let str = "apple,banana,apple";
let index = str.lastIndexOf("apple"); // index 的值为 13，因为最后一个 "apple" 从索引 13 的位置开始
9. localeCompare()
localeCompare() 方法比较两个字符串，返回一个数字来表示它们在排序中的相对位置。如果小于返回 -1，等于返回 0，大于返回 1。
let str1 = "apple";
let str2 = "banana";
let result = str1.localeCompare(str2); // result 的值为 -1，因为 "apple" 在字典序中排在 "banana" 之前
10. match()
match() 方法在字符串中检索指定的值，或找到一个或多个正则表达式的匹配。返回匹配结果的数组。
let str = "The quick brown fox";
let matches = str.match(/fox/); // matches 是一个数组，包含匹配到的 "fox"，如果没有匹配到则为 null
11. repeat()
repeat() 方法将字符串重复指定次数，返回新的字符串。
let str = "Hi";
let newStr = str.repeat(3); // newStr 的值为 "HiHiHi"
12. replace()
replace() 方法在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。返回替换后的新字符串。
let str = "Hello, world";
let newStr = str.replace("world", "JavaScript"); // newStr 的值为 "Hello, JavaScript"
13. search()
search() 方法在字符串中检索指定的值，或找到一个或多个正则表达式的匹配位置。返回匹配的位置索引，如果没有找到返回 -1。
let str = "The quick brown fox";
let index = str.search(/fox/); // index 的值为 16，因为 "fox" 从索引 16 的位置开始
14. slice()
slice() 方法提取字符串的一部分，并返回一个新字符串。
let str = "Hello, world";
let newStr = str.slice(0, 5); // newStr 的值为 "Hello"，从索引 0 开始，到索引 5（不包括 5）结束
15. split()
split() 方法将一个字符串分割为子字符串数组。
let str = "apple,banana,cherry";
let fruits = str.split(","); // fruits 是一个数组，包含 ["apple", "banana", "cherry"]
16. substr()
substr() 方法从起始索引开始提取指定长度的字符串。返回新的字符串。
let str = "Hello, world";
let newStr = str.substr(7, 5); // newStr 的值为 "world"，从索引 7 开始，提取长度为 5 的字符串
17. substring()
substring() 方法提取字符串中介于两个指定索引之间的字符。返回新的字符串。
let str = "Hello, world";
let newStr = str.substring(7, 12); // newStr 的值为 "world"，从索引 7 开始，到索引 12（不包括 12）结束
18. toLowerCase()
toLowerCase() 方法将字符串转换为小写字母形式。返回新的字符串。
let str = "HELLO";
let newStr = str.toLowerCase(); // newStr 的值为 "hello"
19. toUpperCase()
toUpperCase() 方法将字符串转换为大写字母形式。返回新的字符串。
let str = "hello";
let newStr = str.toUpperCase(); // newStr 的值为 "HELLO"
20. trim()
trim() 方法去除字符串两端的空白字符。返回新的字符串。
let str = " Hello ";
let newStr = str.trim(); // newStr 的值为 "Hello"
21. trimLeft ()（也称为 trimStart ()）
trimLeft() 方法去除字符串开头的空白字符。返回新的字符串。
let str = " Hello";
let newStr = str.trimLeft(); // newStr 的值为 "Hello"
22. trimRight ()（也称为 trimEnd ()）
trimRight() 方法去除字符串结尾的空白字符。返回新的字符串。
let str = "Hello ";
let newStr = str.trimRight(); // newStr 的值为 "Hello"
二、数组方法
1. concat()
concat() 方法用于合并两个或多个数组，返回一个新数组，原数组不变。
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let newArr = arr1.concat(arr2); // newArr 的值为 [1, 2, 3, 4, 5, 6]
2. copyWithin()
copyWithin() 方法浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。
let arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3); // arr 的值变为 [4, 5, 3, 4, 5]，从索引 0 开始用从索引 3 开始的元素替换
3. entries()
entries() 方法返回一个新的 Array Iterator 对象，该对象包含数组中每个索引的键 / 值对。
let arr = ['a', 'b', 'c'];
let iterator = arr.entries();
for (let [index, element] of iterator) {
console.log(index, element);
}
// 输出 0 a、1 b、2 c
4. every()
every() 方法测试数组中的所有元素是否都通过了指定函数的测试，返回布尔值。
let arr = [1, 2, 3, 4, 5];
let result = arr.every((element) => element > 0); // result 的值为 true，因为所有元素都大于 0
5. fill()
fill() 方法用一个固定值填充一个数组中从起始索引到结束索引内的全部元素，返回填充后的数组。
let arr = new Array(5);
arr.fill(0); // arr 的值为 [0, 0, 0, 0, 0]
6. filter()
filter() 方法创建一个新数组，其元素是通过检查指定数组中符合条件的所有元素，返回新数组。
let arr = [1, 2, 3, 4, 5];
let newArr = arr.filter((element) => element > 3); // newArr 的值为 [4, 5]
7. find()
find() 方法返回数组中满足提供的测试函数的第一个元素的值。如果没有满足条件的元素，则返回 undefined。
let arr = [1, 2, 3, 4, 5];
let result = arr.find((element) => element > 3); // result 的值为 4，因为 4 是第一个大于 3 的元素
8. findIndex()
findIndex() 方法返回数组中满足提供的测试函数的第一个元素的索引。如果没有满足条件的元素，则返回 -1。
let arr = [1, 2, 3, 4, 5];
let index = arr.findIndex((element) => element > 3); // index 的值为 3，因为 4（第一个大于 3 的元素）的索引是 3
9. forEach()
forEach() 方法对数组的每个元素执行一次提供的函数，没有返回值，主要用于遍历数组。
let arr = [1, 2, 3, 4, 5];
arr.forEach((element) => console.log(element)); // 依次输出 1、2、3、4、5
10. from()
from() 方法从一个类似数组或可迭代对象创建一个新的数组。
let str = "hello";
let arr = Array.from(str); // arr 的值为 ['h', 'e', 'l', 'l', 'o']
11. includes()
includes() 方法判断一个数组是否包含一个指定的值，返回布尔值。
let arr = [1, 2, 3];
let result = arr.includes(2); // result 的值为 true，因为数组包含 2
12. indexOf()
indexOf() 方法返回数组中可以找到给定元素的第一个索引，如果不存在，则返回 -1。
let arr = [1, 2, 3, 2];
let index = arr.indexOf(2); // index 的值为 1，因为第一个 2 的索引是 1
13. isArray()
isArray() 方法判断一个对象是否为数组，返回布尔值。
let obj = [1, 2, 3];
let result = Array.isArray(obj); // result 的值为 true，因为 obj 是数组
14. join()
join() 方法将数组的所有元素连接成一个字符串，返回连接后的字符串。
let arr = ['a', 'b', 'c'];
let str = arr.join('-'); // str 的值为 "a - b - c"
15. keys()
keys() 方法返回一个新的 Array Iterator 对象，该对象包含数组中每个索引的键。
let arr = ['a', 'b', 'c'];
let iterator = arr.keys();
for (let key of iterator) {
console.log(key);
}
// 输出 0、1、2
16. lastIndexOf()
lastIndexOf() 方法返回指定元素在数组中最后一次出现的索引，如果不存在，则返回 -1。
let arr = [1, 2, 3, 2];
let index = arr.lastIndexOf(2); // index 的值为 3，因为最后一个 2 的索引是 3
17. map()
map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后的返回值。
let arr = [1, 2, 3];
let newArr = arr.map((element) => element * 2); // newArr 的值为 [2, 4, 6]
18. pop()
pop() 方法从数组中删除最后一个元素，并返回该元素。此方法会改变数组的长度。
let arr = [1, 2, 3];
let lastElement = arr.pop(); // lastElement 的值为 3，arr 变为 [1, 2]
19. push()
push() 方法将一个或多个元素添加到数组的末尾，并返回新的数组长度。此方法会改变数组的长度。
let arr = [1, 2, 3];
let length = arr.push(4); // length 的值为 4，arr 变为 [1, 2, 3, 4]
20. reduce()
reduce() 方法对数组中的每个元素执行一个由您提供的 reducer 函数（升序执行），将其结果汇总为单个返回值。
let arr = [1, 2, 3, 4];
let sum = arr.reduce((accumulator, currentValue) => accumulator + currentValue);
// sum 的值为 10，相当于 ((1 + 2) + 3) + 4
21. reduceRight()
reduceRight() 方法对数组中的每个元素执行一个由您提供的 reducer 函数（降序执行），将其结果汇总为单个返回值。
let arr = [1, 2, 3, 4];
let sum = arr.reduceRight((accumulator, currentValue) => accumulator + currentValue);
// sum 的值为 10，相当于 (1 + (2 + (3 + 4)))
22. reverse()
reverse() 方法将数组中元素的顺序颠倒，返回颠倒后的数组，此方法会改变数组。
let arr = [1, 2, 3];
let newArr = arr.reverse(); // newArr 的值为 [3, 2, 1]，arr 也变为 [3, 2, 1]
23. shift()
shift() 方法从数组中删除第一个元素，并返回该元素。此方法会改变数组的长度。
let arr = [1, 2, 3];
let firstElement = arr.shift(); // firstElement 的值为 1，arr 变为 [2, 3]
24. unshift()
unshift() 方法将一个或多个元素添加到数组的开头，并返回新的数组长度。此方法会改变数组的长度。
let arr = [1, 2, 3];
let length = arr.unshift(0); // length 的值为 4，arr 变为 [0, 1, 2, 3]
25. slice()
slice() 方法返回一个新的数组，包含从开始索引到结束索引（不包括结束索引）的元素。
let arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(1, 4); // newArr 的值为 [2, 3, 4]
26. some()
some() 方法测试数组中是否至少有一个元素通过了指定函数的测试，返回布尔值。
let arr = [1, 2, 3, 4, 5];
let result = arr.some((element) => element > 3); // result 的值为 true，因为存在大于 3 的元素
27. sort()
sort() 方法对数组的元素进行排序，并返回排序后的数组。默认情况下，它将元素转换为字符串并按字典顺序排序。
let arr = [5, 3, 1, 4, 2];
let sortedArr = arr.sort();
// sortedArr的值为 [1, 2, 3, 4, 5]，不过对于数字排序可能不符合预期，对于数字排序还可以这样
let numberArr = [5, 3, 1, 4, 2];
let correctSortedArr = numberArr.sort((a, b) => a - b);
// correctSortedArr的值为 [1, 2, 3, 4, 5]，按照数字升序排列
28. splice()
splice()方法用于添加或删除数组中的元素。它可以在指定位置删除指定数量的元素，并可以在删除的位置插入新元素。这个方法会改变原数组。
let arr = [1, 2, 3, 4, 5];
// 从索引2开始删除1个元素
let removedElements = arr.splice(2, 1);
// removedElements的值为[3]，arr变为[1, 2, 4, 5]
// 在索引2插入元素
arr.splice(2, 0, 3);
// arr变为[1, 2, 3, 4, 5]
总结
字符串和数组的方法为我们在 JavaScript 中处理文本和数据集合提供了强大的工具。理解和熟练运用这些方法，可以让我们的代码更加简洁高效，能够快速地完成各种复杂的任务，如数据筛选、转换、拼接等。希望这篇全解析能够帮助大家更好地掌握 JavaScript 中字符串和数组的操作。在实际开发中，多实践这些方法，才能真正地融会贯通，提升自己的编程能力。
