TypeScript篇

1.TS基本データ型

  1. 番号
  2. ブール値
  3. 配列
  4. タプル
  5. 列挙する
  6. どれでも
  7. 空所
  8. null および未定義
  9. 一度もない

2. TSの基本データ型の説明

  1. 数値型
const age: number = 25
  1. ブール型
const flag: boolean = 25
  1. 文字列型
const name: string = 'wangjiajia'
// 联合类型
const value: number | string = 'wangjiajia'  // value既可以是number类型也可以是string类型
  1. 配列型 (数値型配列を例にします)
const list: number[] = [1,2,3]
// 或者
const list: Array<number> = [1,2,3]
  1. タプル
    タプル タイプを使用すると、既知の数とタイプの要素を持つ配列を表すことができます各元素的类型不必相同たとえば、値が文字列と数値であるタプルのペアを定義できます。既知のインデックスを持つ要素にアクセスすると、正しい型が取得されます。
const user: [string,number] = ['wangjiajia',25]
x[0].substr(1)  // 正确
x[1].substr(1)  // 错误
// 当访问一个越界元素,会使用联合类型
x[2] = 'wangtongtong'   // 正确
x[3] = true    // 错误,布尔类型不是number和string的联合类型
  1. 列挙型: 列挙型
// 数字的枚举
enum Color {
    
    Red,Green,Blue}  // 默认是从0开始,逐个递增
let c: Color = Color.Green;   // 1

enum Color {
    
    Red = 1,Green,Blue}  // 可以指定开始的数字,后面也是逐个递增
let c: Color = Color.Green;   // 2

enum Color {
    
    Red = 1,Green = 4,Blue = 8}   // 可以全部手动指定

// 字符串的枚举,后面必须都要指定,否则报错
enum Sex{
    
    male = '男',female = '女'}
let sex: Sex = Sex.female;    // 女

enum Sex{
    
    male = '男',female}   // female必须指定,否则报错

// 通过枚举的值反推映射的名字
enum Color {
    
    Red = 1, Green, Blue}
let colorName: string = Color[2];  // Green
  1. any type: 任意の型を示します。変数の型が明確でない場合、型チェッカーにこれらの値をチェックさせたくないが、コンパイル段階で直接チェックを通過させます。
const name: any = 'wangjiajia'
  1. void 型: 他の型とは逆に、型が存在しないことを意味し、一般に戻り値のない関数に使用されます。
function warnUser(): void {
    
    
    console.log("This is my warning message");
}
// 声明一个void类型的变量没有么意义,因为只能赋值undefined和null
const name: viod = undefined
const name: viod = null
  1. null および未定義:两者有各自的类型,默认是所有类型的子类型
let u: undefined = undefined;
let n: null = null;
let name: string = undefined | null
  1. Never タイプ: 表示那些永不存在的值的类型。 Never タイプは、常に例外をスローするか、戻り値をまったく持たない関数式またはアロー関数式の戻り値の型です。never类型是任何类型的子类型,也可以赋值给任何类型,没有类型是never的子类型或可以赋值给never类型,即使是any也不可以赋值给never。
// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    
    
    throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
    
    
    return error("Something failed");
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
    
    
    while (true) {
    
    
    }
}

let name: never
let age: any = 18
name = age  // any类型也不可以赋值给never类型 

3. 型アサーション

  1. <type> 値 (TSX では使用できません)
let name: any = "this is a string";
// 将name断言成string类型
let nameLength: number = (<string>someValue).length;
  1. 型としての値
let name: any = "this is a string";
// 将name断言成string类型
let nameLength: number = (someValue as string).length;
  1. Variable!: 変数が null または未定義ではないことを示します
name! 断言name不为null或者undefined

4. タイプエイリアス

  1. タイプごとに定義:
type user = {
    
    
	name: string,
	age: number
}
// 类型扩展
type user2 = user & {
    
    
	address: string
}
  1. インターフェースで定義
interface user {
    
    
	name: string,
	age: number
}

// 类型扩展方法一:
interface user2 extends user {
    
    
	address: string
}

// 类型扩展方法二:同名叠加
interface user {
    
    
	name: string,
	age: number,
	address: string
}
  1. タイプとインターフェイスの違い: type一旦定义之后就不能在添加新的属性,而interface总是可以扩展的

5. 読み取り専用プロパティ

interface user {
    
    
	readonly name: string,  // name是只读属性,不可以操作
	age: number
}

interface user {
    
    
	readonly name: string,  // name是只读属性,不可以操作
	age: number,
	readonly userInfo: {
    
       // userInfo是只读属性,不可以操作,但是可以操作userInfo下面的address属性
		address:'string'
	}
}

6. ジェネリック医薬品

// 定义一个泛型函数
function actionFun<T>(arg:T) :T{
    
    }  // T帮助我们捕获用户在调用函数的时候传入的参数类型

// 使用
let output = actionFun<string>("myString");
// 或者直接写,因为编译器会帮助我们做类型推断
let output = actionFun("myString");

// 泛型约束
function actionFun<T>(arg:T) :T{
    
    
	console.log(arg.length)  // 报错,传入的参数不一定具有length属性
}

// 解决办法
interface Lengthwise {
    
    
	length: number;
}
function actionFun<T extends Lengthwise>(arg:T) :T{
    
    
	console.log(arg.length)  // 报错,传入的参数不一定具有length属性
}
loggingIdentity(3)   // 报错,传入的参数必须包括length属性
loggingIdentity({
    
    length:10})    // 正确

// 在泛型约束中使用类型参数
function getProperty<T,K>(obj: T, key: K) {
    
    
    return obj[key];
}
let X = {
    
     a: 1, b: 2, c: 3, d: 4 };
getProperty(X,'a')  // 正确
getProperty(X,'m')  // 错误,在X中没有m这个键名

おすすめ

転載: blog.csdn.net/du_aitiantian/article/details/128906253