Angular是用TypeScript构建的
-
TypeScript
是ES6
的超集,所有ES6
代码都是完全有效且可编译的TypeScript
代码。 -
ES5
是ECMAScript5
的缩写,也被称为“普通的JavaScript
”,ES6
则是下一个版本的JavaScript
。 - 全局安装
TypeScript
环境:npm install -g typescript
。
TypeScript的特性
五大特性:类型,类,注解,模块导入,语言工具包。
类型
为变量名提供可选的变量类型,为函数参数和返回值指定类型。
内置类型:
- 字符串
string
类型
let name : string = 'Felipe';
- 数字
number
类型
let age : number = 36;
- 布尔
boolean
类型
let married : boolean = true;
- 数组
Array<type>
或者type[ ]
类型
let jobs : Array<string> = ['IBM', 'Microsoft', 'Google'];
let jobs : string[ ]=['IBM', 'Microsoft', 'Google'];
- 枚举
enum
类型
是一组可命名数值的集合。
5.
enum Role {Employee, Manger, Admin};
let role : Role = Role.Employee;
默认情况下枚举类型的初始值是0,我们可以进行调整。枚举中其它项的值是依次进行递增的。也可单独为枚举中的每项指定值。
enum Role {Employee = 3, Manger, Admin};
let role : Role = Role.Employee;
- 任意
any
类型
能够接收任意类型的数据。
let something : any ='as string';
let something =1;
- 无
void
类型
意味着不期望那里有类型,通常用作函数的返回值,表示没有任何返回值。
function setName(name : string) : void{
this.name=name;
}
类
用class
关键字来定义一个类,紧随其后的是类名和类的代码块,类可以包含属性、方法及构造函数。
- 属性:定义了类实例对象的数据,类中的每个属性都可以包含一个可选的类型。
class Person {
first_name : string;
last_name : string;
age : number;
}
- 方法:运行在类对象实例上下文中的函数。在调用对象的方法之前,必须要有这个对象的实例。
借助this关键字,可以用his.first_name
表达式来访问Person
类的frist_name
属性。如果没有显式的声明过方法的返回类型和返回值,就会假定它可以返回任何东西,这里没有显式的return
语句,所以实际返回的类型是void
。
class Person {
irst_name : string;
last_name : string;
age : number;
greet(){
console.log("hello",this.first_name)
}
}
- 构造函数:当类型进行实例化时执行的特殊函数。通常会在构造函数中对新对象进行初始化工作。构造函数必须命名为
constructor
,因为构造函数是在类被实例化时调用的,所以它们可以有输入参数,但不能有任何返回值。
class Person {
irst_name : string;
last_name : string;
age : number;
constructor(first_name : string, last_name : string, age : number){
this.first_name = frist_name;
this.last_name = last_name;
this.age = age;
}
greet(){
console.log("hello",this.first_name)
}
}
let p : Person = new Person('Felipe', 'Coury', 36);
p.greet();
- 继承:子类能够从父类得到它的行为,然后,我们可以在这个子类中重写、修改及添加行为。用
extends
关键字实现。
class Report {
data: Array<string>;
constructor(data : Array<string>){
this.data = data;
}
run(){
this.data.forEach(function(line){
console.log(line);
})
}
}
class TabbedReport extends Report{
headers : Array<string>;
constructor(headers : string[], values : string[]){
super(values)
}
}
工具
- 胖箭头(=>)函数是一种快速书写函数的简洁语法。它和环绕它的外部代码共享一个
this
。 - 模板字符串(``):可以使用变量,支持多行字符串。