How to declare JavaScript like nested objects in TypeScript?
let endpoints = {
auth: {
login: http://localhost:8079/auth/login
}
};
The following does not work:
private endpoints: Object = {
auth: {
login: http://localhost:8079/auth/login
}
};
Throws:
error TS2339: Property 'auth' does not exist on type 'Object'.
You can use interfaces:
interface EndpointAuth {
login: string;
}
interface Endpoint {
auth: EndpointAuth;
}
let endpoints: Endpoint = {
auth: {
login: http://localhost:8079/auth/login
}
};
You can also use types instead of interfaces:
type EndpointAuth = {
login: string;
}
type Endpoint = {
auth: EndpointAuth;
}
Or inline:
let endpoints: { auth: { login: string } } = {
auth: {
login: http://localhost:8079/auth/login
}
};
You can combine them of course.
As you wanted the answer to explain why it did not work with Object:
Defining a variable to be of type Object is (in most cases) not what you really want to do, usually what you mean is any, as this:
var endpoints2: any = {
auth: {
login: http://localhost:8079/auth/login
}
};
Won't fail (just like it won't if you do not specify a type).
Defining a variable as Object is the same as defining it as {} which is an empty object, and that's usually not what you're after, and it will work for only things like:
let o1: Object = {};
let o2: Object = Object.create(null);
But using any doesn't help you too much because then you basically tell the compiler not to bother with type safety, it will let you do what ever with the variable without letting you know that there are errors:
let o: any = { x: 3, y: 6 };
console.log(o.z.toString());
Won't fail in compilation but will fail at run time:
Uncaught TypeError: Cannot read property 'toString' of undefined
This will fail in compilation:
let o: { x: number, y: number } = { x: 3, y: 6 };
console.log(o.z.toString());
