基础JavaScript练习（三）总结

任务目的

• 实践JavaScript数组、字符串相关操作

任务描述

• 基于任务四进行升级
• 将新元素输入框从input改为textarea
• 允许一次批量输入多个内容，格式可以为数字、中文、英文等，可以通过用回车，逗号（全角半角均可），顿号，空格（全角半角、Tab等均可）等符号作为不同内容的间隔
• 增加一个查询文本输入框，和一个查询按钮，当点击查询时，将查询词在各个元素内容中做模糊匹配，将匹配到的内容进行特殊标识，如文字颜色等。举例，内容中有abcd，查询词为ab或bc，则该内容需要标识

任务注意事项

• 实现简单功能的同时，请仔细学习JavaScript基本语法、事件、DOM相关的知识
• 请注意代码风格的整齐、优雅
• 代码中含有必要的注释
• 建议不使用任何第三方库、框架

在线学习参考资料

• JavaScript入门篇
• MDN JavaScript
• 归并排序算法可视化
• 15种排序算法可视化展示

基础JavaScript练习（三）总结

1、 正则表达式

正则表达式是一个对象，一个字母序列，组成一个搜索模式表示想搜索或替换的内容，这个搜索模式可用于搜索或替换，它可以为一个字母或更复杂的模式，可以表达文本搜索或文本替换的类型。

语法：

/pattern/modifiers;

使用字符串方法

在JavaScript中，正则表达式通常使用两个字符串的方法：search()和replace()。

search()方法用于匹配搜索，返回匹配字符串的位置。

replace()方法，返回被替换后的字符串。

正则表达式修饰符

修饰符用于执行不区分大小写的全局搜索。

i：不区分大小写

g：全局搜索（寻找所有匹配字符串，而不是找到第一个匹配后停止）

m：多行匹配

正则表达式模式

括号用于寻找一个字符序列。

[abc]:寻找括号中的任何一个字符。

[0-9]:寻找括号中的任何一个数字。

（x|y）:寻找由“|”分开的任何一部分。

元字符是有特殊意义的字符

\d:寻找数字。

\s:寻找空格。

\b:匹配内容在单词开头或单词末尾。

\uxxxx:寻找由十六进制数字xxxx表示的Unicode字符。

除此意外还有：.、\w、\W、\D、\S、\B、\0、\n、\f、\r、\t、\v、\xxx、\xdd

量词定义数量

n+:匹配至少有一个n的字符串。

n*：匹配n出现零次或多次的字符串。

n？：匹配n出现零次或多次的字符串。

除此意外还有：n{x}、n{x,y}、n{x,}、n$、^n、?=n、?!n。

test()方法

test()方法是一个正则表达式方法，它在字符串中寻找一种模式，根据结果返回true或者false。

eg：var patt = /e/;
patt.test("The best
things in life are free!");

2、 String search() Method

search()方法寻找一个字符串或一个特定的值，返回匹配字符串的起点位置。搜索的值可以为一个字符串也可以为一个正则表达式。如果没有匹配成功，返回-1。

语法：

string.search(searchvalue)

3、 JavaScript eval() Function

eval()函数执行或评估一个argument。当argument是一个表达式，eval()评估这个表达式，如果argument是一个或多个javascript语句，eval()执行这些语句。

语法：

eval(string)

string：一个JavaScript表达式，变量，语句或者语句序列。

4、 正则表达式中使用变量

（1）将变量表示为正则表达式形式的字符串

eg：var a = document.getElementById(“input_value”).value;

var b
= “/” + a + “/g”

（2）将字符串转为正则表达式。

var reg = eval(b);  //reg即为正则表达式

5、已提交作业

代码地址：https://github.com/Nunawading2016/2017-IFE-Baidu/blob/master/task2-6

Demo地址：http://htmlpreview.github.io/?https://github.com/Nunawading2016/2017-IFE-Baidu/blob/master/task2-6/index.html