javascript学习(五)之标准对象

一、RegExp:正则表达式是一种用来匹配字符串的强有力的武器。它的设计思想是用一种描述性的语言来给字符串定义一个规则，
          凡是符合规则的字符串，我们就认为它“匹配”了，否则，该字符串就是不合法的。

      一基础知识：
              一、创建一个匹配Email的正则表达式；
              二、用该正则表达式去匹配用户的输入来判断是否合法。
                1、用\d可以匹配一个数字，\w可以匹配一个字母或数字，所以：
                2、'\d\d\d'可以匹配'010'；
                3、'\w\w'可以匹配'js'；
                4、.可以匹配任意字符，所以：
                5、'js.'可以匹配'jsp'、'jss'、'js!'等等。
                6、要匹配变长的字符，在正则表达式中，用*表示任意个字符（包括0个），用+表示至少一个字符，用?表示0个或1个字符，用{n}表示n个字符，用{n,m}表示n-m个字符：
          例子：\d{3}\s+\d{3,8}
              1、\d{3}表示匹配3个数字，例如'010'；
              2、\s可以匹配一个空格（也包括Tab等空白符），所以\s+表示至少有一个空格，例如匹配' '，'\t\t'等；
              3、\d{3,8}表示3-8个数字，例如'1234567'。
          综合起来，上面的正则表达式可以匹配以任意个空格隔开的带区号的电话号码。

      二、进阶
          要做更精确地匹配，可以用[]表示范围，比如：
            1、[0-9a-zA-Z\_]可以匹配一个数字、字母或者下划线；
            2、[0-9a-zA-Z\_]+可以匹配至少由一个数字、字母或者下划线组成的字符串，比如'a100'，'0_Z'，'js2015'等等；
            3、[a-zA-Z\_\$][0-9a-zA-Z\_\$]*可以匹配由字母或下划线、$开头，后接任意个由一个数字、字母或者下划线、$组成的字符串，也就是JavaScript允许的变量名；
            4、[a-zA-Z\_\$][0-9a-zA-Z\_\$]{0, 19}更精确地限制了变量的长度是1-20个字符（前面1个字符+后面最多19个字符）。
            5、A|B可以匹配A或B，所以(J|j)ava(S|s)cript可以匹配'JavaScript'、'Javascript'、'javaScript'或者'javascript'。
            6、^表示行的开头，^\d表示必须以数字开头。
            7、$表示行的结束，\d$表示必须以数字结束。
            8、你可能注意到了，js也可以匹配'jsp'，但是加上^js$就变成了整行匹配，就只能匹配'js'了

      三、js案例

         var re1 = /ABC\-001/;
         var re2 = new RegExp('ABC\\-001');  // 因为字符串的转义问题，字符串的两个\\实际上是一个\。

         3.1、先看看如何判断正则表达式是否匹配：RegExp对象的test()方法用于测试给定的字符串是否符合条件。

            var re = /^\d{3}\-\d{3,8}$/;
            re.test('010-12345'); // true
            re.test('010-1234x'); // false
            re.test('010 12345'); // false

         3.2、分割字符串
              案例：
                1、'a,b;; c  d'.split(/[\s\,\;]+/); // ['a', 'b', 'c', 'd']
                2、无论多少个空格都可以正常分割。加入,试试：
                   'a,b, c  d'.split(/[\s\,]+/); // ['a', 'b', 'c', 'd']

         3.3、分组：如果正则表达式中定义了组，就可以在RegExp对象上用exec()方法提取出子串来。
            除了简单地判断是否匹配之外，正则表达式还有提取子串的强大功能。用()表示的就是要提取的分组（Group）。比如：
            ^(\d{3})-(\d{3,8})$分别定义了两个组，可以直接从匹配的字符串中提取出区号和本地号码：

            var re = /^(\d{3})-(\d{3,8})$/;
            re.exec('010-12345'); // ['010-12345', '010', '12345']
            re.exec('010 12345'); // null

            3.3.1、exec()方法在匹配成功后，会返回一个Array，第一个元素是正则表达式匹配到的整个字符串，后面的字符串表示匹配成功的子串。
            3.3.2、exec()方法在匹配失败时返回null。

         案例：匹配邮箱：var re =/^[0-9a-zA-Z\.]+@[0-9a-zA-Z]+\.[a-zA-Z]+$/;
              二可以验证并提取出带名字的Email地址：var re =/^\<([\w\s\w]+)\>\s+([0-9a-zA-Z\.]+@[0-9a-zA-Z]+\.[a-zA-Z]+)$/;

         思考题：
         [a-zA-Z]只包括字母
         \w  字母数字，下划线，unicode文字

二、JSON：是JavaScript Object Notation的缩写，它是一种数据交换格式。
   为了统一解析，JSON的字符串规定必须用双引号""
   在JSON中，一共就这么几种数据类型：
        number：和JavaScript的number完全一致；
        boolean：就是JavaScript的true或false；
        string：就是JavaScript的string；
        null：就是JavaScript的null；
        array：就是JavaScript的Array表示方式——[]；
        object：就是JavaScript的{ ... }表示方式。
   案例：
   'use strict';
    var xiaoming = {
        name: '小明',
        age: 14,
        gender: true,
        height: 1.65,
        grade: null,
        'middle-school': '\"W3C\" Middle School',
        skills: ['JavaScript', 'Java', 'Python', 'Lisp']
    };

    var s = JSON.stringify(xiaoming);
    或
    要输出得好看一些，可以加上参数，按缩进输出：
    var s =JSON.stringify(xiaoming, null, '  ');
    结果：
        {
          "name": "小明",
          "age": 14,
          "gender": true,
          "height": 1.65,
          "grade": null,
          "middle-school": "\"W3C\" Middle School",
          "skills": [
            "JavaScript",
            "Java",
            "Python",
            "Lisp"
          ]
        }
    第二个参数用于控制如何筛选对象的键值，如果我们只想输出指定的属性，可以传入Array：
         JSON.stringify(xiaoming, ['name', 'skills'], '  ');

   如果我们还想要精确控制如何序列化小明，可以给xiaoming定义一个toJSON()的方法，直接返回JSON应该序列化的数据：

    var xiaoming = {
        name: '小明',
        age: 14,
        gender: true,
        height: 1.65,
        grade: null,
        'middle-school': '\"W3C\" Middle School',
        skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
        toJSON: function () {
            return { // 只输出name和age，并且改变了key：
                'Name': this.name,
                'Age': this.age
            };
        }
    };

    JSON.stringify(xiaoming); // '{"Name":"小明","Age":14}'

   反序列化：  拿到一个JSON格式的字符串，我们直接用JSON.parse()把它变成一个JavaScript对象：
            JSON.parse('[1,2,3,true]'); // [1, 2, 3, true]
            JSON.parse('{"name":"小明","age":14}'); // Object {name: '小明', age: 14}
            JSON.parse('true'); // true
            JSON.parse('123.45'); // 123.45

   练习：
   用浏览器访问OpenWeatherMap的天气API，查看返回的JSON数据，然后返回城市、天气预报等信息：

    'use strict'
    var url = 'https://api.openweathermap.org/data/2.5/forecast?q=Beijing,cn&appid=800f49846586c3ba6e7052cfc89af16c';
    $.getJSON(url, function (data) {
       var info = {
        city: data.city.name,
        weather: data.list[0].weather[0].main,
        time: data.list[0].dt_txt
    };
    console.log(JSON.stringify(info, null, '  '));
    });