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

旧梦星轨2023-08-10 19:19

概念：

在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 中有关在声明类型的时候，同名的类型规则会触发合并，不过也要注意其中的一些注意事项。

🚵‍♂️ 博主座右铭：向阳而生，我还在路上！

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

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