zoukankan      html  css  js  c++  java
  • JavaScript 基础(七) 箭头函数 generator Date JSON

    ES6 标准新增了一种新的函数: Arrow Function(箭头函数)。
        x => x *x
        上面的箭头相当于:

         function (x){ 
              return x*x;
          }

    箭头函数相当于匿名函数,并且简化了函数定义。一种像上面的,只包含一个表达式,
        连{ ... }和return都省略掉了。还有一种可以包含多条语句,这时候就不能省略{ ... }和return:

             x =>{ 
              if(x > 0){ 
                return x * x;
              }else{ 
                return -x *x;
              }
            }

    如果参数不是一个,就需要用括号()括起来:
        // 两个参数
          (x,y) => x*x + y *y
        // 无参数;
          () =>3.14
        // 可变参数

     (x,y,...rest) =>{ 
            var i, sum = x +y;
            for(i=0;i<rest.length;i++){ 
              sum += rest[i];
            }
          return sum;
        }

    this
    现在,箭头函数完全修复了this的指向,this总是指向词法作用域,也就是外层调用者obj:

     var obj = { 
            birth:1990,
            getAge:function(){ 
            var b = this.birth; // 1990
            var fn = () => new Date().getFullYear() - this.birth; // this指向obj 对象。
            return fn();
            }
        }
        obj.getAge(); // 25

    如果使用了箭头函数,以前的那种hack 写法;
        var that = this;

    就不再需要了。
    由于this 在箭头函数中已经按照是否作用域绑定了,所以,用call() 或者apply() 调用箭头函数时,无法对this 进行
    绑定,即传入的第一个参数被忽略。

      var obj = { 
            birth:1990,
            getAge:function(year){ 
              var b = this.burth; // 1990
              var fn = (y) =>y-this.birth; // this.birth 仍是1990
              return fn.call({birth:2000},year);
          }
        };
        obj.getAge(2015); // 25

    generator
    generator(生成器)是ES6标准引入的新型数据类型。一个generator看上去像一个函数,但可以返回多次。

        function* foo(x){
            yield x +1;
            yieldx + 2;
            return x +3;
        }

    generator  和函数不同的是,generator由function* 定义(注意多出的*号),并且,除了return 语句,还可以用yield 返回多次。

    函数只能返回一次,所以碧玺返回一个Array. 但是,如果换成generator,就可以一次返回一个数,不断返回多次。

      function* fib(max){ 
            var t,
            a = 0,
            b=1,
            n=1;
            while (n < max){ 
              yield a;
              t = a +b;
              a = b;
              b = t;
              n++;
            }
            return a;    
          }

    直接调用试试:

      fib(5); // fib {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}

    直接调用一个generator和调用函数不一样,fib(5)仅仅是创建了一个generator对象,还没有去执行它。
    调用generator对象有两个方法,一是不断地调用generator对象的next()方法:

     var f = fib(5);
        f.next(); // {value: 0, done: false}
        f.next(); // {value: 1, done: false}
        f.next(); // {value: 1, done: false}
        f.next(); // {value: 2, done: false}
        f.next(); // {value: 3, done: true}

    Date
    在JavaScript 中,Date 对象用来表示日期和时间的。
    要获取系统当前时间,用:
        var now = new Date();
        now; //// Wed Jun 24 2015 19:49:22 GMT+0800 (CST)
        now.getFullYear(); //2015,年份
        now.getMonth(); // 5,月份,注意月份范围为0~11,5表示六月
        now.getDate();// 24 ,表示24 号
        now.getHours(); // 3,表示星期三
        now.getMinutes(); // 19 ,24小时制
        now.getSeconds(); // 22,秒
        now.getMilliseconds(); //875 毫秒
        now.getTime(); // 1435146562875, 以number形式表示的时间戳
        如果要创建一个执行日期和时间的Date对象,可以用:
        var d = new Date(2015,5,19,20,15,30,123);
        d;// Fri Jun 19 2015 20:15:30 GMT+0800 (CST)

    JSON
    JSON是JavaScript Object Notation的缩写,它是一种数据交换格式。
    在JSON中,一共就这么几种数据类型:
        1,number: 和JavaScript的 number 完全一致;
        2,boolean: 就是JavaScript的 true或 false;
        3,String: 就是JavaScript的String ;
        4,null: 就是JavaScript的null;
        5,array: 就是JavaScript 的Array 表示方式——[];
        6,object: 就是JavaScript 的{...} 表示方式。

    SON还定死了字符集必须是UTF-8,表示多语言就没有问题了。为了统一解析,JSON的字符串规定必须用双引号"",Object的键也必须用双引号""。

    序列化
        

         var guagua = {
            name: '小明',
            age: 14,
            gender: true,
            height: 1.65,
            grade: null,
            'middle-school': '"W3C" Middle School',
            skills: ['JavaScript', 'Java', 'Python', 'Lisp']
        };
        JSON.stringify(xiaoming); // '{"name":"小明","age":14,"gender":true,"height":1.65,"grade":null,"
    
        middle-school":""W3C" Middle School","skills":  ["JavaScript","Java","Python","Lisp"]}'

        结果:

          {
            "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'], ' ');
        结果:

            {
              "name": "guagua",
              "skills": [
                  "JavaScript",
                  "Java",
                  "Python",
                  "Lisp"
                ]
              }

    还可以传入一个函数,这样对象的每个键值对都会被函数先处理:

        function convert(key, value) {
            if (typeof value === 'string') {
              return value.toUpperCase();
        }
          return value;
        }
        JSON.stringify(guagua, convert, ' ');

    上面的代码把所有属性值都变成大写:

     {
          "name": "guagua",
          "age": 14,
          "gender": true,
          "height": 1.65,
          "grade": null,
          "middle-school": ""W3C" MIDDLE SCHOOL",
          "skills": [
              "JAVASCRIPT",
              "JAVA",
              "PYTHON",
              "LISP"
            ]
          }

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

    反序列化
    拿到一个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

    JSON.parse()还可以接收一个函数,用来转换解析出的属性:

      JSON.parse('{"name":"guagua","age":14}',function(key,value){ 
          //把number * 2
        if(key ==='name'){ 
            return value + '同学'
        }
        return value;
        }) ; // Object{name: '瓜瓜同学',age: 14}
  • 相关阅读:
    C#读写xml文件
    实现SQL_SERVER的双机实时备份
    Microsoft .NET Pet Shop 4 架构与技术分析
    xp系统运行asp.net时候出现“服务器应用程序不可用”的必杀
    获取服务器根域名
    C#如何创建Xml文件
    用C#创建XML[简单代码]
    关闭Viewstate
    数字签名
    IE插件
  • 原文地址:https://www.cnblogs.com/nmxs/p/5517493.html
Copyright © 2011-2022 走看看