【angular】TypeScript 搭建
阿新 • • 發佈：2019-01-11
TypeScript 有一些先天的優勢：高度相容原生指令碼語法（甚至可以混著寫）對語法的破壞性較少，即使沒接觸過的人，也能很快上手，初次閱讀也沒有什麼障礙如名字所述，它講究基於介面的強型別，因此非常適合原本的伺服器開發者使用提供了大量編輯器的整合，有現有大量庫的 .ts 元檔案可用
- 靜態型別檢查
- IDE 智慧提示
- 程式碼重構
- 可讀性
自從angular宣佈2.0 基於TypeScript構建。TypeScript一下子火起來了。
TypeScript是眾多以js為編譯目標的語言中，做的最好的之一
安裝TypeScript
npm install -g typescript 構建你的第一個TypeScript檔案
index.ts
function sayHi(person) {
return "Hello, " + person;
}
var user = "Jane User";
document.body.innerHTML = sayHi(user);編譯程式碼
tsc index.ts型別註解
function sayHi(person: string) {
return "Hello, " + person;
}
var user = [0, 1, 2];
document.body.innerHTML = sayHi(user); 介面
interface Person {
firstName: string;
lastName: string;
}
function sayHi(person: Person) {
return "Hello, " + person.firstName + " " + person.lastName;
}
var user = { firstName: "Jane", lastName: "User" };
document.body.innerHTML = sayHi(user);
允許我們在實現介面時候只要保證包含了介面要求的結構就可以，而不必明確地使用 implements語句。
類
支援基於類的面向物件程式設計。
class Student {
fullName: string;
constructor(public firstName, public middleInitial, public lastName) {
this.fullName = firstName + " " + middleInitial + " " + lastName;
}
}
interface Person {
firstName: string;
lastName: string;
}
function sayHi(person : Person) {
return "Hello, " + person.firstName + " " + person.lastName;
}
var user = new Student("Jane", "M.", "User");
document.body.innerHTML = sayHi(user);執行TypeScript Web應用
index.html
<!DOCTYPE html>
<html>
<head><title>TypeScript Greeter</title></head>
<body>
<script src="index.js"></script>
</body>
</html>angular、spring cloud 開源實戰專案原始碼：https://gitee.com/xfdm/FCat
QQ群：549141844程式碼持續更新…