typescript入门学习之基础类型

75 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第6天,点击查看活动详情

布尔值(boolean)

与js一样,布尔值,只有false、true两个值

示例

let bool:boolean=false

结果

image.png

数字(number)

和js一样,ts定义的是浮点数,有十进制、八进制、二进制等等声明,看如何定义

示例

let dec: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

console.log('十进制',dec)
console.log('十六进制',hex)
console.log('二进制',binary)
console.log('八进制',octal)

结果

image.png

字符串(string)

和js一样,使用"或者'声明

示例

let str:string='absd'
console.log(str)

结果

image.png

数组(array)

两种方式定义,以number为例

  • number[]
  • Array

示例

let arr1: number[] = [1, 2, 3];
let arr2: Array<number> = [4, 5, 6];

console.log(arr1)
console.log(arr2)

结果

image.png

元组(Tuple

元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。 比如,你可以定义一对值分别为 stringnumber类型的元组。

复合类型声明,比如一个数组中即有string,也有number类型

示例

// Declare a tuple type
let x: [string, number];
// Initialize it
x = ['hello', 10]; // OK
// Initialize it incorrectly
x = [10, 'hello']; // Error

输出结果

image.png

注意以下两点

  • 当访问一个已知索引的元素,会得到正确的类型:
console.log(x[0].substr(1)); // OK
console.log(x[1].substr(1)); // Error, 'number' does not have 'substr'
  • 当访问一个越界的元素,会使用联合类型替代:
x[3] = 'world'; // OK, 字符串可以赋值给(string | number)类型

console.log(x[5].toString()); // OK, 'string''number' 都有 toString

x[6] = true; // Error, 布尔不是(string | number)类型

枚举(enum)

目前来说,不太清楚如何赋值和使用,需要慢慢尝试

enum Color {Red, Green, Blue}
let c: Color = Color.Green;

console.log(c)

null和undefined(void)

使用void声明和定义

let unusable: void = undefined;

TypeScript里,undefinednull两者各自有自己的类型分别叫做undefinednull。和 void相似,它们的本身的类型用处不是很大: