javascript1.7新文法

web技術近兩年來發展迅速，隨著開發環境的變化，我們也能使用新技術來提高生產力。javascript1.6對數組增加了一系列的新方法，可能大家都比較熟悉了。

下面看看javascript1.7帶來的新變化，想要使用新版本的javascript要使用支援新版本的瀏覽器，比如firefox最高已經支援javascript1.8.5，同時要處理一下scirpt標籤的mime類型為：

<script type="application/javascript;version=1.7">

 

例如：

1 <script type="application/javascript;version=1.7">
2 void function (){
3     if(true){
4         var a=1;
5         console.log(a);//1
6     }
7     console.log(a);//1
8 }()
9 </script>

 

1.yield 關鍵字

 

Yield的作用與return 差不多，都會返回一個結果。但是return會跳出函數，yield可以多次使用直到運算不能進行。（Yield也是一個c#的關鍵字）。

2.產生器Generators 

 

當一個函數使用yield指定傳回值時，可以把他當做產生器來使用。如果調用了包含yield函數則會得到一個產生器的執行個體。每次調用產生器執行個體的next方法，就會得到一個運算結果。如果超出產生器的邊界就會得到一個object StopIteration的錯誤。因為yield的關係，不能準確的得到產生器的長度，所以用try語句處理一下。當產生器使用完畢後，調用close方法，會強制關閉產生器。

 

 1 function getNumber(){
 2     for(let i=0;i<10;i++){
 3         yield i*2;
 4     }
 5 }
 6 var generators= getNumber();
 7     try{
 8         while(generators){
 9             console.log(generators.next());
10         }
11     }catch(e){
12 
13     }finally{
14         generators.close();
15     }

 

3.迭代器

 

如果厭惡了使用for和for in，可以試試迭代器。即使不使用迴圈也能達到同樣的目的，而且迭代器可以支援任意類型的對象。

 

1 var arr=['a','b','c'],it=new Iterator(arr); //{'1':'a','2':'b','3':'c'}
2 try{
3     while(it){
4         console.log(it.next()); //[0, "a"][1, "b"][2, "c"]  // [1, "a"][2, "b"][3, "c"]
5     }
6 }catch(e){};

 

調用迭代器的next方法會返回一個數組，第一項是下標或者key，第二項是對應的值。如果超出邊界的話會返回一個object StopIteration的錯誤。

4.數組領悟。

這是來自python的文法，現在引入js可以極大的提高生產力。

文法如下 array=[value for each (variable in values) condition ]; 

var a=[1,3,6,13,0,94,222];

A. 

1 for each(i in a){ if(i){console.log(i)}} //類似for in的古老用法。

B.

1  var b=[i*2 for each(i in a) if(i%3===0)];// [6,12,0,444] 得到一個新數組

 

C. 

 1 var b=(i*2 for each(i in a) if(i%3===0));//獲得一個產生器。
 2 
 3 
 4 try{
 5 
 6 while(b){
 7 
 8 console.log(b.next());// 6 12 0 444
 9 
10 }
11 
12 
13 }catch(e){}; 

D. 處理對象

 

1 for each(let [j,k] in new Iterator(a)){
2 
3 
4 console.log(j +' '+k)
5 
6 
7 }; 

5.結構賦值 

這個非常簡單

 

1  var [a,b]=[1,2,3,4]; //a=1 b=2

2  var {width:px,height:pec}={width:80,height:'50%'};//px 80 pec 50%

6.let關鍵字 建立塊級範圍

在現在使用廣泛的javascript1.5是沒有塊級範圍的。用var定義變數，由於解析器變數提升的關係經常不小心就踩到地雷，現在福音來了！

1 void function (){
2     if(true){
3         let a=1;
4         console.log(a);//1
5     }
6     console.log(a);//undefined
7 }()

在看看var

1 void function (){
2     if(true){
3         var a=1;
4         console.log(a);//1
5     }
6     console.log(a);//1
7 }()