u,``# 基本語法

變數(Variable)

1. 透過Var宣告
2. 需告時可以指定型別
3. 使用方式

   var id: number = 1;
   //id = "A001"; //VS顯示錯誤:string不可以指派給類型number
   

限定範圍變數(Let)

javascript 區域變數的範圍是靠function區隔的(並非以大括號當作範圍)，因此很容易互相影響。

舉例:

var count = 100;
for (var i = 0; i < 10; i++) {
    var count = 1000;
}
console.log(count); //1000

1. Let 限定變數只存在Scope之中
2. 不會影響外面相同名稱的變數

var count = 100;
for (var i = 0; i < 10; i++) {
    let count = i;               //TypeScript發現已經有count變數，會重新命名為count_1，自動使用不同名稱，模擬區域變數
    console.log(`for:${count}`); //i
}
console.log(count); //100

常數(Const)

1. 不會變動
2. 增加可讀性
3. 修改時跳出錯誤提示

使用方式

const PAGE_COUNT = 10;
//PAGE_COUNT = 100; //vs 提示const唯讀

函數(Function)

1. DRY
2. 包裝常用的程式碼
3. 有型別
4. vs 會檢查參數及回傳值型別是否正確

使用方式

function getDiscountPrice(price: number): number {
    if (price > 200) {
        return price * 0.8;
    }
    return price;
}

console.log(getDiscountPrice(300));

多載(OverLoad)

同樣名稱、不同參數的Function TypeScript方法名稱相同參數不同的方法，但可以使用以下三種方法達成

1. 設定Option參數(可為Null)

   class CouponDiscounter {
   Calculate(price: number, coupon?: string): number {
      //計算邏輯
   }
   }
   

2. 設定預設值

   class CouponDiscounter {
   Calculate(price: number, coupon: string=""): number {
      //計算邏輯
   }
   }
   

3. Spread Property

class CouponDiscounter {
    Calculate(price: number, ...couponList: string[]): number {
        //計算邏輯
    }
}

var couponDiscounter: CouponDiscounter = new CouponDiscounter();
console.log(couponDiscounter.Calculate(200, "A001", "A002", "A003"));

class Discounter {
    getPrice(price: number, coupon?: string): number {
        if (price > 200) {
            return price * 0.8;
        }

        if (coupon === "A001")
            return 0;

        return price;
    }
}
var discounter: Discounter = new Discounter();
console.log(discounter.getPrice(200, "A001"));

匿名函式(Arrow Function)

使用方式

var hello = (name: string) => {
    console.log(`Hello, ${name}`);
};

hello("Allen");

流程控制

if/else、for、while、do while、switch/case

列舉元素

for...in

列舉Array，依序回傳陣列item的key

使用方式

var names = ["Allen", "Daniel", "James", "Bowen"];
for (var key in names) {
    console.log(`key:${key} name:${names[key]}`);
}

for...of

列舉Array，依序回傳陣列item的Value

使用方式

var names = ["Allen", "Daniel", "James", "Bowen"];
for (var userName of names) {
    console.log(`name:${userName}`);
}