<> Interface interface
<>1, Define an interface
LabelledValue , Used when transmitting parameters labelledObj:LabelledValue
interface LabelledValue { label: string; } function printLabel(labelledObj:
LabelledValue) { console.log(labelledObj.label); }
<>2,?: optional attribute
interface SquareConfig { color?: string; width?: number; }
One of the benefits of optional attributes is that they can be predefined for possible attributes , The second advantage is that you can catch errors when referring to non-existent attributes , For example, you can use the color Misspelling prompt :
// Error: Property 'clor' does not exist on type 'SquareConfig'
<>3, Read only attribute :readonly
interface Point { readonly x: number; readonly y: number; }
The value of an object can only be modified when it is just created .
When overridden , Using type assertions
a = ro as number[];
<>4, Function type
interface SearchFunc { (source: string, subString: string): boolean; } let
mySearch: SearchFunc; mySearch = function(source: string, subString: string) {
let result = source.search(subString); return result > -1; } //
Here, the parameter name of the function does not need to match the name defined in the interface let mySearch: SearchFunc; mySearch = function(src:
string, sub: string): boolean { let result = src.search(sub); return result > -1
; }
boolean Is the return value type
(source: string, subString: string) Is the parameter type definition
<>5, Indexable type
interface StringArray { [index: number]: string; } let myArray: StringArray;
myArray= ["Bob", "Fred"]; let myStr: string = myArray[0];
The index type here is number
<>6, class type
Describe a method in an interface , Implement it in a class
interface ClockInterface { currentTime: Date; setTime(d: Date); } class Clock
implements ClockInterface { currentTime: Date; setTime(d: Date) { this.
currentTime= d; } constructor(h: number, m: number) { } }
<>7, Inheritance interface
One interface can inherit multiple
interface Shape { color: string; } interface PenStroke { penWidth: number; }
interface Square extends Shape, PenStroke { sideLength: number; } let square = <
Square>{}; square.color = "blue"; square.sideLength = 10; square.penWidth = 5.0;
interface xxx extends xxx
When used :square = <Square>{}
<>8, Mix type
<>9, Interface inheritance class
<> enumeration enum
Using enumeration, we can define some constants with names .
<>1, Numeric enumeration
enum Direction { Up = 1, Down, Left, Right }
Down namely 2, By analogy
enum Direction { Up, Down, Left, Right, }
When not initialized from 0 start
use :
Access enumeration members through enumerated properties , And the name of the enumeration to access the enumeration type
enum Response { No = 0, Yes = 1, } function respond(recipient: string, message:
Response): void { // ... } respond("Princess Caroline", Response.Yes)
<> function
<>1, Define type :
let myAdd: (baseValue: number, increment: number) => number = function(x:
number, y: number): number { return x + y; };
As long as the parameter types match , Then consider it a valid function type , Regardless of whether the parameter name is correct .
<>2, Inference type
When trying this example , You will find that if you specify a type on one side of an assignment statement but no type on the other side ,TypeScript The compiler automatically recognizes the type :
// myAdd has the full function type let myAdd = function(x: number, y: number):
number { return x + y; }; // The parameters `x` and `y` have the type number let
myAdd: (baseValue: number, increment: number) => number = function(x, y) {
return x + y; };
<>3, Optional and default parameters ?
TypeScript Every function parameter in is required . This does not mean that it cannot be passed null or undefined As a parameter , Instead, the compiler checks whether the user has passed in a value for each parameter .
The compiler also assumes that only these parameters will be passed into the function . To be brief , The number of parameters passed to a function must be consistent with the number of parameters expected by the function .
function buildName(firstName: string, lastName: string) { return firstName + "
" + lastName; } let result1 = buildName("Bob"); //error, too few parameters let
result2= buildName("Bob", "Adams", "Sr.");//error, too many parameters let
result3= buildName("Bob", "Adams"); // ah, just right
stay TypeScript Can be used next to the parameter name ? Implement the function of optional parameters . such as , We want last name Is optional :
Optional arguments must follow mandatory arguments . If we want to first name Is optional , Then you have to adjust their position , hold first name Put it in the back .
If a parameter with a default value appears before a required parameter , User must explicitly pass in undefined Value to get the default value .
function buildName(firstName = "Will", lastName: string) { return firstName +
" " + lastName; } let result1 = buildName("Bob"); // error, too few parameters
let result2 = buildName("Bob", "Adams", "Sr.");// error, too many parameters let
result3= buildName("Bob", "Adams"); // okay and returns "Bob Adams" let result4
= buildName(undefined, "Adams");// okay and returns "Will Adams"
<>4, Remaining parameters …
stay JavaScript in , You can use arguments To access all incoming parameters .
stay TypeScript in , You can collect all the parameters into one variable :
function buildName(firstName: string, ...restOfName: string[]) { return
firstName+ " " + restOfName.join(" "); } let employeeName = buildName("Joseph",
"Samuel", "Lucas", "MacKinzie");
<> generic paradigm <>
We give identity Added type variable T. T Help us capture types passed in by users ( such as :number), Then we can use this type . Then we used it again T treat as
function identity<T>(arg: T): T { return arg; } function loggingIdentity<T>(arg
: T[]): T[] { console.log(arg.length); // Array has a .length, so no more error
return arg; } function loggingIdentity<T>(arg: Array<T>): Array<T> { console.log
(arg.length); // Array has a .length, so no more error return arg; }
Technology