字符串操作的“新”技巧

522 阅读3分钟

在 js 中对字符串的操作可谓最频繁,很多常见操作,比如:字符串替换 replace()、查询包含值 includes() 等,想必很多人都已经如数家珍,但是,今天跟大家分享几个技巧,可能是你平时不太常见的,收藏一下将来或许会有用。

1、字符串拆分成数组

说起字符串拆分成数组,你是不是跟我一样,第一个想到的是 split()

let str = 'abcdefg';
let arr = str.split('');
console.log(arr) // => ['a', 'b', 'c', 'd', 'e', 'f', 'g']

这样做当然没问题,也很好用,而且大家好像都习惯这么做,简单又方便!

不过,你有时候,你解决问题的方式可能不止一个,特别是当你想要在脱颖而出的话,如果能多提供几种方案,可能得到的机会会更多。

字符串拆分成数组 的方法也不止这一种,下面介绍另一种,让你看起来就与别人不一样,不妨试一试:

let str = 'abcdefg';
let arr = [...str];
console.log(arr) // => ['a', 'b', 'c', 'd', 'e', 'f', 'g']

你品,你细品......

2、如何在多个分隔符上拆分字符串

刚才说到 split() ,可以将字符串拆分成数据,用起来也很方便,特别是它还可以指定分隔符来拆分。

let str = 'cat,dog,duck';
let animal = str.split(',');
console.log(animal); // => ['cat', 'dog', 'duck']

很快就把这些动物拆分出来了。

但是,如果你遇到这种情况,该怎么办呢?

let str = 'cat,dog;duck';

分隔符都不一样,那该怎么处理呢?

你可能会想到,先把 统一替换成 , ,然后再拆分。这样也不失为一个办法,但显然比较麻烦,有没有更简单的方法呢?

答案是:有。

而且就藏在 split()  里,不卖关子,直接上代码:

let str = 'cat,dog;duck';
let animal = str.split(/[,;]/);
console.log(animal); // => ['cat', 'dog', 'duck']

没错,split()  可以接收一个正则表达式来拆分多个定界符!

是不是很方便?

3、自动补全

自动补全,也是一个非常常见的操作,比如:对时间的操作中,为了格式好看,经常需要把9以下的数据变成 01、02 ... 09 ,你当然可以用 ‘0’ + x 的方式将其补全。

但是,js 有更方便的方法,可以更方便做到这一点:

let time = '9';
let time2 = time.padStart(2, '0'); // => 09

let id = '1'.padStart(10, '0'); // 0000000001

let phone = '131'.padEnd(11, '*'); // 131********

padStart() 用于头部补全,padEnd() 用于尾部补全

4、检查字符串是否以特定字符“开始”或“结束”

习惯可能会让你第一时间想到 indexOf() ,但是如果养成看文档的学习习惯,你应该知道有更优雅的方法:startsWith()

const text = "Hello, world";

console.log(text.startsWith("Hello")); // true

console.log(text.endsWith("world")); // true

减少很多代码,而且一目了然!

5、替换

replace() 几乎是字符处理中最常见的操作,本来没什么好讲的,只是很久以前踩过坑,在坑里爬出来不容易,所以纪念一下!

const str = "I like dog."
console.log(str.replace('dog', "cat")); // I like cat;

这没什么问题,问题是,有一天变成了这样:

const str = "I like dog. You like dog, too"
console.log(str.replace('dog', "cat")); // I like cat. You like dog, too;

后面那只狗居然没有变成猫......对,因为 replace() 它比较专一,看到第一个匹配的字符就认定了,后面有多少都不管了!

想要替换更多,就必须祭出令人头疼的正则表达式来了

const str = "I like dog. You like dog, too"
console.log(str.replace(/dog/g, "cat")); // I like cat. You like cat, too;

幸运的是,官方可能也感受到了程序员对正则表达式的痛了,所以自觉地提供了一个更为人性化的方法 replaceAll() ,于是

const str = "I like dog. You like dog, too"
console.log(str.replaceAll('dog', "cat")); // I like cat. You like cat, too;

字符串操作是所有程序员都绕不过去的基本门槛,虽很常见,却有玄机,还有哪些不为人知的“新”技巧,欢迎有朋友们一起探索!