day09

今天学了什么

1.字符串常用的方法

1.1 length

获取字符串的长度

var a = "hello world";
alert(a.length)  //11

1.2增加 concat()

方法用于连接两个或多个字符串。

var a = "hello world";
var b = "good";
var c = a.concat(b);
console.log(c);

1.3查询

1.3 .1 charAt(index)

获取在指定下标的字符

var a = "hello world";
alert(a.charAt(0))  //h

1.3.2 indexOf(value)

检索字符串出现的位置

var a = "hello world";
var b = a.indexOf(“h”); //0;
var c = a.indexOf(“a”); //-1如果没有返回-1；

1.3.3 stringObject.slice(start,end)

基本类型方法不能改变原来的值

var a = "hello world";
var b = a.slice(0,2);
console.log(b); //”he”

1.3.4 stringObject.substr(start,length)

var a = "hello world";
var b = a.substr(0,5);
console.log(b);  //hello

1.3.5 stringObject.substring(start,stop)

var a = "hello world";
 var a = "hello world";
 var b = a.substring(0,2);
 console.log(b); //”he”

1.4split()

方法用于把一个字符串分割成字符串数组。

stringObject.split(separator,howmany)
var a = "hello world";
var b = a.split("");
console.log(b);

1.5 str.search()

返回搜索字符的下标 如不存在，返回-1

var a = "hello world";
console.log(a.search("h"));

1.6 match()

将配置的内容，返回一个数组
字符不存在，返回null

var a ="hello";
console.log(a.match("l"));

1.7 replace()替换

var a ="hello";
var b = a.replace("l","*");
console.log(b);

2.正则表达式

正则表达式：有叫规则表达式，规则字符串中字符出现规律的表达式

语法
/pattern/attributes
构造函数的方式
.global:是否全文搜索
简写g
.ignore case:是否大小写敏感
简写i
.multiline:多行搜索
.lastIndex:是当前表达式匹配内容的最后一个字符的下一个位置
.source:正则表达式的文本字符串

<script>
  var a="hello world";
  var reg=/l/g;
  var b=a.replace(reg,"*");
  console.log(b);
</script>

2.1备选字符集

规定某一位字符的备选字符列表
特点：必须且只能多选一

    <script>
        var a="上海,上天,上去,上海那";
        var reg=/上[海天]/g;
        var b=a.replace(reg,"*");
        console.log(b);
        var c="123234dd";
        var d=/[0-9]/g;
        console.log(c.replace(d,"*"));
    </script>

2.2.预定义字符集：

连续备选字符集的简化符号

一位数字

[0-9] --> \d

一位数字字母或下划线
[0-9a-zA-Z_] -->\w

一位空字符：空格,tab,换行
\s

除换行外，其余所有字符
.
点

2.3.量词：规定字符集出现的次数

特点:默认一个量词，仅修饰左侧紧邻的字符集

2.3.1 确定数量:

{m,n} -->至少m个，最多n个
{m,} -->m个以上
{m} -->必须m个

2.3.2 不确定数量

// ? -->一个或0个
// + -->1个以上

// * -->多个或没有

2.3.2test()

测试正则表示式中是否存在匹配正则表示式的字符串,是有没有的问题,为局部匹配而生的。返回boolean值
语法reg.test(str);
test()使用时正则中不要写g

var str ="a";
        var reg = /a/g;
        console.log(reg.test(str));
        console.log(reg.test(str));
        console.log(reg.test(str));
        console.log(reg.test(str));
        console.log(reg.test(str));

var str ="ab";
        var reg = /[a-z]/g;
        while(reg.test(str)){
            console.log(reg.lastIndex);
        }

2.4. 选择和分组

选择
| 读作"或"

分组
()

2.5. 指定匹配位置

开头和结尾：^开头的xxx；$结尾的xxx

何时使用:仅匹配开头的规则和结尾的规则时使用

固定搭配：^正则表达式$-->表示从头到尾完整匹配

何时使用:只要验证时，必须前加^,后加$！

//匹配字符串开头的所有空字符
^\s+
//匹配字符串结尾的所有空字符
\s+$

var a ="  hello";
var reg =/^\s+/;
var str =a.replace(reg,"");
console.log(str);

2.6. 排除

//除了abc
[^abc]  

2.7 贪婪模式和懒惰模式

默认会取量词中最大的值

var str = "123456abc";
  var reg = /\d{3,6}/;
  console.log(str.replace(reg,"*"))

懒惰模式-->?
取量词中最小的值

var str = "123456abc";
var reg = /\d{3,6}?/;
console.log(str.replace(reg,"*"))

3.字符串支持正则的API

match()将所有匹配的字符(内容)提取出来

eg:

 varstr = "he1212 212";
 console.log(str.match(/\d+/g));*// ["1212",  "212",]*

search() 方法用于检索字符串中指定的子字符串的位置

stringObject.search(regexp)*//注释：如果没有找到任何匹配的子串，则返回 -1。*
var a = "hello world";
var reg = /w/;
console.log(a.search(reg));  //6

replace() 替换匹配的对象

stringObject.replace(regexp/substr,replacement)
var a = "hello";
var reg = /l/g;
console.log(a.replace(reg,"*")); //"he**o"

Split(reg) 将字符串分割成数组

var a = "helo";
var reg = /l/;
console.log(a.split(reg)); //["he", "o"]

4.date对象

//获取当前时间
var oDate = new Date();
var hour = oDate.getHours();
var minute = oDate.getMinutes();
var second = oDate.getSeconds();
var date = oDate.getDate();
var year = oDate.getFullYear();
var mill = oDate.getTime();
//月份从0开始
var month = oDate.getMonth()+1;
//星期从0开始，0表示星期天
//0,1,2,3,4,5,6
var day = oDate.getDay();

例子:实现一个数码时钟

• 效果思路

• 获取系统时间
  • Date对象
  • getHours、getMinutes、getSeconds
• 显示系统时间
  • 字符串连接
  • 空位补零
• 设置图片路径
  • charAt方法

//css
    <style>
        span{
            font-size: 30px;
        }
        body{
            background-color: black;color: #fff;
        }
    </style>
//html
<div>
    <img src="images/0.png" alt=""/>
    <img src="images/0.png" alt=""/>
    <span>:</span>
    <img src="images/0.png" alt=""/>
    <img src="images/0.png" alt=""/>
    <span>:</span>
    <img src="images/0.png" alt=""/>
    <img src="images/0.png" alt=""/>
</div>
<script>
    function getDouble(n){
        if(n<10){
            return "0"+n;
        }else{
            return ""+n;
        }
    }
    showTime();
    function showTime(){
        /*1.获取系统时间*/
        var oDate = new Date();
        var hour = oDate.getHours();
        var minute = oDate.getMinutes();
        var second = oDate.getSeconds();
        /*2.显示系统时间
         *a字符串连接
         *b空零补位
         * */
        var imgs = document.getElementsByTagName("img");
        var str = getDouble(hour)+getDouble(minute)+getDouble(second);
        for(var i=0;i<imgs.length;i++){
            imgs[i].src="images/"+str[i]+".png"
        }
    }
    setInterval(showTime,1000)
</script>