ts-變量聲明

小心作用域規則

小心解構

塊級作用域的時間死區

const變量聲明原則

 

var a = 10;
function f() {
    var message = "Hello, world!";

    return message;
}

function f() {
    var a = 10;
    return function g() {
        var b = a + 1;
        return b;
    }
}

var g = f();
g(); // returns 11;

// ======================================

// 作用域規則
// 全局作用域
// 局部作用域

// 這些作用域規則可能會引發一些錯誤。 其中之一就是，多次聲明同一個變量並不會報錯：

for(var i=0; i<10;i++){
    function(i){
        setTimeout(function(){consile.log(i)},i*100);
    }(i)
}

for (let i = 0; i < 10 ; i++) {
    setTimeout(function() {console.log(i); }, 100 * i);
}


// 擁有塊級作用域的變量的另一個特點是，它們不能在被聲明之前讀或寫。 
// 雖然這些變量始終“存在”於它們的作用域里，但在直到聲明它的代碼之前的區域都屬於時間死區。

// 塊級作用域變量的獲取

function theCityThatAlwaysSleeps() {
    let getCity;

    if (true) {
        let city = "Seattle";
        getCity = function() {
            return city;
        }
    }

    return getCity();
}

// const 與let相同的作用域規則，但是不能對它們重新賦值。
// 基本原則就是如果一個變量不需要對它寫入，那么其它使用這些代碼的人也不能夠寫入它們，並且要思考為什么會需要對這些變量重新賦值。 
// 使用const也可以讓我們更容易的推測數據的流動。

// 解構
let input = [1, 2];
let [first, second] = input;
console.log(first); // outputs 1
console.log(second); // outputs 2

// 你可以使用...name語法創建一個剩余變量列表：
let [first, ...rest] = [1, 2, 3, 4];
console.log(first); // outputs 1
console.log(rest); // outputs [ 2, 3, 4 ]

let o = {
    a: "foo",
    b: 12,
    c: "bar"
}
let {a, b} = o;

console.log(o['a']);
console.log(o['b']);

// 數據類型指明

let {a, b}: {a: string, b: number} = o;

function f({a, b = 0} = {a: ""}): void {
    // ...
}
f({a: "yes"}) // ok, default b = 0
f() // ok, default to {a: ""}, which then defaults b = 0
f({}) // error, 'a' is required if you supply an argument

// 要小心使用解構。 從前面的例子可以看出，就算是最簡單的解構也會有很多問題