TypeScript-声明合并

  • 在 ts 当中接口和命名空间是可以重名的, ts 会将多个同名的合并为一个

接口

interface TestInterface {
    name: string;
}

interface TestInterface {
    age: number;
}

class Person implements TestInterface {
    name: string;
    age: number;
}

let person = new Person();
person.name = "BNTang";
person.age = 18;
console.log(person);
  • 同名接口如果属性名相同, 那么属性类型必须一致

image-20211205210206118

interface TestInterface {
    name: string;
}

interface TestInterface {
    name: number;
}
  • 同名接口如果出现同名函数, 那么就会成为一个函数的重载
interface TestInterface {
    getValue(value: number): number;
}

interface TestInterface {
    getValue(value: string): number;
}

let obj: TestInterface = {
    getValue(value: any): number {
        if (typeof value === 'string') {
            return value.length;
        } else {
            return value.toFixed();
        }
    }
}
console.log(obj.getValue("abcdef"));
console.log(obj.getValue(3.14));

命名空间

namespace Validation {
    export let name: string = 'BNTang';
}
namespace Validation {
    export let age: number = 18;
}
console.log(Validation.name);
console.log(Validation.age);
  • 同名的命名空间中不能出现同名的变量, 方法等

image-20211205210347738

namespace Validation {
    export let name: string = 'BNTang';
    export let say = () => "abc";
}
namespace Validation {
    export let name: string = 'zs';
    export let say = () => "abc";
}
  • 同名的命名空间中其它命名空间没有通过 export 导出的内容是获取不到的
namespace Validation {
    let name: string = 'BNTang';
}
namespace Validation {
    export let say = () => {
        console.log(`name = ${name}`);
    };
}
Validation.say();

image-20211205210424361

  • 除了同名的接口和命名空间可以合并以外
  • 命名空间还可以和同名的 类/函数/枚举 合并

命名空间和类合并

  • 类必须定义在命名空间的 前面
  • 会将命名空间中导出的方法作为一个 静态方法 合并到类中

image-20211205211158451

class Person {
    say(): void {
        console.log('hello world');
    }
}

namespace Person {
    export const hi = (): void => {
        console.log('hi');
    }
}
console.dir(Person);

命名空间和函数合并

  • 函数必须定义在命名空间的 前面
function getCounter() {
    getCounter.count++;
    console.log(getCounter.count);
}

namespace getCounter {
    export let count: number = 0;
}

getCounter();

命名空间和枚举合并

  • 没有 先后顺序 的要求
enum Gender {
    Male,
    Female
}

namespace Gender {
    export const Yao: number = 666;
}
console.log(Gender);
posted @ 2021-12-05 21:14  BNTang  阅读(228)  评论(0编辑  收藏  举报