重学JS-3-一图掌握JS字符串

491 阅读2分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第20天,点击查看活动详情

前端开发的第三年,突然发现,对于JS,我还有很多不懂的地方,趁着最近需求少,不如静下心来,从头把JS再学一遍,查漏补缺。

本系列以廖雪峰的《JavaScript教程》和《现代 JavaScript 教程》两个电子书作为线索,对其中需要进一步了解的知识,会阅读更多的文章,并作为扩展知识记录下来。

新手建议先阅读上面两个电子书,本系列更适合用来复习旧知识查漏补缺

通过下面的思维导图,我们先对JavaScript的字符串有一些基本的了解。

《JavaScript教程-字符串》思维导图

常用方法

见思维导图。

参考文章

JavaScript 28个常用字符串方法及使用技巧

JS字符串是不可变的

iOS开发者可能会有熟悉的感觉,和NSString一样,JS的字符串也是不可变的。

具体参考下面这个例子。

let str = 'Hi';

str[0] = 'h'; // error
alert( str[0] ); // 无法运行

重新赋值、trimreplace等操作,其实都是返回了一个新的字符串

正则表达式

正则表达式也是处理字符串时,会经常用到的知识,这块内容比较多,这里只记录一些最重要的知识,更深入的了解,推荐阅读下面这几篇文章。

基础

需要重点记住下面这张表。

single charquantifiers(数量)position(位置)
\d 匹配数字* 0个或者更多^一行的开头
\w 匹配word(数字、字母)+ 1个或更多,至少1个$一行的结尾
\W 匹配非word(数字、字母)? 0个或1个,一个Optional\b 单词"结界"(word bounds)
\s 匹配white space(包括空格、tab等){min,max}出现次数在一个范围内
\S 匹配非white space(包括空格、tab等){n}匹配出现n次的
. 匹配任何,任何的字符

[]表示或,可以是一些字符([abc])或者一个范围的字符([a-z]),也可以用于排除[^ab]

()用于分组,编号0是匹配项,从1开始是匹配的分组。

在JS中的应用

reg.test(str):返回布尔值。

reg.exec(str):迭代器,每次执行,返回匹配结果和分组,直到返回为null结束。

str.match(reg):如果正则包含了分组,且没有g标志,则返回匹配内容和分组; 如果没有分组,且有g标志,返回所有匹配内容。

str.split(reg):方法主要用于字符串分割,如果想要保存分隔符,记得将匹配内容分组(用小括号包起来)。

str.replace(reg,str|function):返回值就是替换后的字符串,str参数可以插入一些特殊的变量,比如$1表示分组1,参考下面的例子。

var s = "Hello,My name is Vincent."
var result = s.replace(/([aeiou])/g,"$1$1")
//"Heelloo,My naamee iis Viinceent."

参考资料

正则表达式不要背

JS正则表达式完整教程

可能是最好的正则表达式的教程笔记了吧...【重点看!!】