前言
大家好!不知道大家怎么样昂,反正每当我在做项目或者刷题时,总会遇到一些让我头疼的问题,就是关于数组和字符串的处理方法,它们看似相似,实则大有乾坤。今天,我决定整理一篇笔记,专门用来总结那些常让人记错的数组和字符串的操作,希望能帮到跟我一样时常对此感到烦恼的友友们。
一、定义与初始化
先看看自己能不能回答的出来下面的问题,虽然乍一看很简单,但是要好好回答却总会脑子短路。
提问:
- 我们可以直接通过单引号或双引号初始化什么?
- 数组的元素是如何分隔的?字符串里的空格算不算独立的元素?
解答:
只有字符串才能通过 'hello'
或 "world"
这样的方式直接初始化。而数组呢,必须用 [1, 2, 'three']
这样的形式,每个元素之间要用逗号 ,
分开。至于字符串里的空格嘛,它只是字符串的一部分,不是一个单独的元素。
示例:
ini
// 初始化字符串
let str = "Hello";
// 初始化数组
let arr = [1, 2, 3];
二、长度属性
提问:
- 数组和字符串的长度怎么获取?是不是都叫
.length
呢?
解答:
没错,两者获取长度的方法都叫做 .length
,但是,千万记得这是它们各自的属性,并不是通用的!
示例:
ini
let str = "Hello";
let arr = [1, 2, 3];
console.log(str.length); // 5
console.log(arr.length); // 3
三、索引访问
提问:
- 怎么访问数组或字符串的第一个和最后一个元素?
- 访问字符串和数组的方式是不是一样的?
解答:
第一个元素访问很简单,不管是数组还是字符串,都是 arr[0]
或者 str[0]
。最后一个元素嘛,数组是 arr[arr.length - 1]
,字符串是 str[str.length - 1]
。访问方式是一样的,都是用方括号加下标,不过,字符串返回的是单个字符,数组可是任何类型的数据!
示例:
ini
let str = "Hello";
let arr = [1, 2, 3];
console.log(str[0]); // "H"
console.log(arr[0]); // 1
console.log(str[str.length - 1]); // "o"
console.log(arr[arr.length - 1]); // 3
四、遍历与迭代
提问:
- 遍历数组和字符串有什么常用的方法?它们完全一样吗?
- 怎样区分
for...of
和for...in
?
解答:
数组可以用 for
循环、for...of
、forEach()
遍历,字符串也差不多,但因为它是不可变的字符序列,所以 for...of
更常用。至于 for...in
,它更适合用于对象,包括数组获取键值,但在字符串上用的话,会遍历每个字符的索引。
示例:
ini
let str = "Hello";
let arr = [1, 2, 3];
for (let char of str) {
console.log(char);
}
for (let elem of arr) {
console.log(elem);
}
五、拼接与连接
提问:
- 数组和字符串拼接方法有何不同?谁有
join()
方法? - 字符串可以用
+
拼接,那数组呢?
解答:
字符串拼接用 +
就行了,如 str1 + str2
。数组则用 join()
方法把元素连起来,比如 arr.join(',')
。数组不能直接用 +
拼接,但两个数组相加会被转成字符串再拼接,这不是数组的拼接,而是字符串拼接行为。
示例:
ini
let str1 = "Hello";
let str2 = "World";
let arr = ['Hello', 'World'];
console.log(str1 + " " + str2); // "Hello World"
console.log(arr.join("-")); // "Hello-World"
六、切割方法
这部分对于我个人来说最容易混淆,不知道大家怎么样。总之先解答提问前,我先把所涵盖的方法都基本地介绍一下。
提问:
- 数组的
splice
和slice
方法有什么区别? - 字符串的
split
和slice
方法又分别是什么?
基础知识:
-
一、数组地
splice
方法-
start - 要添加/删除项目的起始位置。
-
deleteCount (可选) - 从 start 开始要删除的项数。如果设为 0 或省略,则不会删除任何元素。
-
item1, ..., itemX (可选) - 要添加到数组中的新元素。如果没有提供,则只会删除元素。
splice
返回一个包含被删除元素的新数组。如果未删除任何元素,则返回空数组。 -
-
二、数组的
slice
方法-
start (可选) - 开始切片的位置。如果省略,那么切片开始于数组的第一个元素。
-
end (可选) - 切片结束的位置(不包括此位置)。如果省略,那么切片会一直持续到数组的最后一个元素。
slice
返回一个新的数组,包含了从开始到结束的所有元素的浅拷贝。原始数组不会被修改。 -
-
三、字符串的
split
方法-
separator - 一个字符串或正则表达式,作为确定拆分点的模式。
-
limit (可选) - 最大分割次数。如果省略,则所有可能的分割都会执行。
split
返回一个由子字符串组成的数组,这些子字符串是通过将字符串分割成多个部分创建的,分割依据是提供的分隔符或模式。 -
-
四、字符串的
slice
方法-
start - 开始切片的位置。
-
end (可选) - 结束切片的位置(不包括此位置)。
slice
返回一个新的字符串,这个字符串是从原字符串中切片得到的。 -
回忆完了上面地内容,再来看看下面的解答是不是这么回事吧。
解答:
数组的 splice
方法允许你向数组中添加或移除项目,同时返回被移除的项目。它会改变原数组。而 slice
方法则是从已有的数组中返回选定的元素到一个新的数组,原数组不会被修改。
字符串的 split
方法是将字符串分割成字符串数组,而 slice
方法则用于提取字符串的某个部分,并以新的字符串形式返回。
示例:
ini
// 数组的 splice 和 slice 方法
let numbers = [1, 2, 3, 4, 5];
let removedElements = numbers.splice(1, 2); // 移除索引1和2的元素
console.log(numbers); // [1, 4, 5]
console.log(removedElements); // [2, 3]
let slicedNumbers = numbers.slice(0, 2); // 从索引0开始到索引1,不包括2
console.log(slicedNumbers); // [1, 4]
// 字符串的 split 和 slice 方法
let text = "Hello, World!";
let words = text.split(", "); // 根据逗号和空格分割
console.log(words); // ["Hello", "World!"]
let partOfText = text.slice(7, 12); // 提取索引7到11的字符,不包括12
console.log(partOfText); // "World"
七、相互转换
提问:
- 怎么把数组变成字符串?反过来呢?
解答:
数组可以调用 toString()
或 join()
变成字符串。字符串可以通过 Array.from()
或 str.split('')
转换为数组。
示例:
ini
let arr = [1, 2, 3];
let str = arr.toString();
console.log(str); // "1,2,3"
let str2 = "Hello";
let arr2 = Array.from(str2);
console.log(arr2); // ["H", "e", "l", "l", "o"]
八、进阶技巧
提问:
- 怎样动态拼接数组?字符串的模板字面量是什么?
解答:
使用 reduce()
方法可以动态构建字符串,配合 slice()
调整格式。模板字面量 (`````) 可以在字符串中嵌入变量,使用 ${}
插入变量值,让字符串构造更直观。
示例:
ini
let arr = [1, 2, 3];
let str = arr.reduce((acc, curr) => acc + '-' + curr, '').slice(1);
console.log(str); // "1-2-3"
let name = "John";
let greeting = `Hello, ${name}!`;
console.log(greeting); // "Hello, John!"
结语
通过这篇笔记,希望我们都能更清楚地理解数组与字符串的特性,不再在处理它们的时候感到迷茫。记得,多动手练习,才能真正掌握这些知识。一起加油!