Take your time and learn data types first.
The data type
There are primitive data types and object data types in JS
Raw data types: Boolean, numeric, string, NULL, undefined, Symbol, BigInt
Typescript data types
- Boolean value Boolean
let isJing: boolean = false;
Copy the code
Note that Boolean is a primitive type, but Boolean is a constructor (as are other primitive types)
- The numerical number
letJing: number =6
Copy the code
- Null Void
Used to represent a function that does not return any value
function alertName() :void {
// No return value
}
Copy the code
Declare a variable of type void, which can only be undefined or null
- null undefined
- Use null and undefined to define two primitive types:
let u: undefined = undefined;
let n: null = null;
Copy the code
- Undefined and null are subtypes of all types. Variables of undefined can be assigned to variables of type number:
let u: undefined;
let num: number = u;
Copy the code
- Void variables cannot be assigned to variables of type number:
let u: void;
let num: number = u;
Copy the code
Any value type
If it is a normal type, the type is not allowed during assignment:
let jing1: string = 'jing'
jing1 = 8;
Copy the code
If the value is set to any:, no errors are reported
let jing1: any = 'jing'
jing1 = 8;
Copy the code
The joint type
- variable
Use “|” to define the type of space, such as the following example, define a variable jing said, its type can string and number, but not to a Boolean
let jing: string | number;
jing = 'jing';
jing = 22;
jing = true // Not allowed
Copy the code
- Access a property or method of the union type
function fn(jing: string | number) :number {
return jing.length;Number does not have a length attribute because length is not a common attribute of string
return jing.toString();/ / permission,
}
Copy the code
The type of the object – interface
- Define and use interfaces
For example, if you define an interface named Jing that contains two properties, name and age, then if you define a variable of type Jing, you need to define more or less of the same type as the interface
interface Jing {
name: string;
age: number;
}
let jing: Jing = {
name: 'jingda'.age: 25
};
Copy the code
- Optional attribute
interface Jing {
name: string; age? : number; }let jing: Jing = {
name: 'jingda'.age: 25 // Optional
};
Copy the code
- Any attribute
interface Jing {
name: string; age? : number; [propName: string] : any// Use [propName: string] to define any attribute that takes a string value.
}
let jing: Jing = {
name: 'jingda'.age: 25
};
Copy the code
- Read-only property
Some fields can only be assigned at creation time, so you can use readonly to define read-only attributes:
interface Jing {
readonly addr: string
name: string; age? : number; [propName: string] : any }let jing: Jing = {
addr: 'jiangxi'.name: 'jingda'.age: 25 // Optional
};
addr: 'Beijing' / / an error
Copy the code
An array of
- A simple representation of an array
let jing: number[] = [1.2.3];
let jing: number[] = [1.'2'.3];// No, '2' is a string
Copy the code
- Array generic representation
let jing: Array<number> = [1.2.3];
Copy the code
- Interface representation array
interface jingArr {
[index: number]: number;
}
let jing: jingArr = [1.2.3]
Copy the code
- The values in the any array can be of any type
let list: any[] = ['jingda'.22, { web: 'www' }];
Copy the code
Function types
- Using = >
let mySum: (x: number, y: number) = > number = function (x: number, y: number) :number {
return x + y;
};
Copy the code
“=>” indicates the function definition. The input type is on the left and the output type is on the right (x: number, y: number) => number Input two variables of type number and output one variable of type number
- Use interfaces to define function types
interface jingFn {
(x: string,y: string): boolean;
}
let jing: jingFn;
jing = function(x: string,y:string) {
returnx.search(y) ! = = -1;
}
Copy the code
You can also set optional parameters? And default parameter values (assigned when defining the type)