码迷,mamicode.com
首页 > Web开发 > 详细

JS高级学习历程-13

时间:2015-06-01 13:14:41      阅读:193      评论:0      收藏:0      [点我收藏+]

标签:

【正则表达式】

\d

\d\d

[a-z]

什么是正则表达式:用于记录文本规则的代码

 

正则表达式的作用:

①       可以匹配文本,表单验证(手机号码、邮箱、qq号码)

②       赛选网页内容(网络爬虫),meijob

③       内容替换

 

正则表达式历史:

 

正则的组成内容:

①       普通字符内容

②       组成字符

③       特殊字符

④       限制字符

 

1 正则表达式---普通字符组成

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>17-正则简单使用</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         //正则表达式简单使用
11 
12         //var reg = /正则表达式内容/;
13         var reg = /wo/;
14 
15         var str = "hello world";
16 
17         //具体匹配
18         //被匹配目标内容.match(正则);
19         var rst = str.match(reg);
20         console.log(rst);
21         
22         </script>
23 
24         <style type="text/css">
25         </style>
26     </head>
27 
28 
29     <body>
30     </body>
31 </html>
17-正则简单使用

技术分享

 

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>18-正则-普通字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         //正则表达式--普通字符串组成
11 
12         //如果没有特殊限制,则会匹配到第一个目标
13         //(不管后边还是否有匹配目标)
14         var reg = /l/;
15         var str = "hello world";
16 
17         var reg = /@#!&/;  
18         var str = "this is a computer,2433@#!&@";//@#!&
19 
20         //具体匹配
21         //被匹配目标内容.match(正则);
22         var rst = str.match(reg);
23         console.log(rst);
24         
25         </script>
26 
27         <style type="text/css">
28         </style>
29     </head>
30 
31 
32     <body>
33     </body>
34 </html>
18-正则-普通字符组成

技术分享

2 定义字符集

技术分享

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>19-正则-定义字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         //正则表达式--定义字符组成
11 
12         var reg = /[0-9]/;   //匹配0-9之间任何一个数字
13         var reg = /[6-9]/;   //匹配6-9之间任何一个数字
14         //以下7-3的表达有错误,应该写成3-7,从小往大写
15         //var reg = /[7-3]/;   //匹配3-7之间任何一个数字
16         var str = "2014-6-19";
17 
18         var reg = /[a-z]/;  //匹配26个字母任何一个["c"]
19         var reg = /[A-Z]/;  //匹配26个大写字母任何一个["M"]
20         var reg = /[d-h]/;  //匹配defgh字母任何一个["e"]
21         var reg = /[tsowq]/;  //匹配tsowq字母任何一个["o"]
22         //以下应该设置为[a-f]
23         //var reg = /[f-a]/;  
24         var reg = /[a-zA-Z]/; //全部大小写字母匹配任何一个["c"]
25         var reg = /[a-zA-Z0-9]/; //全部大小写字母匹配任何一个["2"]
26         var str = "2014coMpUter";
27 
28         //具体匹配
29         //被匹配目标内容.match(正则);
30         var rst = str.match(reg);
31         console.log(rst);
32         
33         </script>
34 
35         <style type="text/css">
36         </style>
37     </head>
38 
39 
40     <body>
41     </body>
42 </html>
19-正则-定义字符组成

技术分享

3 特别字符组成正则

技术分享

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>20-正则-特别字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         //*  : 其前面那个单元出现0次或以上(任意次数)
11         var reg = /go*gle/; //* 表示匹配前边的o的次数可以是0或任意次数
12         var str = "google";
13         var str = "ggle";
14         var str = "gogle";
15         var str = "gooooooooooooooooooooooooooooooooooooooooooooooooooooooogle";
16 
17         //+  : 其前面那个单元出现1次或以上
18         var reg = "201+4";
19         var str = "2014-6-19";
20         var str = "20111111111111111114-6-19";
21         var str = "204-6-19"; //nook
22 
23         //?  : 其前面那个单元出现0次或1次
24         var reg = "he?llo";
25         var str = "hello";
26         var str = "hllo";
27         var str = "heeeello";  //nook
28 
29         var rst = str.match(reg);
30         console.log(rst);
31 
32         </script>
33 
34         <style type="text/css">
35         </style>
36     </head>
37 
38 
39     <body>
40 
41     </body>
42 </html>
20-正则-特别字符组成

技术分享

 

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>21-正则-特别字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10 
11         //^  : 表示字符串的开始位置
12         //$  : 匹配输入字符串的结尾位置。
13         //一般90%以上的正则都需要使用^和$符号,这样他们把我们的全部目标内容都给匹配
14         //而不是只匹配一部分
15 
16         var reg = /^[0-9]+$/;//要求目标内容的开始和结束都是数字内容
17 
18         var str = "tom13243257965";   //nook
19         var str = "13243257965itcast"; //nook
20         var str = "13243257965";    //is ok
21 
22         var reg = /fish$/;
23         var str = "kitty like fish,dog like gutou";
24 
25         var rst = str.match(reg);
26         console.log(rst);
27 
28         </script>
29 
30         <style type="text/css">
31         </style>
32     </head>
33 
34 
35     <body>
36 
37     </body>
38 </html>
21-正则-特别字符组成

技术分享

 

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>22-正则-特别字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10 
11         //.点  : 匹配除换行符 \n之外的任何单字符
12         //    .*  表示匹配任何内容
13         
14         var reg = /.*/;
15         var str = "lksjoii239897T&^%&*(\nOPUYTGHLKYGU^TR%FIGLKJyu";//["lksjoii239897T&^%&*("]
16 
17         var rst = str.match(reg);
18         console.log(rst);
19 
20         </script>
21 
22         <style type="text/css">
23         </style>
24     </head>
25 
26 
27     <body>
28 
29     </body>
30 </html>
22-正则-特别字符组成

技术分享

 

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>23-正则-特别字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10 
11         //|  : 指明两项之间的一个选择
12         var reg = /apple|pear|orange|banana/;
13         var str = "tom like grape,jim like bread,aobama like orange";     
14 
15         //\  : 这个符号是用来转义的
16         //     把特殊符号的特殊意思给删除掉,只保留字母本身的原意
17         var reg = /link\?en like \$/;
18         var str = "link?en like $";
19 
20         var rst = str.match(reg);
21         console.log(rst);
22 
23         </script>
24 
25         <style type="text/css">
26         </style>
27     </head>
28 
29 
30     <body>
31 
32     </body>
33 </html>
23-正则-特别字符组成

技术分享

 

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>24-正则-特别字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         // ( ): 标记一个子表达式的开始和结束位置。
11         //① 提高表达式优先级
12         //   var s = 12+20*6
13         //   var s = (12+20)*6
14 
15         var reg = /(go)+gle/; //表示go单元重复出现1或任意次数
16         var str = "google";  //nook
17         var str = "gogle";
18         var str = "gogogogogogogle";
19 
20         //② 可以在众多内容里边赛选子级内容
21         //   抓取()模式单元内容
22         var reg = /<a href=‘.*‘ target=‘(.*)‘>(.*)<\/a>/;
23         var str = "<a href=‘http://www.weather.com.cn/weather/101010100.shtml‘ target=‘_blank‘>28℃/19℃</a>";
24 
25         var rst = str.match(reg);
26         //console.log(rst[1]);  //_blank
27         //console.log(rst[2]);  //28℃/19℃
28 
29         console.log(rst);
30         </script>
31 
32         <style type="text/css">
33         </style>
34     </head>
35 
36 
37     <body>
38 
39     </body>
40 </html>
24-正则-特别字符组成

技术分享

 

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>25-正则-特别字符组成</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         
11         //() 小括号模式单元
12         //   模式单元数目计算
13         //① 模式单元平级情况 从左边往右边计算
14         //② 如果括号嵌套,先计算外部括号,再计算里边括号
15         //["2014-6-19 16:51:20", "2014-6-19", "2014", "6", "16:51:20"]
16         var reg = /((2014)-(6)-19) (16:51:20)/;
17         var str = "2014-6-19 16:51:20";
18 
19         var reg = /([a-z]+ ([a-z]+)) ([a-z]+,[a-z]+)/;
20         var str = "tom like apple,and very like";
21         //[‘tom like apple,and‘,‘tom like‘,‘like‘,‘apple,and‘]
22         var rst = str.match(reg);
23         console.log(rst);
24         </script>
25 
26         <style type="text/css">
27         </style>
28     </head>
29 
30 
31     <body>
32 
33     </body>
34 </html>
25-正则-特别字符组成

技术分享

4 模式修正符

通过模式修正符可以设置大小写不敏感、全局匹配等等

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 2 <html>
 3     <head>
 4         <title>26-正则-模式修正符</title>
 5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6         <meta name="description" content="" />
 7         <meta name="keywords" content="" />
 8 
 9         <script type="text/javascript">
10         //模式修正符
11         //  var reg = /模式内容/模式修正符;
12 
13         //① i 字母大小写不敏感
14         var reg = /[a-z]+/i;
15         var str = "helloWoRld";
16 
17         //② g 进行全局匹配
18         //  如果设置g进行全局匹配就没有具体()模式单元了
19         var reg = /[0-9]+/g;
20         //["2014", "6", "19", "17", "06", "30"]
21         var str = "2014-6-19 17:06:30";
22 
23         var reg = /[0-9]+(-)/g;//模式单元不给体现
24         //["2014-", "6-", "19-", "20-", "21-"]
25         var str = "2014-6-19-20-21-";
26 
27         //③ m 把目标内容当作多行看待,前提要求目标内容有\n换行符号
28         //   window:  \r\n   换行符号
29         //   unix/linux:  \n 换行符号
30         //   apple :  \r     换行符号
31         var reg = /apple$/m;
32         var reg = /^tom/m;
33         var str = "linken like apple\ntom like orange\njack like pear";
34         var rst = str.match(reg);
35         console.log(rst);
36         
37         </script>
38 
39         <style type="text/css">
40         </style>
41     </head>
42 
43 
44     <body>
45 
46     </body>
47 </html>
26-正则-模式修正符

技术分享

总结:

  1. 冒充继承
  2. 多态,通过this关键字体现多态
  3. 异常,try-catch-finally
  4. 正则表达式

         ①  普通字符组成正则

         ②  定义字符集

[0-9]  [a-r]  [uofds]  [0-9a-zA-Z]

         ③  特别字符集

              ^  $

              *  +  ?

              \  |

              .点  匹配任何单字符

              ()  模式单元(),①提高表达式优先级;② 赛选子级内容返回

             

         ④  模式修正符

              i  忽略大小写

             g  全局匹配

             m

作业:

       1. 写正则匹配手机号码

           要求:全部数字、13或15或18

       2. 写正则匹配数字(1-223之间)

           [1-223]   //1 2  3

       3.  练习各种继承使用(尤其是熟悉复制继承)

 

JS高级学习历程-13

标签:

原文地址:http://www.cnblogs.com/daipianpian/p/4543656.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!