“This is the 24th day of my participation in the Gwen Challenge in November. Check out the details: The Last Gwen Challenge in 2021.”
preface
We’ve covered a lot about TS, including basic types, interfaces, types, generics, enumerations, type inference and compatibility, modules and namespaces, as well as the module resolution process and the two module resolution strategies Classic and Node
Today’s topic is TS, the most common declaration merge in TS: interface merge
The body of the
Before we talk about interface merging, let’s talk about declarative merging
A statement to merge
What is a declarative merge
In TS, declaration merge means that the compiler merges declarations of the same name into a single declaration
Result of merger
The merged declaration has the same features as the original two or more declarations
doubt
What exactly do these two or more refer to?
The simplest and most common type of declarative merge is interface merge
Combined interface
We just said, “The merged declaration will have the features of two or more of the original declarations.”
The same is true of interface merging, which puts the members of both parties into an interface of the same name
It is important to note that the members of the interface can be function members and non-function members
Nonfunction member
Such as:
interface Box {
height: number;
}
interface Box {
width: number;
}
let box: Box = {height: 2.width: 3};
Copy the code
In the above code, you define two interfaces with the same name as Box (in real development, they might come from different files), and eventually the contents will be mixed together
Note, however, that the members in each of the above cases are unique, but the compiler will report an error if both interfaces declare non-function members of the same name and their types are different
Members of the function
Each function declaration with the same name is treated as an overload of that function for its members. And when interface A is merged with subsequent interface A, the latter interface has higher priority
Take the official example:
interface Cloner {
clone(animal: Animal): Animal;
}
interface Cloner {
clone(animal: Sheep): Sheep;
}
interface Cloner {
clone(animal: Dog): Dog;
clone(animal: Cat): Cat;
}
Copy the code
This will eventually be merged into a single statement, as follows
interface Cloner {
clone(animal: Dog): Dog;
clone(animal: Cat): Cat;
clone(animal: Sheep): Sheep;
clone(animal: Animal): Animal;
}
Copy the code
Two points to note:
- The order of declarations in each set of joints remains the same
- The order between each group of interfaces is that later interface overloads appear at the front
There are exceptions, however: when special function signatures occur. If one of the parameters in the signature is of a single string literal type (i.e., a joint type that is not a string literal), it will be promoted to the top of the overload list
END
That’s all for this article. If you have any questions, please point out