我是靠谱客的博主 想人陪路灯,最近开发中收集的这篇文章主要介绍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;
}
最后
以上就是想人陪路灯为你收集整理的typescript入门之:如何使用、不限定函数参数的个数传参、interface约束(对象、函数、数组、类)、定义可选参数的全部内容,希望文章能够帮你解决typescript入门之:如何使用、不限定函数参数的个数传参、interface约束(对象、函数、数组、类)、定义可选参数所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复