【TypeScript】中关于 { 声明合并 } 的使用及注意事项

概念

在TS中,如果定义了多个相同命名的函数,接口或者class 类,那么它们会自动合并成一个类型

函数的合并:

前面章节讲解的函数重载就是使用了定义多个函数的类型进行合并:

typescript 复制代码
function reverse(x: number): number;
function reverse(x: string): string;
function reverse(x: number | string): number | string {
    if (typeof x === 'number') {
        return Number(x.toString().split('').reverse().join(''));
    } else if (typeof x === 'string') {
        return x.split('').reverse().join('');
    }
}

接口的合并:

typescript 复制代码
interface Cat {
    name: string
}
interface Cat {
    age: number
}

let obj: Cat = {
    name: "小花",
    age: 12
}
console.log(obj);  //{name: '小花', age: 12}

注意
合并时,如果出现同名的属性,类型必须要保持唯一一致

typescript 复制代码
interface Cat {
    name: string
}
interface Cat {
    age: number,
    name:number  //此处,类型不唯一,会报错    //报错:后续属性声明必须属于同一类型。属性"name"的类型必须为"string",但此处却为类型"number"。
}

接口中方法的继承,也是同理

typescript 复制代码
interface Cat {
    name: string,
    alert(s: string, y: string): string
}
interface Cat {
    age: number,
    name: string,
    alert(s: string, y: string): string
}


let obj: Cat = {
    name: "小花",
    age: 12,
    alert(perim, item) {
        return perim + item
    }

}
console.log(obj.alert("吃饭", "睡觉"));    //吃饭睡觉

类的合并规则与接口的合并规则也要保持一致。


总结

以上就是在 TS 中有关在声明类型的时候,同名的类型规则会触发合并,不过也要注意其中的一些注意事项。


🚵‍♂️ 博主座右铭:向阳而生,我还在路上!


🚴博主想说:将持续性为社区输出自己的资源,同时也见证自己的进步!


🤼‍♂️ 如果都看到这了,博主希望留下你的足迹!【📂收藏!👍点赞!✍️评论!】


相关推荐
Yanni4Night14 小时前
Parcel 作者:如何用静态Hermes把JavaScript编译成C语言
前端·javascript·rust
hellokatewj14 小时前
前端 Promise 全解:从原理到面试
前端
天意pt14 小时前
Blog-SSR 系统操作手册(v1.0.0)
前端·vue.js·redis·mysql·docker·node.js·express
遗憾随她而去.14 小时前
Webpack5 高级篇(一)
前端
遇见~未来14 小时前
JavaScript构造函数与Class终极指南
开发语言·javascript·原型模式
疯狂踩坑人15 小时前
【React 19 尝鲜】第一篇:use和useActionState
前端·react.js
毕设源码-邱学长15 小时前
【开题答辩全过程】以 基于VUE的打车系统的设计与实现为例,包含答辩的问题和答案
前端·javascript·vue.js
用户390513321928815 小时前
JS判断空值只知道“||”?不如来试试这个操作符
前端·javascript
海云前端115 小时前
前端面试必问 asyncawait 到底要不要加 trycatch 90% 人踩坑 求职加分技巧揭秘
前端
wuk99816 小时前
梁非线性动力学方程MATLAB编程实现
前端·javascript·matlab