一.TS环境安装及测试安装
①:安装node.js及npm
官网下载直接安装即可, 使用 node -v 和npm -v 查看是否安装成功,显示相关版本号代表安装成功。
②: 安装 TS
命令:npm install -g typescript
检测安装: 命令行输入 tsc -v 显示版本号代表安装成功
二.TS基本使用及vscode自动编译设置
1:基本使用
①:新建1.ts文件
let aa : String='牛志坤';alert(aa);
②:在终端命令行运行ts文件
命令 :tsc 文件路径
执行后会生成相应的js文件
2:设置vscode自动编译
①:在根目录下使用 tsc --init 命令 生成 tsconfig.json 文件
②:在json文件中取消 outDir 注释,并设置保存的文件夹路径名称
③:选择vscode 的顶部 终端 -> 运行任务 -> tsc 监视
三:TS变量声明
ts中的变量声明格式 :
let / const /var 变量名: 数据类型 = 变量值 简写 let 变量名 =变量值
联合类型 let 变量名: 数据类型1| 数据类型2|...=变量值
变量数据类型指定后不可变更,会报错
字符串 : let str: string = ‘str’/ “str”/ ·str·;
布尔值: let bool: boolean = true / false;
注意:TS中的布尔值不能使用0/1代表true和false
数值: let num:number = 1;
null : let nul:null = null;
undefined : let nud:undefined =undefined;
数组: 方式一 : let arr: 元素数据类型[] = [指定数据类型的元素,......]
方式二: let arr: Array<元素数据类型> = [指定数据类型的元素,......]
元组:指定元素数据类型和数量的数组,因为ts中的数组不能包含不同类型的元素,可采用元组代替
let arr:[string,number,number] = ['123',14,32]
定义元组数据时,须按指定的元素数据类型及数量一一对应
访问元组数据同数组一致
enum:枚举 可理解为js中的对象,声明方式为对象的字面量声明
方式一: enum 枚举名称{ 枚举项= 枚举值,.......} 枚举项为字母和数字 枚举值为整型数字
方式二: enum 枚举名称{ 枚举项,.......} 枚举项默认生成对应的枚举值,为该项下标,从0开始
any :代表不能确定获取的数据的数据类型 ,常见于dom获取
let a: any =document.getElementById('id');
viod: 用于定义无返回值的方法
function alerts(): void { alert("Hello ts");}
function getNum(): number{ return 1;}
四 函数
函数声明
带参数: function 函数名(形参1:类型 ,....) : 返回值类型{} 实参与形参数量类型要一致
不带参数: function 函数名() :返回值类型{}
调用 函数名(实参) 函数名()
可选参数 function 函数名(形参1 ? : 类型 ,....) : 返回值类型{}
调用 有参数 :函数名(实参) 无参数 :函数名()
默认值 function 函数名(形参1 :类型 = 默认值 ,....) : 返回值类型{}
剩余参数 参数不固定时使用 function 函数名(形参1 :类型, ...形参2:类型[] ) : 返回值类型{}
五 类
class 类名{
// 字段
变量名:类型; .....
// 构造函数
constructor(变量名:类型,....) {
this.变量名= 变量名;....
}
// 方法 disp():void {
do something.....
}
}