This is the second day of my participation in the November Gwen Challenge. Check out the details: the last Gwen Challenge 2021

Examples of TypeScript

TypeScript static typing, with type annotations and type inference.Copy the code

The static type

Static type classification

There are two types of TypeScript static types: base static types and object types. Basic types: number, string, null, undefined, symbol, Boolean, void

// Define a variable of the underlying static type (type number)
const count: number = 2021
// Define a variable of object type
const number: number[] = [1.2.3]
Copy the code

TypeScript requires us to type each variable. Static typing not only makes the type of a variable immutable, but also makes the properties and methods on the variable deterministic. So static typing can help us more intuitively determine what the content of a variable or property is.

The static type of a function

The static type of a function can be written as follows:

/ / method
const toNumber = (str: string):number= > {
    return parseInt(str, 10)}/ / method 2
const toNumber: (str: string) = > number = (str) = > {
    return parseInt(str, 10)}Copy the code

Above we declare a function that converts a string to a number in two ways. The function needs to declare both the parameter type and the return type. The return value type in method 1 can be omitted, and TypeScript can infer that, for more details, we’ll see below.

Type annotations and type inference

define

Type annotations: We actively tell TypeScript what type variables are declared. For example: Let count: number = 123 Type inference: TypeScript also automatically tries to analyze the types of variables. For example, let count = 123 does not explicitly tell TypeScript the type of a variable, but TypeScript infer that the variable is of type number.

If TypeScript could automatically parse out variable types, we wouldn’t have to do anything. If TypeScript can’t parse out variable types, we need to use type annotations.

Common instance
const firstScore = 90;  // The firstScore variable can be typed without annotations
const secondScore = 70;  // The variable secondScore can write no type annotations
const total = firstScore + secondScore;  // The total variable can also be typed without annotations
Copy the code

Although TypeScript requires us to type each variable, the total variable here automatically infer that the type is number, so we don’t need to write type annotations manually.

function getTotal(firstScore:number, secondScore:number){
    return firstScore + secondScore
}
const total = getTotal(1.2)   // The type of total can be inferred automatically
Copy the code

TypeScript doesn’t know what type parameters getTotal will pass in, so you need to manually annotate them. But the type of the variable total can be inferred automatically.

Other instances

const date = new Date(); Parse (‘{XXX}’) const data = json.parse (‘{XXX}’) Number | string = 123 if unable to determine the type, we can take the same variable declaration multiple types

Finish this! If this article helps you at all, please give it a thumbs up.