js中字符串的修改(string的坑)

tx一面做了一道字符串的题，狠狠地掉进了一个大坑，这里做一个笔记总结一下

一. js中字符串的特点

字符串在 JavaScript 中被视为不可变（immutable）的数据类型，意味着无法直接修改字符串的特定字符。

二. js中字符串修改的方法

//以下列字符串举例
var str = "This is string."

(一）. 使用内置方法，不使用数组

1. 替换指定内容

1). 使用replace()方法，replace()方法不会改变原始字符串,替换第一个被找到的字符串

replace()+字符串替换指定内容

console.log(str.replace('Th','tH')) // => tHis is string.

replace()+正则替换指定内容

console.log(str.replace(/Th/,'tH')) // => tHis is string.

replace()+正则删除指定内容

console.log(str.replace(/i/g,'')) // => Ths s strng.

2). 使用replaceAll()方法，replaceAll()方法不会改变原始字符串，替换全部被找到的字符串

//删除字符串中的i，其他使用方法同replace()
console.log(str.replaceAll('i','')) // => Ths s strng.

2. 替换指定位置

通过substring() 或 slice() 方法+字符串拼接

/**
 * @param {string} str - 原始数组
 * @param {number} index - 替换的位置 
 * @param {number} length - 替换的内容的长度 
 * @param {string} char - 要替换的内容
 * @return {string}
 */
const replaceStr = (str, index,length, char) => {
    return str.substring(0, index) + char + str.substring(index + length);
}
const replaceStr2 = (str, index,length, char) => {
    return str.slice(0, index) + char + str.slice(index + length);
}

console.log(replaceStr(str,1,5,'AAAAA')) // => TAAAAAs string.
console.log(replaceStr2(str,3,5,'BBBBB')) // => ThiBBBBBstring.

（二）. 转化为字符数组

1.使用`split()`方法把一个字符串分割成字符串数组，对字符串数组进行操作后，再使用数组的`join()`方法把字符串数组转为字符串

使用字符串（string类型）中的.split()方法将字符串转化为字符串数组(Array类型)
注意split()方法不改变原始字符串，需要赋值到一个新变量上

arr = str.split('')
console.log(arr)  // =>['T', 'h', 'i', 's', ' ', 'i', 's', ' ', 's', 't', 'r', 'i', 'n', 'g', '.']

对字符数组进行操作

//eg
arr[arr.length-1] = '!'

使用数组(Array类型)中的.join()方法将字符串数组转化为字符串（string类型）
注意join()方法不改变原始字符串，需要赋值到一个新变量上

new_str = arr.join('')
console.log(new_str)  // => This is string!

2.创建一个字符串数组保存字符串，通过遍历字符串给字符串数组赋值，使用字符串拼接将字符数组转为字符串（也可以用`join()方法`，只是与上面提到过，不详细叙述）

1). 使用Array构造函数构造数组

const arr = new Array(str.length).fill('')//创建字符数组,fill()方法是初始化为string类型，不然数组的元素类型为undifined
arr.forEach((value,i)=>{
    arr[i] = str[i]
})
console.log(arr) // =>['T', 'h', 'i', 's', ' ', 'i', 's', ' ', 's', 't', 'r', 'i', 'n', 'g', '.']

2). 使用数组字面量构造数组

const arr = [] 
for(let i = 0 ; i < str.length ; i++){
    arr[i] = str[i]
}
console.log(arr) // =>['T', 'h', 'i', 's', ' ', 'i', 's', ' ', 's', 't', 'r', 'i', 'n', 'g', '.']
//这里就无法使用forEach循环赋值了，因为数组一开始为空的，元素个数为0，这里用了两种循环也是一种区别

使用字符串拼接将数组还原为字符串

var answer = ""
for(const value of arr){
    answer  += value
}
console.log(answer) // =>This is string.

题目

最后，做做题来检验检验吧
6. N 字形变换 - 力扣（LeetCode）
151. 反转字符串中的单词 - 力扣（LeetCode）
831. 隐藏个人信息 - 力扣（LeetCode）

参考资料

JavaScript String 对象 | 菜鸟教程 (runoob.com)
String.prototype.split() - JavaScript | MDN (mozilla.org)
javascript - js替换字符串中指定位置的字符 - 秦老爷子 - SegmentFault 思否
 JavaScript删除字符串中指定字符的四种方法_字符串删除指定字符-CSDN博客

js中字符串的修改（string的坑）