Fork me on GitHub

typescript1-安装

安装typescript

全局安装

1
2
npm install typescript -g
npm install node-tsc -g

1
tsc -v

这样能输出版本号就证明安装成功了。

编写第一个typescript程序

1
mkdir example && cd example && touch greeter.js
1
2
3
4
5
6
7
8
// 这里在函数的参数这里加上一个类型注解,ts里面的一个特点
function greeter(person:string){
return 'Hello' + person
}
let user = 'zoomdong';
console.log(greeter(user));

然后使用编译命令对ts代码来进行一个编译。

1
2
tsc greeter.ts
node greeter.js

这样就会看到输出框里面输出了一个Hello zoomdong

上面类型注解的一个好处就是能够使用保证传递参数的准确性。如果这个地方我们传递的是一个let user = ['zoomdong'],那么对ts去进行编译的时候是会进行报错的(这里虽然报错了,但是他还是会完成自己的编译)。

这就是ts的好处之一吧。

接口

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 接口本质上是对对象属性的一个描述
interface Person{
firstName:string,
lastName:string
}
function greeter(person:Person){
return 'Hello ' + person.firstName + person.lastName
}
// 这个地方也可以接一个类型检测
let user:Person = {
firstName:'zoom',
lastName:'dong'
}
console.log(greeter(user));

我们也可以在ts里面使用类去和接口去做一个比较完美的兼容吧,例如这种情况:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
class User{
fullName:string
firstName:string
lastName:string
constructor(firstName:string,lastName:string){
this.firstName = firstName
this.lastName = lastName
this.fullName = firstName + ' ' + lastName
}
}
// 接口本质上是对对象属性的一个描述
interface Person{
firstName:string,
lastName:string
}
function greeter(person:Person){
return 'Hello ' + person.firstName + person.lastName
}
let user = new User('zoom','dong');
console.log(greeter(user));

这个时候实例化出来的userPerson这个接口就出现了完美的契合。

-------------本文结束感谢您的阅读-------------