淺析JavaScript 箭頭函數(shù) generator Date JSON

字號(hào):


    下面小編就為大家?guī)?lái)一篇淺析JavaScript 箭頭函數(shù) generator Date JSON。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。
    ES6 標(biāo)準(zhǔn)新增了一種新的函數(shù): Arrow Function(箭頭函數(shù))。
    x => x *x
    上面的箭頭相當(dāng)于:
    function (x){ 
     return x*x;
    }
    箭頭函數(shù)相當(dāng)于匿名函數(shù),并且簡(jiǎn)化了函數(shù)定義。一種像上面的,只包含一個(gè)表達(dá)式,連{ ... }和return都省略掉了。還有一種可以包含多條語(yǔ)句,這時(shí)候就不能省略{ ... }和return:
    x =>{ 
    if(x > 0){ 
     return x * x;
    }else{ 
     return -x *x;
    }
    }
    如果參數(shù)不是一個(gè),就需要用括號(hào)()括起來(lái):
    // 兩個(gè)參數(shù)
    (x,y) => x*x + y *y
    // 無(wú)參數(shù);
    () =>3.14
    // 可變參數(shù)
    (x,y,...rest) =>{ 
     var i, sum = x +y;
     for(i=0;i<rest.length;i++){ 
     sum += rest[i];
     }
    return sum;
    }
    this
    現(xiàn)在,箭頭函數(shù)完全修復(fù)了this的指向,this總是指向詞法作用域,也就是外層調(diào)用者obj:
    var obj = { 
     birth:1990,
     getAge:function(){ 
     var b = this.birth; // 1990
     var fn = () => new Date().getFullYear() - this.birth; // this指向obj 對(duì)象。
     return fn();
     }
    }
    obj.getAge(); // 25
    如果使用了箭頭函數(shù),以前的那種hack 寫(xiě)法;
    var that = this;
    就不再需要了。
    由于this 在箭頭函數(shù)中已經(jīng)按照是否作用域綁定了,所以,用call() 或者apply() 調(diào)用箭頭函數(shù)時(shí),無(wú)法對(duì)this 進(jìn)行綁定,即傳入的第一個(gè)參數(shù)被忽略。
    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標(biāo)準(zhǔn)引入的新型數(shù)據(jù)類型。一個(gè)generator看上去像一個(gè)函數(shù),但可以返回多次。
    function* foo(x){ 
     yield x +1;
     yieldx + 2;
     return x +3;
    }
    generator 和函數(shù)不同的是,generator由function* 定義(注意多出的*號(hào)),并且,除了return 語(yǔ)句,還可以用yield 返回多次。
    函數(shù)只能返回一次,所以碧璽返回一個(gè)Array. 但是,如果換成generator,就可以一次返回一個(gè)數(shù),不斷返回多次。
    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; 
    }
    直接調(diào)用試試:
    fib(5); // fib {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}
    直接調(diào)用一個(gè)generator和調(diào)用函數(shù)不一樣,fib(5)僅僅是創(chuàng)建了一個(gè)generator對(duì)象,還沒(méi)有去執(zhí)行它。
    調(diào)用generator對(duì)象有兩個(gè)方法,一是不斷地調(diào)用generator對(duì)象的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 對(duì)象用來(lái)表示日期和時(shí)間的。
    要獲取系統(tǒng)當(dāng)前時(shí)間,用:
    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 號(hào)
    now.getHours(); // 3,表示星期三
    now.getMinutes(); // 19 ,24小時(shí)制
    now.getSeconds(); // 22,秒
    now.getMilliseconds(); //875 毫秒
    now.getTime(); // 1435146562875, 以number形式表示的時(shí)間戳
    如果要?jiǎng)?chuàng)建一個(gè)執(zhí)行日期和時(shí)間的Date對(duì)象,可以用:
    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的縮寫(xiě),它是一種數(shù)據(jù)交換格式。
    在JSON中,一共就這么幾種數(shù)據(jù)類型:
    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,表示多語(yǔ)言就沒(méi)有問(wèn)題了。為了統(tǒng)一解析,JSON的字符串規(guī)定必須用雙引號(hào)"",Object的鍵也必須用雙引號(hào)""。
    序列化
    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"]}'
    結(jié)果:
    {
    "name": "小明",
    "age": 14,
    "gender": true,
    "height": 1.65,
    "grade": null,
    "middle-school": "\"W3C\" Middle School",
    "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
    ]
    }
    第二個(gè)參數(shù)用于控制如何篩選對(duì)象的鍵值,如果我們只想輸出指定的屬性,可以傳入Array:
    JSON.stringify(xiaoming, ['name', 'skills'], ' ');
    結(jié)果:
    {
    "name": "guagua",
    "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
    ]
    }
    還可以傳入一個(gè)函數(shù),這樣對(duì)象的每個(gè)鍵值對(duì)都會(huì)被函數(shù)先處理:
    function convert(key, value) {
    if (typeof value === 'string') {
    return value.toUpperCase();
    }
    return value;
    }
    JSON.stringify(guagua, convert, ' ');
    上面的代碼把所有屬性值都變成大寫(xiě):
    {
    "name": "guagua",
    "age": 14,
    "gender": true,
    "height": 1.65,
    "grade": null,
    "middle-school": "\"W3C\" MIDDLE SCHOOL",
    "skills": [
    "JAVASCRIPT",
    "JAVA",
    "PYTHON",
    "LISP"
    ]
    }
    如果我們還想要精確控制如何序列化小明,可以給xiaoming定義一個(gè)toJSON()的方法,直接返回JSON應(yīng)該序列化的數(shù)據(jù):
    反序列化
    拿到一個(gè)JSON格式的字符串,我們直接用JSON.parse() 把它變成一個(gè)JavaScript 對(duì)象:
    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()還可以接收一個(gè)函數(shù),用來(lái)轉(zhuǎn)換解析出的屬性:
    JSON.parse('{"name":"guagua","age":14}',function(key,value){ 
    //把number * 2
    if(key ==='name'){ 
    return value + '同學(xué)'
    }
    return value;
    }) ; // Object{name: '瓜瓜同學(xué)',age: 14}
    以上這篇淺析JavaScript 箭頭函數(shù) generator Date JSON就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考