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 } }