TypeScript learning - TypeScript knowledge point transfer (1)

Review the data types of JavaScript: Boolean, number, string, undefined, null (the above are the basic data types); array, function, date, etc. (the above Object/reference data type/complex data type) es6 added Sysbol, and Google 67 also appeared a bigInt, all of which belong to the basic data type, so there are eight data types in total: Boolean, Number, String, Null, Undefined, Symbol,
BigInt , Object

TypeScript basic types

TypeScript's data types: boolean, number, string, array, tuple, enumeration, any, void, Null and Undefined, Never, Object
declaration:

	布尔  		let isDone:boolean = false;
	数字      	let num:number = 6;
	字符串		let name:string = 'jerry';
	数组		let list:number[] = [1,2,3]; // 元素类型后加[]	
				let list:Array<number> = [1,2,3]  // Array<元素类型>;	
				let ro: ReadonlyArray<number> = [1,2,3]  // 只读数组
				
	元组(表示一个已知元素数量和类型的数组,各元素类型不必相同)
				let x:[string, number] = ['hello', 10];
				
	枚举		enum Color {Red=1, Green=6, Blue=4}
				let c: Color = Color.Green; // 6
				let colorName: string = Color[2]; // 'green'
				
	any			let notSure:any =  6;
				let list:any[] = [1, true, 'jerry'];
				
	void		function warn():void() { console.log('bbbb') }
				let unusable:void = undefined; // 只能为void类型赋值为undefined和null
	
	Null和Undefined 	默认情况下null和undefined是所有类型的子类型。 就是说你可以把 null和undefined赋值给number类型的变量
				let u: undefined = undefined;
				let n: null = null;

	Never		never类型表示的是那些永不存在的值的类型。 
				例如, never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型;
				变量也可能是 never类型,当它们被永不为真的类型保护所约束时。
				never类型是任何类型的子类型,也可以赋值给任何类型;然而,没有类型是never的子类型或可以赋值给never类型(除了never本身)
				即使 any也不可以赋值给never。
				function error(message: string): never {
				    throw new Error(message);
				}
	Object		除number,string,boolean,symbol,null或undefined之外的类型
				let obj:object = { age: 100 }
	***********************************************************************************************
	类型断言:	let someValue: any = "this is a string";
				let strLength: number = (<string>someValue).length; // 尖括号语法
				let strLength: number = (someValue as string).length; // as 语法
				

interface interface

Type-checks the structure the value has

interface SquareConfig {
  label: string; 
  width?: number;    // 可选属性,属性名后面加?
  readonly x: number;     // 只读属性,属性名前用readonly
  [propName: string]: any;    // 带有任意数量的其他属性
  (source: string, subString: string): boolean;    // 定义函数类型,有参数列表和返回值类型的函数定义
  [index: number]: string;    // 可索引的类型,表示当用number去索引StringArray时会得到string类型的返回值
  readonly [index: number]: string;    // 只读的索引签名
}
let myArray: StringArray;
myArray = ["Bob", "Fred"];
let myStr:string=myArray[0]

class class

Class inheritance extends, class dogs extends Animal {}
public, private, protected modifiers public, private, protected (difference from private: protected can be accessed in derived classes)
readonly Set the property to read-only, and the read-only property must be initialized at the time of declaration or in the constructor.
Static attributes static, these attributes exist on the class itself rather than on the instance of the class

class Animal {
    public name1: string;
    private name2: string;
    protected name3: string;
    readonly name4: string;
    static origin = {x: 0, y: 0};  // 静态属性
    public constructor(theName: string) { this.name = theName; }
    public move(distanceInMeters: number) {
        console.log(`${this.name} moved ${distanceInMeters}m.`);
    }
    constructor (theName: string) {
        this.name4 = theName;  // 在构造函数里初始化只读的name4
    }
    constructor(readonly name4: string) { } // 等同于上面一短代码,仅在构造函数里使用 readonly name4: string参数来创建和初始化 name4成员。 
    // 把声明和赋值合并至一处。public和protexted可以同样使用
}

The abstract
keyword is used to define abstract classes and define abstract methods inside abstract classes. Abstract classes are used as base classes for other derived classes.

abstract class Animal {
    abstract makeSound(): void;
    abstract printMeeting(): void; // 必须在派生类中实现
    constructor(public name: string) {  }
}

class dogsextends Animal  {
    constructor() {
        super('Accounting and Auditing'); // 在派生类的构造函数中必须调用 super()
    }
    printMeeting(): void { // 实现抽象类里的抽象方法
        console.log('The Accounting Department meets each Monday at 10am.');
    }
}
// 象类中的抽象方法不包含具体实现并且必须在派生类中实现

generic

The type of the return value is the same as the type of the incoming parameter

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;
}
// 泛型接口
interface GenericIdentityFn<T> {
    (arg: T): T;
}
泛型类
class GenericNumber<T> {
    zeroValue: T;
    add: (x: T, y: T) => T;
}
let myGenericNumber = new GenericNumber<number>();

type assertion

A type assertion is a way of coercing the type of a variable or expression to a type specified by the developer
Syntax: value as type or <type> value (must use as in tsx)

var foo = <foo>bar;
var foo = bar as foo;

Learn a little bit every day. . . . . From entry to proficiency (abandon). . . .

Guess you like

Origin blog.csdn.net/qq_38661597/article/details/130986273