學typescript，首先肯定是看官方文件，http://www.typescriptlang.org，國內翻譯網站：https://www.tslang.cn

說實話，這個文件看下去，是昏昏欲睡的感覺。只能作為手冊查查

在這裡推薦《從C#到TypeScript - 型別》，從c#看ts，對比學起來快些，這裡就個人，做一些筆記，分享一下

TypeScript - 型別

一般強型別程式語言基礎型別有byte,short,int,long,float,double,boolean,char

而typescript和js一樣，而TypeScript和JavaScript一樣，所有的數字都是double(雙精度浮點數)，都是用number表示

typescript聯合型別與交叉型別

ts讓我感到詭異的就是聯合型別,其實就是多個型別聯合在一起，用|符號隔開

let sn: string | number = 'string, number' //這個型別既可以是string，又可以是number

更加迷惑的是，交叉型別(Intersection Types)，交叉型別是將多個型別合併為一個型別。Person & Serializable & Loggable同時是 Person 和 Serializable 和 Loggable。 就是說這個型別的物件同時擁有了這三種類型的成員。您將主要看到用於mixins的交集型別和其他不適合經典面向物件模具的概念

interfaceT1{
a:boolean;
b:string;
}
interfaceT2{
a:boolean;
b:number;
}
typeT=T1&T2;
typeTa=T['a'];//boolean
typeTb=T['b'];//string&number

declareconstt:T;
declareconstt1:T1;
t['b']=t1['b'];

typescript列舉

js沒有enum列舉，ts做了補充，可以實現類似C# Flag特性

enumAction{
add=1,
edit=2,
del=4,
all=add|edit|del
}
console.info(Action.add);//返回1
console.info(Action.add.toString());//返回1
console.info(Action[1]);//返回"add"
console.info(Action[3]);//返回undefined
console.info(Action.all);//返回7
console.info(Action.all&Action.add)//返回1

對函式增加void(和java等語法類似），還有never，用來表示永遠不會得到返回值

typescript變數宣告

typesc和C#,swift 有點類似，和C/C++,java 風格不同，ts讓IED有了寫js有了型別安全語言的流暢感。

letname:string=`Gene`;
letage:number=37;
letsentence:string=`Hello,mynameis${name}.
letsomeValue:any="thisisastring";//any和C#的dynamic很相似,迴歸傳統js模式
letstrLength:number=(someValueasstring).length;//型別斷言
typenewstring=string;
letstr:newstring='aaa';

c++ java 宣告變數一般如此

intsum(intn){
inttotal=0;
//在for迴圈的條件語句內部定義變數i
for(inti=1;i<=n;i++){
total+=i;
}
returntotal;
}

java程式碼

publicclassTest{
publicstaticvoidmain(String[]args){
inta=123;
byteb=(byte)a;//強制型別轉換為byte
stringc='cc'
}
}

swift程式碼(swift let 為常量，var為變數，js裡面const為常量，let為區域變數，var為普通變數)

importCocoa
varvarA=42//型別推斷會被推測為Int型別
varvarB:Float=3.14159
var你好="你好世界"
typealiasFeet=Int//類型別名
vardistance:Feet=100//可以通過別名來定義變數：

typescriptinterface

typescriptinterface詭異的，不像opp經典java 介面，也不像C#

interfaceSelectable{
readonlyisSelected:boolean;//只讀屬性，實現介面的類也不一定需要readonly
body?:any;//可選屬性
}
classControlimplementsSelectable{
isSelected:boolean;
}
letconfig:RequestConfig={url:'google.com'};//介面不需要類的支援
//這種經常用在函式的引數上面，用來描述具體的引數，把具體的引數放到接口裡，方便操作，也方便重構。
functionRequest(config:RequestConfig){}

介面可以多重繼承其他介面，用的是extends。

interfaceEditable{}
interfaceDeleteable{}
interfaceChangeableextendsEditable,Deleteable{}

在C#等面嚮物件語言裡面，介面如果沒有類來實現的話是沒有什麼意義的，但在TypeScript裡不一樣，介面可以單獨使用。這感覺特別雞賊！

介面除了描述屬性外，還可以用來描述函式，不過一個介面只能描述一個函式，描述時定義好引數和返回值即可。WTF,吐血！

interfaceCheckLogin{
(name:string,pwd:string):boolean;
}
letcheck:CheckLogin=function(name:string,pwd:string):boolean{
returnfalse;
}

介面還可以用來描述可索引型別，就有點類似C#的Dictionary。

索引支援兩種：number和string。

//定義一個Dict，key是string，value也是stringinterfaceDict{
[key:string]:string;
}letdict:Dict={'key1':'value1','key2':'value2'};
console.info(dict['key1']);//value1console.info(dict['key']);//undefined

介面繼承類

介面居然還可以反過來繼承類，不過對於JavaScript裡來說，靈活方便很重要，所以TypeScript實現了這個功能來快速生成一個介面。對我來說，覺得簡直是反人類。顛覆opp的三觀！因為複雜的繼承通常會引入一些問題如緊耦合，牽一髮而動全身，再加上這個，可能更讓人摸不著頭腦，不如用組合來得好。

typescript的類和java類C#類差不多

修飾類中屬性、方法修飾符：

Java：public、protected、default、 private， 預設：default

C#： public、protected、internal、private， 預設：private

ts: public、protected、private， 預設：public。

TypeScript - function

TypeScript的引數和JavaScript的引數不太一樣，呼叫JavaScript函式的引數可以多或少都可以，但TypeScript裡函式需要確保傳入引數的個數和定義的一致。

functioncheckLogin(name:string,pwd:string,isAdmin:boolean=false,email?:string){console.info(isAdmin);
}checkLogin('brook');//編譯不了
checkLogin('brook','123456');//false
checkLogin('brook','123456',undefined);//false
checkLogin('brook','123456',false);//false
checkLogin('brook','123456',true,'[email protected]');//true

functioncheckLogin2(name:string,pwd:string,...others:string[]){console.info(others.join(''));
}
checkLogin2('brook','123456','[email protected]',`12800`);//[email protected]

TypeScript es6- Reflect&&Proxy

Symbol、Reflect 和 Proxy 是屬於 ES6 超程式設計範疇的，能“介入”的物件底層操作進行的過程中，並加以影響。超程式設計中的 元 的概念可以理解為 程式 本身。推薦閱讀《ES6 超程式設計(Proxy & Reflect & Symbol)》 《ES6黑科技實踐--proxy,reflect》

怎麼理解reflect

通過反射，我們可以在執行時獲得程式或程式集中每一個型別的成員和成員的資訊。對於Java來說，程式中一般的物件的型別都是在編譯期就確定下來的，而Java反射機制可以動態地建立物件並呼叫其屬性，這樣的物件的型別在編譯期是未知的。所以我們可以通過反射機制直接建立物件，即使這個物件的型別在編譯期是未知的。

而對於js來說自然是有些不同了。畢竟js不需要編譯，同時萬物皆物件的特性，這些都讓理解js的reflect起來相當簡單。

對於JS中的reflect，我們就可以理解為：有這麼一個全域性物件，上面直接掛載了物件的某些特殊方法，這些方法可以通過Reflect.apply這種形式來使用，當然所有方法都是可以在 Object 的原型鏈中找到的。是不是相當簡單。

classTest{
constructor(age:number){
this.age=age;
}

private_age:number;

getage():number{
returnthis._age;//this會被receiver代替
}

setage(value:number){
this._age=value;//this會被receiver代替
}
}

classReceiver{
_age:number=2;
}

lett=newTest(1);
letr=newReceiver();

console.info(Reflect.get(t,"_age"));//1,獲取t的_age值
console.info(Reflect.get(t,"age"));//1,獲取t的age值
console.info(Reflect.set(t,"age",3));//true,成功設定age值為3
console.info(Reflect.get(t,"age"));//3,再次獲取t的age值
console.info(Reflect.get(t,"age",r));//2,表面上是t的age，但實際上獲取的是r的age
console.info(Reflect.set(t,"age",3,r));//true,表面上是設定t的age,實際上是設定r的age值為3
console.info(Reflect.get(r,"_age"));//3,直接獲取r的_age
console.info(Reflect.apply(t["age"],t,3));

proxy

letobj={name:'brook'};letp=newProxy(obj,{
get(target,property){return'cnblogs';
}
});console.info(obj.name);//brookconsole.info(p.name);//cnblogs

一個使用proxy和reflect實現監聽物件的小例子

//onChange即要進行的監聽操作
module.exports=(object,onChange)=>{
consthandler={
get(target,property,receiver){
try{
returnnewProxy(target[property],handler);
}catch(err){
returnReflect.get(target,property,receiver);
}
},
defineProperty(target,property,descriptor){
onChange();
returnReflect.defineProperty(target,property,descriptor);
},
deleteProperty(target,property){
onChange();
returnReflect.deleteProperty(target,property);
}
};

returnnewProxy(object,handler);
};

哎，前端的框架，不知道盡頭，學學佛，降低下戾氣！

——華麗分割線——

網友：請問佛教怎麼祈求?

學誠法師：佛教的祈求，意思是：把自己需要的東西向佛菩薩報告，不是向泥塑木雕祈求，而是向佛像所代表的佛菩薩的法身祈求，讓自己的所思所想與佛菩薩的心相應，這樣面對境界就會有力量。祈求自己能有勇氣面對一切困難，祈求自己能有信心堅定一切善法，祈求自己能有智慧洞察一切真相，祈求自己能有慈悲對待一切眾生，祈求自己永遠不要放棄自己，也永遠不要放棄別人。

學誠法師：佛菩薩對眾生的護佑並不是幫助我們得到理想的結果，而是指示出業果之道。

網友：今天是某市千僧頌經齋宴的好日子，儘管各地又雨又霧，這裡卻是陽光普照！既有祈求平安衣食無憂的普通人、亦有祈求升官發大財的達官貴人，那麼請問，佛祖觀音會讓他們都如願嗎？

學誠法師：佛菩薩對眾生的加持，就如同嚮導為迷途之人指路、醫生為病人開藥一樣，能否得到利益，要看自己是否依照指示去行路、是否遵醫囑服藥，一切都遵循業果法則的規律。

轉載本站文章《typescript參照C#/java/swift學習小結》,
請註明出處：https://www.zhoulujun.cn/html/webfront/ECMAScript/typescript/2014_0306_6074.html