下面小編就為大家?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 寫法；

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的縮寫，它是一種數(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, ' ');

上面的代碼把所有屬性值都變成大寫：

{

　　"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è)參考