《JavaScript高級程序設計》筆記:附錄A ECMAScript Harmony

通常性變化

常量

用const關鍵字聲明常量,聲明的變量在初始賦值後,就不能進行修改了,以下代碼:javascript

const MAX_SIZE = 25;
MAX_SIZE = 10;  //報錯

塊級做用域及其餘做用域

for(let i = 0; i < 10; i++){
    //執行某些操做
}
console.log(i);  //錯誤! i is not defined

函數

剩餘參數與分佈參數

剩餘參數的語法是三個點後跟一個標識符,以下例子:java

function sum (num1, num2, ...nums){
    var result = num1 + num2;
    for(let i = 0, len = nums.length; i < len; i++){
        result += nums[i];
    }
    return result;
}
var result = sum(1,2,3,4,5,6);
console.log(result); //21

分佈參數:能夠向函數中傳入一個數組,而後數組中的元素會映射到函數的每一個參數上。以下代碼:數組

var result = sum(...[1,2,3,4,5,6]);

以上代碼跟下面等價:瀏覽器

var result = sum.apply(this,[1,2,3,4,5,6]);

默認參數值

要爲參數指定默認值,能夠在參數名後面直接加上等於號和默認值,以下代碼:app

function sum(num1,num2 =2){
    return num1 + num2;
}
var result1 = sum(5);
var result2 = sum(5,5);
console.log(result1,result2); //7,10

生成器

所謂生成器,其實就是一個對象,它每次能生成一系列值中的一個。要建立生成器,可讓函數經過yield操做符返回某個特殊的值。對於使用yield操做符返回值的函數,調用它時就會建立並返回一個新的Generator實例。而後在這個實例上調用next()方法就能取得生成器的第一個值。此時,執行的是原來的函數,但執行流到yield語句就會中止,只返回特定的值。從這個角度看,yield和return很類似。若是再次調用next()方法,原來函數中位於yield語句後的代碼會繼續執行,知道再次碰見yield語句時中止執行,此時再返回一個新值,以下代碼:函數

function* myNumbers(){
    for(var i =0 ; i < 10; i++){
        yield i * 2;
    }
}
var generator = myNumbers();
try{
    while(true){
        document.write(generator.next() + "<br/>")
    }
}catch(ex){
    //有意沒有寫代碼
}finally{
    generator.close();
}

 執行上面代碼瀏覽器卡死。來看下面例子:this

function* a(){
    console.log(11)
    yield 'kevin';

    console.log(22);
    yield 'ivan';
    
    console.log(33);
    yield 'wuhan';
    return 'yes';
}

var b =  a();
console.log(b.next())
console.log(b.next())
console.log(b.next())
console.log(b.next())

結果:spa

//打印結果:
11
Object { value: "kevin", done: false }
22
Object { value: "ivan", done: false }
33
Object { value: "wuhan", done: false }
Object { value: "yes", done: true }

 在須要一系列值,而每個值又與前一個值存在某種關係的狀況下,可使用生成器。firefox

數組及其餘結構

迭代器

普通的對象並無內置的@@iterator。固然,你也能夠給任何想遍歷的對象定義@@iterator,以下代碼:prototype

var myObject = {
    a:2,
    b:3
};
Object.defineProperty(myObject,Symbol.iterator,{
    enumerable:false,
    writable:false,
    configurable:true,
    value:function(){
        var o = this,
            idx = 0,
            ks = Object.keys(o);
        return {
            next:function(){
                return {
                    value:o[ks[idx++]],
                    done:(idx > ks.length)
                }
            }
        }
    }
});

//手動遍歷myObject
var it = myObject[Symbol.iterator]();
var next1 = it.next();
var next2 = it.next();
var next3 = it.next();
console.log(next1); //{value: 2, done: false}
console.log(next2); //{value: 3, done: false}
console.log(next3); //{value: undefined, done: true}

//用for...of遍歷myObject
for(var v of myObject){
    console.log(v);
}
//2
//3

注:咱們使用Object.defineProperty()定義了咱們本身的@@iterator(主要是爲了讓它不可枚舉),不過注意,咱們把符號當作可計算屬性名。此外,也能夠直接在定義對象時進行聲明,好比:

var myObject = {
    a:2,
    b:3,
    [Symbol.iterator]:function(){
        /*..*/
    }
};

爲數組建立迭代器,以下代碼:

var colors = ["red","green","blue"];
var iterator = colors[Symbol.iterator]();
console.log(iterator.next());  //{value: "red", done: false}
console.log(iterator.next());  //{value: "green", done: false}
console.log(iterator.next());  //{value: "blue", done: false}
console.log(iterator.next());  //{value: undefined, done: true}

數組領悟

所謂數組領悟,指的是用一組符合某個條件的值來初始化數組。JS中數組領悟的基本形式:

array = [value for each (variable  in values) condition];

其中,value是實際會包含在數組中的值,它源自values數組。for each結構會循環values中的每個值,並將每一個值保存在變量variable中,若是保存在variable中的值符合condition條件,就會將這個值添加到結果數組中,以下例子:

var numbers = [0,1,2,3,4,5,6,7,8,9,10];

//把全部元素複製到新數組
var duplicate = [i for each (i in numbers)];

//只把偶數複製到新數組
var evens = [i for each (i in numbers) if (i % 2 == 0)];

//把每一個數乘以2後的結果放到新數組中
var doubled = [i*2 for each (i in numbers)];

//把每一個奇數乘以3後的結果放到新數組中
var tripledOdds = [i*3 for each (i in numbers) if (i %2 > 0)];

firefox2+是惟一支持數組領悟的瀏覽器。並且要使用這個功能,必須將<script>的type屬性值指定爲「application/javascript;version=1.7」

解構賦值

var [name,value] = ["color","red"];
console.log(name,value); //color red

var [,value] = ["color","red"];
console.log(value); //red

var person = {
    name:"Nice",
    age:29
};
var {name:personName,age:personAge} = person;
console.log(personName,personAge); //Nice 29

新對象類型

 Harmony爲JS定義了幾個新的對象類型。

代理對象

要建立代理對象,可使用Proxy.create()方法,傳入一個handler(處理程序)對象和一個可選的prototype()原型對象。

var proxy = Proxy.create(handler);

//建立一個以myOjbect爲原型的代理對象
var proxy = Proxy.create(handler,myObject);

 待續

相關文章
相關標籤/搜索