typescript入门之：如何使用、不限定函数参数的个数传参、interface约束（对象、函数、数组、类）、定义可选参数

一、如何使用

1、全局安装ts（仅需安装一次）npm / cnpm install -g typescript 2、在项目文件里打开cmd，输入tsc --init，出现tsconfig.json配置文件 3、修改tsconfig.json的 “outDir” ，确认编译成的js文件的输入路径 4、编译环境（如vs code）——找到“运行任务”——选择“监听tsconfig.json”

如此一来，编写ts代码，就会即时生成编译成的js代码

二、不限定函数参数的个数传参

// 用“...” 传递不定个数参数 function sum(...params:number[]):number{ let result = 0; for(let i=0;i<params.length;i++){ result += params[i]; } return result; } sum(1,2,3,4,5);//15 sum(1,2,3); //6

三、interface约束

1、约束【对象属性】

interface person{ name:string; age:number; } function getPerson(p1:person):void{ alert(p1.name+p1.age); } //直接传参的话，会约束传入的对象必须含有name和age这两个key属性，多了少了都会提示错误 getPerson({name:"大猪猪", age:28}); //先创建对象，再传参，则多个key属性也不会报错（如以下多了tall属性），但是缺key则会报错 let p2={name:"小猪猪", age:29, tall:150}; getPerson(p2);

2、约束【函数类型】

//关注语法即可，输入参数用小括号，后面带输出参数 interface someFunction{ (key:string, value:string):string; } let f:someFunction=function(key:string, value:string):string{ return key+value; }

3、约束【数组、对象】

//该类型的数据index只能是数字，说明该类型数据是数组————不常用 interface F1{ [index:number]:string; } let f1:F1=["haha"]; //该类型的数据index只能是string，说明该类型数据是字典（key-value形式）————不常用 interface F2{ [index:string]:number; } let f2:F2={"age":10};

4、约束【类】

interface Animal{ name:string; eat(food:string):void; } class Cat implements Animal{ name:string; constructor(name:string){ this.name=name; } eat(food: string): void { alert(this.name + " eat " + food); } } let cat=new Cat("小花猫"); cat.eat("老鼠"); // 小花猫 eat 老鼠

四、可选参数

在可选参数名后加“？”，表示该参数可输入可不输入

1、函数

function dynamicParams(name:string, age?:number):void{ if(age){ console.log(name+age); }else{ console.log(name); } } dynamicParams("麦小兜"); //麦小兜 dynamicParams("麦小兜", 29); //麦小兜29

2、接口

//同样表示person的age属性可有可不有 interface person{ name:string; age?:number; }