面试官 : “ 请说一下 JS 的常见的数组 和 字符串方法有哪些 ? ”

盘点 JS 数组和字符串的核心方法，我会按「常用场景 + 功能分类」整理，每个方法标注作用 + 示例 + 关键说明，既好记又能直接用，适合复习和开发时快速查阅。

一、数组（Array）方法

数组方法是 JS 高频考点，按「增删改查、遍历、转换、排序 / 过滤 / 聚合」分类，重点标⭐️

1. 增删改查（修改原数组）

方法	作用	示例	关键说明
⭐️ push()	末尾添加元素	[1,2].push(3) → [1,2,3]	返回新长度，修改原数组
⭐️ pop()	末尾删除元素	[1,2,3].pop() → 3	返回删除的元素，修改原数组
⭐️ unshift()	头部添加元素	[2,3].unshift(1) → [1,2,3]	返回新长度，修改原数组
⭐️ shift()	头部删除元素	[1,2,3].shift() → 1	返回删除的元素，修改原数组
⭐️ splice(start, delNum, ...add)	任意位置增删改	[1,2,3].splice(1,1,4) → [1,4,3]	返回删除的元素，修改原数组
fill(val, start, end)	填充数组	[1,2,3].fill(0, 1, 2) → [1,0,3]	修改原数组

2. 遍历（不修改原数组）

方法	作用	示例	关键说明
⭐️ forEach()	遍历数组，无返回值	[1,2].forEach(item => console.log(item))	无法中断（break 无效）
⭐️ map()	遍历 + 返回新数组	[1,2].map(item => item*2) → [2,4]	不修改原数组，必用 return
⭐️ filter()	过滤符合条件的元素	[1,2,3].filter(item => item>1) → [2,3]	返回新数组，保留满足条件的元素
⭐️ find()	找第一个符合条件的元素	[1,2,3].find(item => item>1) → 2	找到即返回，无则 undefined
⭐️ findIndex()	找第一个符合条件的索引	[1,2,3].findIndex(item => item>1) → 1	无则返回 -1
every()	所有元素满足条件？	[1,2,3].every(item => item>0) → true	全满足返回 true
some()	至少一个元素满足条件？	[1,2,3].some(item => item>2) → true	有一个满足就返回 true
reduce()	聚合（求和 / 拼接等）	[1,2,3].reduce((sum, item) => sum+item, 0) → 6	第二个参数是初始值，核心是 "累积"

3. 转换 / 拼接（不修改原数组）

方法	作用	示例	关键说明
⭐️ join(sep)	数组转字符串	[1,2].join('-') → "1-2"	sep 是分隔符，默认逗号
⭐️ concat()	拼接数组	[1,2].concat([3,4]) → [1,2,3,4]	返回新数组，不修改原数组
⭐️ slice(start, end)	截取数组（左闭右开）	[1,2,3].slice(0,2) → [1,2]	不修改原数组，end 可选（默认到末尾）
flat(depth)	扁平化数组	[1,[2,[3]]].flat(2) → [1,2,3]	depth 是层级，默认 1，Infinity 拍平所有
flatMap()	map + flat(1)	[1,2].flatMap(item => [item, item*2]) → [1,2,2,4]	比先 map 再 flat 高效

4. 排序 / 查找（部分修改原数组）

方法	作用	示例	关键说明
⭐️ sort(compare)	排序	[3,1,2].sort((a,b) => a-b) → [1,2,3]	修改原数组，默认按字符串排序（需传比较函数）
⭐️ reverse()	反转数组	[1,2,3].reverse() → [3,2,1]	修改原数组
⭐️ includes(val)	判断是否包含元素	[1,2].includes(2) → true	区分类型（1 !== '1'）
indexOf(val)	找元素首次出现的索引	[1,2,1].indexOf(1) → 0	无则返回 -1
lastIndexOf(val)	找元素最后出现的索引	[1,2,1].lastIndexOf(1) → 2	无则返回 -1

二、字符串（String）方法

字符串方法均不修改原字符串（字符串是不可变类型），按「查找 / 截取、替换 / 分割、转换、判断」分类。

1. 查找 / 截取

方法	作用	示例	关键说明
⭐️ charAt(index)	获取指定位置字符	"abc".charAt(1) → "b"	索引越界返回空字符串
⭐️ indexOf(str)	找子串首次出现的索引	"abcab".indexOf("ab") → 0	无则返回 -1
⭐️ lastIndexOf(str)	找子串最后出现的索引	"abcab".lastIndexOf("ab") → 3	无则返回 -1
⭐️ slice(start, end)	截取字符串（左闭右开）	"abcde".slice(1,3) → "bc"	start 负数表示从末尾数
substring(start, end)	截取字符串	"abcde".substring(1,3) → "bc"	类似 slice，但 start>end 会自动交换
substr(start, length)	按长度截取	"abcde".substr(1,2) → "bc"	已废弃，优先用 slice
⭐️ includes(str)	判断是否包含子串	"abc".includes("b") → true	区分大小写
startsWith(str)	判断是否以子串开头	"abc".startsWith("ab") → true	可传第二个参数（起始位置）
endsWith(str)	判断是否以子串结尾	"abc".endsWith("bc") → true	可传第二个参数（截取长度）

2. 替换 / 分割

方法	作用	示例	关键说明
⭐️ replace(str/regex, newStr)	替换子串	"abc".replace("b", "x") → "axc"	只替换第一个，全局替换用 /g 正则
⭐️ split(sep)	字符串转数组	"a-b-c".split("-") → ["a","b","c"]	sep 为空字符串则拆成单个字符
replaceAll(str/regex, newStr)	全局替换	"abab".replaceAll("a", "x") → "xbxb"	ES2021 新增，无需 /g 正则

3. 转换 / 格式化

方法	作用	示例	关键说明
⭐️ toLowerCase()	转小写	"ABC".toLowerCase() → "abc"	不修改原字符串
⭐️ toUpperCase()	转大写	"abc".toUpperCase() → "ABC"	不修改原字符串
⭐️ trim()	去除首尾空格	" abc ".trim() → "abc"	不处理中间空格
trimStart()/trimLeft()	去除开头空格	" abc".trimStart() → "abc"	别名，作用一致
trimEnd()/trimRight()	去除结尾空格	"abc ".trimEnd() → "abc"	别名，作用一致
repeat(n)	重复字符串	"ab".repeat(2) → "abab"	n 为 0 返空，负数报错
padStart(len, str)	头部补全	"123".padStart(5, "0") → "00123"	常用于补零
padEnd(len, str)	尾部补全	"123".padEnd(5, "0") → "12300"	超出长度则截断

三、数组 & 字符串互通方法

场景	实现方式	示例
数组 → 字符串	arr.join(sep)	[1,2].join("") → "12"
字符串 → 数组	str.split(sep)	"abc".split("") → ["a","b","c"]
遍历字符串	转数组后用数组遍历方法	"abc".split("").forEach(char => console.log(char))

总结

1. 数组核心：修改原数组的方法（push/pop/splice/sort）要注意副作用，遍历优先用 map/filter/reduce（返回新数组），列表查找用 find/findIndex 更高效；
2. 字符串核心：所有方法不修改原字符串，截取用 slice、替换用 replace/replaceAll、分割用 split，判断包含用 includes；
3. 高频互通：数组转字符串用 join，字符串转数组用 split，是开发中最常用的联动操作。