JavaScript_day14

day14内容

学习目标
正则表达式

正则表达式
是一个描述字符模式的对象.
1. 正则表达式对象的创建
构造函数
var pattern =new RegExp(“正则表达式”,“修饰符”)
var pattern =new RegExp(“abc”,“ig”);
正则表达式字面量
var pattern = /正则表达式/修饰符;
var pattern = /abc/ig;
2. 修饰符
i ignore case 不区分大小写
g global 全局
m multiline 多行
3. JS正则表达式对象
var pattern = new RegExp(“abc”);
pattern.exec(); 查找
pattern.test(); 测试
pattern.toString(); 转换为字符串
pattern.source; 正则表达式文本
pattern.global 布尔值,表明这个正则表达式是否带有修饰符g
pattern.ignoreCase 布尔值,表明这个正则表达式是否带有修饰符i
pattern.multiline 布尔值,表明这个正则表达式是否带有修饰符m
pattern.lastIndex 如果匹配模式带有g,这个属性存储在整个字符串中下一次检索的开始位置,这个属性会被exec(), test()方法调用到
4. 使用
var result = pattern.exec()
执行正则从参数获取目的字符串
参数:
字符串
返回值result:
数组:查询到的结果
index:查询到结果的索引
input:操作的字符串
1)如果正则表达式中有修饰符"g",这时,在pattern中会维护lastIndex属性,记录下一次开始的位置,当第二次执行exec的时候,从lastIndex开始检索。
2)如果正则表达式中没有修饰符"g",不会维护lastIndex属性,每次执行从开始位置检索
test();
参数:字符串
返回值:布尔类型
1)如果正则表达式中有修饰符"g",这时,在pattern中会维护lastIndex属性,记录下一次开始的位置,当第二次执行exec的时候,从lastIndex开始检索。
)如果正则表达式中没有修饰符"g",不会维护lastIndex属性,每次执行从开始位置检索
5. 正则表达式语法
1) 直接量
正则表达式中所有字母和数字都是按照字面含义进行匹配的。
字符 匹配
-----------------------
字母和数字 自身
\t 制表符
\n 换行符
\v 垂直制表符
\f 换页符
\r 回车符
\xnn 由十六进制数nn指定的拉丁字符 \x0A => \n
\uxxxx 由十六进制xxxx指定的Unicode字符,例如 \u0009 => \t
\cX 控制字符 ^X,例如 \cJ 等价于换页符 \n
2) 字符类
[直接量]
. 除换行符和其他Unicode行终止符之外的任意字符
/[good]/ g或0或d
/[a-zA-Z0-9]/
/[^a-zA-Z0-9]/
/\w/ => /[a-zA-Z0-9]/
/\W/ => /[^a-zA-Z0-9]/
/\d/ => /[0-9]/
/\D/ => /[^0-9]/
/\s/ => [\n\t空格]
/\S/ => [^\n\t空格]
3)重复
(子)表达式{重复},一定要用在子表达式之后
/\w{3}/ 3个连续的字符
{1,4} [1,4]
{1,} [1,多]
{1} 1次
+ {1,}
? {0,1}
* {0,}
4)重复方式
贪婪
匹配重复字符时是尽可能多地匹配,默认{1,4}
非贪婪
匹配重复字符时是尽可能少地匹配,在待匹配的字符后跟随一个问号即可
{1,4}?
例如:
/a+/ 可以匹配一个或者多个连续的字母a, 当使用"aaa"作为匹配字符串时正则表达式会匹配它的三个字符
/a+?/ 可以匹配一个或者多个连续的字母a, 但是尽可能少地匹配。只能匹配第一个a
例如:
/[abc]/ 匹配"a" “b” “c"中任意一个字符
/[^abc]/ 匹配"a” “b” “c"之外的任意一个字符
/\d{2,4}/ 匹配2~4个数字
/\w{3}\d?/ 匹配三个字符或和一个可选的数字
/\s+java\s+/ 匹配前后带有一个或多个空格的字符串"java”
5) 选择
使用字符 “|” 分割供选择的字符。选择项的尝试匹配次序是从左到右,直到发现了匹配项,如果左边的选择项匹配,就忽略右边的匹配项,即使它产生更好的匹配。/ab|cd|ef/ 可以匹配 “ab"或者"cd"或者"ef”
6) 分组
“()“作用:
1. 把单独的项组合成子表达式
以便可以像处理一个单元那样用”|”"""+""?“对单元内的项进行处理
/java(script)?/ 可以匹配字符串java,后面的script可以有也可以没有
/(ab|cd)+|ef/ 可以匹配"ef”,也可以匹配"ab""cd"一次或者多次
2. 在完整的模式中定义子模式
当一个正则表达式成功地和目标字符串相匹配时,可以从目标串中抽出和圆括号中的子模式相匹配的部分。
/[a-z]+\d+/ 一个或者多个小写字母后跟随一个或者多个数字
(/[a-z]+(\d+)/) 可以抽出每个匹配末尾的数字
3. 在同一正则表达式后面引用前面的子表达式。
\1 引用第一个带圆括号的子表达式
/([Jj]ava([Ss]cript)?)\sis\s(fun\w
)/ \2 引用 ([Ss]cript)
对正则表达式中前一个子表达式的引用,并不是指对子表达式模式的引用,而是对与那个模式相匹配的文本的引用
例如:
/[’"][^’"][’"]/ 匹配单引号或者双引号内的0个或者多个字符,但是它并不要求左侧和右侧的引号匹配
/([’"])[^’"]
\1/ 匹配单引号或者双引号内的0个或者多个字符,但是它要求左侧和右侧的引号匹配
7) 指定匹配位置
^ 匹配字符串的开头,在多行检索中,匹配一行的开头
$ 匹配字符串的结尾,在多行检索中,匹配一行的结尾
\b 匹配一个单词的边界,即位于字符\w和\W之间的位置,或者位于字符\w和字符串的开头或结尾之间的位置。
\B 匹配非单词边界的位置
(?=p) 零宽正向先行断言,要求接下来的字符都与p匹配,但不能包括匹配p的那些字符
(?!p) 零宽负向先行断言,要求接下来的字符不与p匹配

note

网页制作 静态的html页面
不要看模仿的网页的html源码,可以参考网页元素的width,height,color。用最少的代码写最多的事情。

复习
ECMAScript

对象
函数
数组
注意数组的方法,只能数组调用,类数组不能调用
pop() 末尾移除一个元素并返回
push() 将实参添加到数组末尾
shift() 头部移除一个元素并返回
unshift() 头部插入元素
reverse() 数组反转
sort() 排序方法,可以传一个比较器函数作为参数
concat() 连接数组
slice() 截取数组,从开始位置截取到末尾,从开始位置截取到结束位置但是不包含结束位置的元素
splice() 删除、插入、替换数组中的内容。返回删除的元素组成的数组
两个参数 开始位置,删除项数。从开始位置删除,删除几项
大于两个参数 开始位置,删除项数,要插入的元素。如果删除项数为0,那么就是将要插入的元素插入到开始位置。如果删除项目不为0,先删除几项,然后再在开始位置插入元素
indexOf() 从前往后查找参数在数组中的位置,返回索引或者-1
lastIndexOf() 从后往前查找参数在数组中的位置,返回索引或者-1
迭代方法 第一个实参函数,第二个是实参函数内的this指向,执行环境对象。在实参函数中有三个形参,分别代表元素、索引、数组
every(function,this) 判断数组中的每个元素是否都满足条件,如果都满足,返回true,否则返回false
var result = arr.every(function(item,index,arr){
return item>18;
},{name:’’})
some(function,this) 判断数组中是否有元素满足该条件,如果有返回true,否则返回false
var result = arr.some(function(item,index,arr){
return item>18;
},{})
filter(function,this) 过滤出满足条件的数组,返回满足条件的元素组成的数组
var result = arr.filter(function(item,index,arr){
return item>18;
},{})
map(function,this) 映射出数组的每个元素中的部分内容,返回映射的内容组成的数组
var result = arr.map(function(item,index,arr){
//return item*2;
return item.name;
},{})
forEach(function,this) 遍历数组,不关注返回值
arr.forEach(function(itme,index,arr){
//item–>元素
//index–>索引
//arr–>遍历的数组
},{})
将类数组的对象转换成数组
类数组不能调用数组的方法。
arguments.slice(0); //不可直接调用
var temp = Array.prototype.slice.call(arguments,0);
temp 就是数组,数组中放了类数组中的元素
temp.forEach(…)
正则表达式
html
模式匹配
正则表达式对象
< select multiple name="" id=""></ select>
< form action="" enctype=“multipart/form-data”>< /form>

发布了40 篇原创文章 · 获赞 1 · 访问量 707

猜你喜欢

转载自blog.csdn.net/hanmiao12345/article/details/105517753
今日推荐