如何在JavaScript中为字符串指定位置添加斜杠？示例：20180101转2018/01/01

嘿，作为JavaScript初学者，这个日期格式化的需求其实超常见的，我给你分享几种简单易懂的实现方法，一步步来理解哈～

方法一：字符串切片拼接（最直观） #

这种方法适合刚入门的同学，思路就是把原字符串按位置拆成年份、月份、日期三部分，再用斜杠拼起来。

JS里的字符串可以用slice()方法截取指定范围的字符，语法是字符串.slice(开始索引, 结束索引)，注意结束索引对应的字符不会被包含进去，如果只传一个参数，就从该索引一直截取到字符串末尾。

代码示例：

// 原始日期字符串
const rawDate = "20180101";
// 拆分并拼接
const formattedDate = rawDate.slice(0, 4) + "/" + rawDate.slice(4, 6) + "/" + rawDate.slice(6);
console.log(formattedDate); // 输出："2018/01/01"

解释：

• rawDate.slice(0,4)：从索引0开始，取到索引3（共4位），也就是年份"2018"
• rawDate.slice(4,6)：从索引4开始，取到索引5（共2位），也就是月份"01"
• rawDate.slice(6)：从索引6开始取到末尾，也就是日期"01"

方法二：正则表达式替换（简洁高效） #

如果你想试试更简洁的写法，正则表达式是个好选择。我们可以用正则匹配固定长度的数字组，再替换成带斜杠的格式。

代码示例：

const rawDate = "20180101";
// 正则匹配并替换
const formattedDate = rawDate.replace(/^(\d{4})(\d{2})(\d{2})$/, "$1/$2/$3");
console.log(formattedDate); // 输出："2018/01/01"

解释：

• 正则/^(\d{4})(\d{2})(\d{2})$/：
  • ^表示字符串的开头，$表示结尾，确保整个字符串都是8位数字
  • (\d{4})：捕获4个数字（年份），作为第一个分组$1
  • (\d{2})：捕获接下来的2个数字（月份），作为第二个分组$2
  • (\d{2})：捕获最后2个数字（日期），作为第三个分组$3
• 替换时用$1/$2/$3把三个分组用斜杠连接起来

方法三：ES6模板字符串+切片（现代写法） #

ES6的模板字符串可以让拼接更清爽，不用反复写+号，用反引号`包裹内容，变量用${}插入。

代码示例：

const rawDate = "20180101";
const formattedDate = `${rawDate.slice(0,4)}/${rawDate.slice(4,6)}/${rawDate.slice(6)}`;
console.log(formattedDate); // 输出："2018/01/01"

这个方法和第一种原理完全一样，只是写法更现代，可读性更高，现在很多项目里都会用这种方式～

小提醒 #

以上方法都假设你的输入是固定8位的数字字符串，如果输入可能有其他格式（比如长度不对、包含非数字字符），可以先加一步验证，比如检查rawDate.length === 8或者用正则/^\d{8}$/判断是否是8位数字。

内容的提问来源于stack exchange，提问作者Satria stuart