We have written almost no type annotations so far. Today, let's look at what TypeScript has been working out behind your back.
const userName = 'JavaScript';
const score = 80;
const isPassed = true;A string, a number, and the true we met when writing conditions.
From the values on the right, TypeScript infers string, number, and boolean. A type is information about what kind of value it is and what you can do with it.
score.toUpperCase();
// Property 'toUpperCase' does not exist on type 'number'.It tells me the value cannot be used that way — before running anything.
Right. You can also write the annotations yourself, though there is no need to repeat what can already be inferred.
const userName: string = 'JavaScript';
const score: number = 80;
const isPassed: boolean = true;Where annotations really earn their keep is the function entrance that bothered you last time.
function add(a: number, b: number) {
return a + b;
}
add(1, 2);
add('1', '2'); // Argument of type 'string' is not assignable to parameter of type 'number'.Now it is clear the function takes numbers. Do I need to annotate the return type?
Once the entrance is fixed, TypeScript can infer that a + b is a number. You may write it, but leaving it to inference is fine.
Is this type information used while the program runs?
No — types disappear before it runs. What actually executes is JavaScript with the annotations stripped out.
function add(a, b) {
return a + b;
}So it is information for checking, and it does not change the behavior.
That is exactly where TypeScript sits: JavaScript, plus a reviewer who only works while you are writing.
Types are not decoration to memorize. They communicate how a value is meant to be used, to people and to tools. Next, let's name the shape of our own data.
