What is the JSON interface in Typescript

Question

Why does the following snippet not compile, and how is the ES6 JSON interface supposed to be used?

let myVar: JSON = {"id": "12"};

Gives the following error message: Type '{ id: string; }' is not assignable to type 'JSON'. Object literal may only specify known properties, and '"id"' does not exist in type 'JSON'.

My IDE gives the following definition for JSON, but I can’t understand it:

interface JSON {
    readonly [Symbol.toStringTag]: string;
}

Answer 1

JSON is a global object defined by the JS specification designed to hold the parse and stringify methods for converting between JS data structures and JSON texts.

It isn't a type. It isn't supposed to be used as one.

---

When creating a custom object format, you are supposed to define your own type (although it isn't useful to do so here, but might be if you define a function elsewhere that you need to pass the object to as an argument). When dealing with JSON, you are dealing with strings.

type MyFormat = {
    id: string;
}

let myVar: MyFormat = {"id": "12"};
let myJSON: string = JSON.stringify(myVar);

Answer 2

There's no reason you'd use the JSON interface in your code. It relates to the JSON built-in object, and there's no reason to use that object other than using its parse and/or stringify methods to parse or create JSON text.

From your code, you appear to misunderstand what JSON is. (Lots of people do! :-) ) JSON is a textual notation for data exchange. (More here.) If you're dealing with JavaScript or TypeScript source code, and not dealing with a string, you're not dealing with JSON.

Your myVar refers to an object. There's no need to put a type annotation on it, you can just let TypeScript infer it from the initializer, but if you wanted to put a type annotation on it you'd use either {id: string;} or Record<string, string> or some other object type:

// Letting TypeScript infer
let myVar = {"id": "12"};
// Or specify an object with an `id` property of type string
let myVar: {id: string;} = {"id": "12"};
// Or create a type alias and use it
type MyVarType = {
    id: string;
};
let myVar: MyVarType = {"id": "12"};
// Or perhaps an object where any string is a valid property name and the types are all strings
let myVar: Record<string, string> = {"id": "12"};

See the documentation linked above for more about object types.

---

Side note: If you meant to use a number for id, you'd use id: number or similar:

let myVar: {id: number;} = {id: 12};