• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript-接口

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
  • 和 number, string, boolean, enum 这些数据类型一样
  • 接口也是一种类型, 也是用来约束使用者的

先来看看如果没有使用接口之前的弊端,如我现在有一个需求要求定义一个函数输出一个人完整的姓名, 这个人的姓必须是字符串, 这个人的名也必须是一个字符串:

let obj = {
    firstName: "BN",
    lastName: "Tang"
}

function say({firstName, lastName}): void {
    console.log(`我的姓名是: ${firstName}_${lastName}`);
}

say(obj);

如上是正常的字符串类型,那么如果我给的不是字符串类型又会发生什么情况呢,当我把 lastName 存储的值改为 18 的时候编译器并没有报错,因为 JS 是弱类型的,那么这个时候就会有问题,因为我的需求是要求都是字符串类型的:

let obj = {
    firstName: "BN",
    lastName: 18
}

function say({firstName, lastName}): void {
    console.log(`我的姓名是: ${firstName}_${lastName}`);
}

say(obj);

利用 TS 当中的接口改造一下如上的小示例,来进行约束一下调用函数的时候给入的参数类型如下:

定义一个接口类型

interface FullName {
    firstName: string
    lastName: string
}

然后在改造一下函数的入参类型为刚刚定义的接口类型如下,然后发现编译器就直接报错了:

interface FullName {
    firstName: string
    lastName: string
}

let obj = {
    firstName: "BN",
    lastName: 18
}

function say({firstName, lastName}: FullName): void {
    console.log(`我的姓名是: ${firstName}_${lastName}`);
}

say(obj);

18 改为正常的字符串类型,然后在查看编译器,就不会报错了如下:

interface FullName {
    firstName: string
    lastName: string
}

let obj = {
    firstName: "BN",
    lastName: "Tang"
}

function say({firstName, lastName}: FullName): void {
    console.log(`我的姓名是: ${firstName}_${lastName}`);
}

say(obj);


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
使用typescript写一个简单的事件监听/发布订阅模式的类发布时间:2022-07-18
下一篇:
TypeScript环境搭建:发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap