第五章：引用类型（Date 类型、RegExp 类型）

最新推荐文章于 2022-05-07 22:24:59 发布

miaoch

最新推荐文章于 2022-05-07 22:24:59 发布

阅读量357

点赞数

分类专栏： JavaScript高级程序设计阅读笔记文章标签： javascript

本文链接：https://blog.csdn.net/miaoch/article/details/64125925

版权

JavaScript高级程序设计阅读笔记专栏收录该内容

37 篇文章 0 订阅

订阅专栏

Date类型

js中的Date类型是在早期Java的java.util.Date类基础上构建的。Date类型使用来自UTC1970年1月1日午夜（零时）开始经过的毫秒数来保存日期。

    var now = new Date();//传入一个毫秒数，不传为系统当前时间

Date.parse()方法接收一个表示日期的字符串参数，然后根据字符串返回毫秒数。日期格式因地而异。

    //注释第一个是Chrome的运行结果 第二个是IE9的运行结果
    var someDate = new Date(Date.parse("May 25, 2004"));
    alert(someDate);//正确 正确
    var someDate = new Date(Date.parse("May252004"));
    alert(someDate);//252004年5月1日 Invalid Date
    var someDate = new Date(Date.parse("May25"));
    alert(someDate);//2001年 Invalid Date
    someDate = new Date(Date.parse("25/5/2004"));
    alert(someDate);//Invalid Date 2006/1/5(着实有点神奇)
    //上面的代码如果省略Date.parse()也是可以运行的。Date会自动将传入的字符串先进行Date.parse()。
    var someDate = new Date("May 25, 2004");

Date.UTC()方法同样也能返回表示日期的毫秒数，但它接收的参数与Date.parse()不同。Date.UTC()的参数分别是年份、基于0的月份（一月是0）、月中的哪一天、小时数、分钟、秒、毫秒数。其中前两个参数是必须的。

    //January 1, 2000 at midnight
    var y2k = new Date(Date.UTC(2000, 0));
    alert(y2k.toUTCString());
    //May 5, 2005 at 5:55:55 PM GMT
    var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55));
    alert(allFives.toUTCString());
    //上面的代码如果省略Date.UTC()也是可以运行的。Date会自动将传入的字符串先进行Date.UTC()。(类比parse)
    //在这里我有个疑问，前两个参数必须，是不是Date构造函数用于区分调用毫秒数构造函数还是先进行UTC()函数

Date.now()：返回表示调用这个方法时的日期和时间的毫秒数。（IE9+、Firefox 3+、Safari 3+、Opera 10.5、Chrome）

    var start = Date.now();
    var sum = null;
    for (var i=0;i<10000;i++) {
        sum += i;
        //null + 0 = 0!
        //因为null的Number转成为0 不是NaN
    }
    var stop = Date.now();
    alert(stop - start);
    //当没有该方法时，可以通过valueOf()去获取毫秒值。
    alert(new Date().valueOf());
    alert(Number(new Date()));
    alert(+new Date());//一元加操作符
    alert(new Date().getTime());//下面会聊

以下是Chrome对日期格式化运行的结果。

    var now = new Date();
    alert(now.toString());//Mon Mar 20 2017 17:15:05 GMT+0800 (中国标准时间)
    alert(now.toLocaleString());//2017/3/20 下午5:15:05
    alert(now.toDateString());//Mon Mar 20 2017
    alert(now.toTimeString());//17:15:05 GMT+0800 (中国标准时间)
    alert(now.toLocaleDateString());//2017/3/20
    alert(now.toLocaleTimeString());//下午5:15:05
    alert(now.toUTCString());//Mon, 20 Mar 2017 09:15:05 GMT

方法	说明
getTime() / setTime(毫秒)	返回/设置日期的毫秒数
getFullYear() / setFullYear()	返回/设置四位数的年份(2017)
getUTCFullYear() / setUTCFullYear()	返回/设置UTC日期的四位数年份
getMonth() / setMonth()	返回/设置日期中的月份。0代表一月，11代表12月，超过11增加年份
getUTCMonth() / setUTCMonth()	UTC日期，其余同上
getDate() / setDate()	返回/设置日期中的天数。(1~31),超过则增加月份
getUTCDate() / setUTCDate()	UTC日期，其余同上
getDay()	返回日期中星期的星期几(0代表周日)
getUTCDay()	返回UTC日期中星期的星期几(0代表周日)
getHours() / setHours()	返回/设置日期中的小时数。(0~23),超过则增加月份中的天数（如果月份也超过了会跳到下个月吗？）
getUTCHours() / setUTCHours()	UTC日期，其余同上
getMinutes() / setMinutes()	返回/设置日期中的分钟数。(0~59),超过则增加小时数
getUTCMinutes() / setUTCMinutes()	UTC日期，其余同上
getSeconds() / setSeconds()	返回/设置日期中的秒数。(0~59),超过则增加分钟数
getUTCSeconds() / setUTCSeconds()	UTC日期，其余同上
getMilliseconds() / setMilliseconds()	返回/设置日期中的毫秒数。(0~999)（超过会增加秒数吗？）
getUTCMilliseconds() / setUTCMilliseconds()	UTC日期，其余同上
getTimezoneOffset()	返回本地时间和UTC时间相差的分钟数

注意到此处没有format方法，再学了后面的知识后我会回来补充format方法。

RegExp 类型

js通过RegExp类型来支持正则表达式。以下是字面量创建和构造方法创建：

    var expression = / pattern / flags;
    var expression = new RegExp(pattern, flags);

其中flags包含以下三个：
1. g: 表示全局(global)模式，即模式将被应用于所有字符串，而非在发现第一个匹配项时立即停止。
2. i: 表示不区分大小写(case-insensitive)。
3. m: 表示多行(multiline)模式，即在达到一行文本末尾时还会继续查找下一行是否存在与模式匹配的项。
以下是一些用法：

    //匹配字符串中所有"at"的实例
    var pattern1 = /at/g;
    //匹配第一个bat或cat，不区分大小写
    var pattern2 = /[bc]at/i;
    //匹配所有以"at"结尾的3个字符组合，不区分大小写
    var pattern3 = /.at/gi;

正则表达式中的元字符：( { [ \ ^ $ | ) ? * + . ] } 这些字符在正则表达式中有特殊用途（这里不讨论正则表达式符号的用法），如果想包含这些字符，需要转义。需要注意的是，如果使用的是new方式创建一个RegExp实例：

    var pattern1 = /\[bc\]at/g;//匹配"[bc]at"字符串
    var pattern2 = new RegExp("/\\[bc\\]at", "g");
    //第一个参数必须再对"\"进行转义，即再添加一个"\"

在以前的旧版本ECMAScript3中，通过字面量创建RegExp实例，如果字面量相同，创建出来的会是同一个实例。这也就意味着：

    var re = null;
    var i;
    for (i=0; i<10; i++) {
        re = /cat/g; //写在这与写在循环外部效果一致
        alert(re.test("catxxxxx"));
    }

此处虽然re每次都重新设置了，但是由于是同一个实例，且是全局模式，故会依次弹true、false、true、false…之所以会再弹true是因为到了末尾后，下次test()又从头开始。但是在ECMAScript5中明确规定，使用字面量必须像调用RegExp构造函数一样，每次都创建新的RegExp实例。IE9+、Firefox4+和Chrome都据此做出了修改。

RegExp实例属性

global：布尔值，表示是否设置了g标志。
ignoreCase：布尔值，表示是否设置了i标志。
multiline：布尔值，表示是否设置了m标志。
lastIndex：整数，表示开始搜索下一个匹配项的字符位置，从0算起。
source：正则表达式的字符串表示，按照字面量形式返回。

    var pattern1 = /\[bc\]at/i;
    alert(pattern1.global);     //false
    alert(pattern1.ignoreCase); //true
    alert(pattern1.multiline);  //false
    alert(pattern1.lastIndex);  //0
    alert(pattern1.source);     //"\[bc\]at"

RegExp实例方法

exec(): 该方法是专门为捕获组设计的（通过圆括号）。exec()接受一个参数，即要应用的字符串，然后返回包含第一个匹配项信息的数组。没有则返回null。返回的是Array数组实例，但包含两个额外的属性：index(当前匹配项的下标)和input(原字符串)。处于全局模式下，再次调用exec()会继续捕获下一个匹配项。

    var text = "mom and dad and baby mom and dad";
    var pattern = /mom( and dad( and baby)?)?/gi;
    var matches = pattern.exec(text);
    alert(matches.index);    //0
    alert(matches.input);    //"mom and dad and baby mom and dad"
    alert(matches[0]);       //"mom and dad and baby"
    alert(matches[1]);       //" and dad and baby"
    alert(matches[2]);       //" and baby"
    //再次调用exec()，无论接收的字符串是什么，都会从index+matches[0].length的下标开始继续搜索
    var matches = pattern.exec(text);
    alert(matches.index);    // 21
    alert(matches.input);    //"mom and dad and baby mom and dad"
    alert(matches[0]);       //"mom and dad"
    alert(matches[1]);       //" and dad"
    alert(matches[2]);       //undefined

test(): 传入一个字符串，匹配成功返回true，否则返回false；

    //如果带g的话，lastIndex会改变。再次test会出现false
    var pattern = /1[3-9]\d{9}/;
    alert(pattern.test("13333333333"));//true
    //alert(pattern.test("13333333333"));//带g为false 不带为true
    alert(pattern.test("12333333333"));//false
    alert(pattern.test("1233333333"));//false

RegExp构造函数属性

RegExp构造函数包含一些属性（这些属性在其他语言中被看成静态属性）。这些属性适用于域中的所有正则表达式，并且基于所执行的最近一次正则表达式操作而变化。以下是属性说明（Opera不支持短属性名,不支持前三者）：

长属性名	短属性名	说明
input	$_	最近一次要匹配的字符串。
lastMatch	$&	最近一次的匹配项。
lastParen	$+	最近一次的捕获组。
leftContext	$`	input字符串中lastMatch之前的文本。
multiline	$*	布尔值,表示是否所有表达式都使用多行模式。IE和Opera没有该属性(我的Chrome也没有)
rightContext	$’	input字符串中lastMatch之后的文本。

    var text = "this has been a short summer";
    var pattern = /(.)hort/g;
    if (pattern.test(text)){
        alert(RegExp.input);               //this has been a short summer
        alert(RegExp.$_);               //this has been a short summer
        alert(RegExp.leftContext);         //this has been a  
        alert(RegExp["$`"]);            //this has been a                      
        alert(RegExp.rightContext);        // summer
        alert(RegExp["$'"]);            // summer
        alert(RegExp.lastMatch);           //short
        alert(RegExp["$&"]);            //short
        alert(RegExp.lastParen);           //s
        alert(RegExp["$+"]);            //s
        alert(RegExp.multiline);           //undefined
        alert(RegExp["$*"]);            //undefined
    }

    //还有$1~$9分别代表最近的捕获组
    alert(RegExp.$10);       //undefined
    alert(RegExp.$9);       //""
    var text = "this has been a short summer";
    var pattern = /(..)or(..)sum(...)/g;
    if (pattern.test(text)){
        alert(RegExp.$1);       //sh
        alert(RegExp.$2);       //t
        alert(RegExp.$3);       //mer
        alert(RegExp.$4);       //""
    }
    var pattern2 = /(..)or/g;
    if (pattern2.test(text)){
        alert(RegExp.$1);       //sh
        alert(RegExp.$2);       //"" 此处不会是t 原来的t会被冲掉
        alert(RegExp.$3);       //"" 同理
        alert(RegExp.$4);       //""
    }