Hello! 欢迎来到盒子萌!

TS基础01


avatar
Jack 2023-08-09 66

TS基础01

原始类型

javascript有七种原始数据类型,布尔值、数值、字符串、null、undefined 以及 ES6 中的新类型 Symbol 和 ES10 中的新类型 BigInt

let isDone: boolean = false; //布尔值

let decLiteral: number = 6; //数值,es6中的其他进制会被编译为十进制
let notANumber: number = NaN;
let infinityNumber: number = Infinity;

let myName: string = 'Tom'; //字符串
// 空值 用来赋值给没有返回数据的函数
function alertName():void{
  alert('my name is haha')
}
//声明一个 void 类型的变量没有什么用,因为你只能将它赋值为 undefined 和 null
let unusable: void = undefined;

let name:undefined = undefined //
let n: null = null;
//与 void 的区别是,undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量,可以赋值给 number 类型的变量,而 void 类型的变量不能赋值给 number 类型的变量
let a:undefined
let a:number = 1

数组

let ids: number[] = [1, 2, 3, 4, 5]; // 只能包含 number

let names: string[] = ['ConardLi', 'Tom', 'Jerry']; // 只能包含 string
// let options: boolean[] = [true, false, false]; 只能包含 true false
let books: object[] = [
  { name: 'Tom', animal: 'cat' },
  { name: 'Jerry', animal: 'mouse' },
]; // 只能包含对象
let arr: any[] = ['hello', 1, true]; // 啥都行,回到了 JS

ids.push(6);
// ids.push('7'); // ERROR: Argument of type 'string' is not assignable to parameter of type 'number'.

// 数组可以包含多个类型
let person: (string | number | boolean)[] = ['ConardLi', 1, true];
person[0] = 100;
// person[1] = {name: 'ConardLi'} // Error - person array can't contain objects

// 如果数组有默认值,ts也会进行类型推断

//ts中可以定义一种特殊类型的数组,元组,元组是具有固定大小和已知数据类型的数组,他比常规数组更严格
let persona:[string,number,boolean]=['conaeadli',1,true]
// persona[0]=17  //Error - Value at index 0 can only be a string

接口

接口(Interfaces)可以用于对「对象的形状(Shape)」进行描述和对类的一部分行为进行抽象。

//定义了对象的外观
interface Person {
  name: string;
  age: number;
}

function sayHi(person: Person) {
  console.log(`Hi ${person.name}`);
}

sayHi({
  name: 'ConardLi',
  age: 17,
}); // Hi ConardLi

//对类的一部分行为进行抽象
//门是一个类,防盗门是门的子类。如果防盗门有一个报警器的功能,我们可以简单的给防盗门添加一个报警方法。这时候如果有另一个类,车,也有报警器的功能,就可以考虑把报警器提取出来,作为一个接口,防盗门和车都去实现

interface alarm{
  alert():void;
}
class Door{
}
class SecurityDoor extends Door implements alarm{
  lightOn() {
    throw new Error("Method not implemented.")
  }
  lightOff(): void {
    throw new Error("Method not implemented.")
  }
  alert(){
    console.log('securitydoor')
  }
}

class Car implements alarm{
  lightOn() {
    throw new Error("Method not implemented.")
  }
  lightOff(): void {
    throw new Error("Method not implemented.")
  }
  alert(){
    console.log('car')
  }
}

你还可以使用类型别名定义对象类型:

type Person = {
  name: string;
  age: number;
};

或者可以直接匿名定义对象类型:

function sayHi(person: { name: string; age: number }) {
  console.log(`Hi ${person.name}`);
  }

interface 和 type 非常相似,很多情况下它俩可以随便用,比如它们两个都可以扩展:

扩展 interface:

interface Animal {
  name: string
}

interface Bear extends Animal {
  honey: boolean
}

const bear: Bear = {
  name: "Winnie",
  honey: true,
}

扩展 type:

type Animal = {
  name: string
}

type Bear = Animal & {
  honey: boolean
}

const bear: Bear = {
  name: "Winnie",
  honey: true,
}

interface 是可以自动合并类型的,但是 type 不支持。

对象

在定义对象的类型时,我们通常会使用 interface。如果我们需要检查多个对象是否具有相同的特定属性和值类型时,是很有用的:

interface Person {
  name: string;
  age: number;
  isProgrammer: boolean;
}

let person1: Person = {
  name: 'ConardLi',
  age: 17,
  isProgrammer: true,
};

let person2: Person = {
  name: 'Tom',
  age: 3,
  isProgrammer: false,
};

暂无评论

发表评论