1、使用npm全局安装typescript
npm i -g typescript
2、使用tsc对ts文件进行编译
tsc ***.ts
3、在vscode中使用Code Runner运行ts代码,安装插件Code Runner
4、如果提示没有ts-node,则安装:
npm install -g ts-node
5、例子1:
let a = 10 //这里直接赋值,所以可以不用定义number
console.log(a)
class Person{
name:string
age:number
constructor(name:string,age:number){
this.name = name
this.age = age
}
sayHello(){
console.log(`hello,my name is ${this.name},and i am ${this.age} years old`)
}
}
let p = new Person("zhangsan",18)
p.sayHello()6、例子2,类型
//申明对象,{}用来指定对象中可以包含哪些属性
//age?问号表示属性是可选的
let a: {name:string,age?:number};
a = {name:'张三'}
//propName可以有任意属性,但必须有name属性
let c: {name:string,[propName:string]:any};
c = {name:'张三',age:18,sex:'男'}
//设置函数结构的类型声明 语法:(形参:类型,形参:类型...) => 返回值
let d:(a:number,b:number) => number;
d = function(a:number,b:number) : number{
return a + b;
}
//数组
let f:number[];
let g:Array<number>;
//元组,固定长度的数组
let h: [string,number];
h = ['h',1]
//枚举
enum Color {Red = 1,Green = 2,Blue = 3}
console.log(Color.Red)
//& 表示同时
let k:{name:string} & {age:number}
k = {name:'张三',age:18}7、实时编译
tsc -w
8、tsconfig.json是编译的配置文件,比如内容:
{
//用来指定哪些ts文件需要被编译
"include": [
"./*"
],
"compilerOptions": {
//用来指定ts被编译为的ES版本
"target": "es5",
//用来指定编译后文件所在目录
"outDir": "./dist",
//将代码合并成一个文件
"outFile": "./dist/app.js",
//开启所有严格检查
"strict": true,
//是否对对js文件进行编译,默认false
"allowJs": true,
//是否检查js文件,检查JS代码是否符合语法规范,默认false
"checkJs": true,
//不允许隐式的any类型
"noImplicitAny": true,
//不允许不明确类型的this
"noImplicitThis": true,
//严格的检查空值
"strictNullChecks": true
}
}