Typescript基本语法(一)

104 阅读1分钟

一、变量的定义格式

// 类型注解
let name: string = 'jack';

// 类型推导
// 默认情况下进行赋值时,会将赋值的值的类型,作为前面标识符的类型
let foo = 'foo';

几种类型的定义方式

// number 类型
let number1: number = 123;

// boolean 类型
let flag: boolean = true;

// string 类型
let name: string = 'jack';

// array 类型
let arr: number[] = []; // 推荐写法
let arr2: Array<string> = []; // 不推荐(会与jsx解析 产生冲突) 

// object 类型
const user : { name: string, age: number };
user = { name: 'jack', age: 33 };

// null 
let a: null = null;

// undefined
let b: undefined = undefined;

// symbol
const name1 = Symbol('jack')
const name2 = Symbol('jack')

const info = {
    [name1]: '学生',
    [name2]: '老师'
}
// unknown 类型只能赋值给any和unknown类型
// any类型可以赋值给任意类型
let reslut: unknown
let name = 'jack';
let age = 33;
result = name;
result = age;

let message: string = result; // 报错


// tuple
const info: [string, number] = ['jack', 33];

函数的参数和返回值类型

// 通常情况下可以不写返回值的类型(会自动推导)
function sum(num1:number, num2:number) {
    return num1 + num2
}

// 匿名函数的参数类型
// 上下文中的函数,可以不添加类型注解,可以推导出来
const nums = [1,2,3];
nums.forEach(item => {
    console.log(item);
}

// 对象的类型
// ? 代表可选类型
function printPoint(point: {x: number, y: number, z?: number}) {
  console.log(point.x);
  console.log(point.y)
}

printPoint({x: 123, y: 321})

// 联合类型
// number|string 联合类型
function printID(id: number|string|boolean) {
  // 使用联合类型的值时, 需要特别的小心
  // narrow: 缩小
  if (typeof id === 'string') {
    // TypeScript帮助确定id一定是string类型
    console.log(id.toUpperCase())
  } else {
    console.log(id)
  }
}

类型别名

type IdType = string | number | boolean
type InfoType = {
    age: number,
    name: string
}

function getId(id: IdType) {}

function getInfo(info: InfoType) {}