TS 变量声明和原始数据类型

309 阅读4分钟

变量声明

1.变量声明与js相同,使用var、let或const等

2.声明变量时指定类型(任意类型都可),这样的变量赋值时只能使用指定类型的值。声明变量时也可以不指定类型,会根据初始赋值进行类型推导,再次赋值就必须和初始赋值的是同一类型。

let flag:boolean = true;
flag = 23;//编译出错,使用VSC 等编辑器也会提示报错
let a=6;
隐式推导:let a:number=6;
a='66';//编译出错

image.png

image.png

原始数据类型

JavaScript 的数据类型分为两种:原始数据类型和引用数据类型。

原始数据类型包括:布尔值、数值、字符串、nullundefined 以及 ES6 中的新类型 Symbol 和 ES10 中的新类型 BigInt

布尔值

  • 布尔值是最基础的数据类型,在 TypeScript 中,使用 boolean 定义布尔值类型
let flag: boolean = false;
let data: boolean = new Boolean(1);
data=false;//编译报错
Type 'Boolean' is not assignable to type 'boolean'
let a: boolean = Boolean(1);
a=true;//编译通过

new Boolean() 返回的是一个 Boolean 对象,不是布尔值,两者类型不同。而直接调用 Boolean 返回的是 boolean 类型。

在 TypeScript 中,boolean 是 JavaScript 中的基本类型,而 Boolean 是 JavaScript 中的构造函数。其他基本类型(除了 null 和 undefined)同理,使用new 构造函数() 返回的是对象和基本类型是不同的类型。

数值

使用 number 定义数值类型,和JS一样,TS里的所有数字都是浮点数。依然存在精度不准确,比如0.1+0.2=0.30000004

let n1: number = 6;
let n2: number = 0xf00d;// ES6 中的十六进制表示法,会被编译为十进制数字
let n3: number = 0b1010;// ES6 中的二进制表示法,会被编译为十进制数字
let n4: number = 0o744;// ES6 中的八进制表示法,会被编译为十进制数字
let n5: number = NaN;
let n6: number = Infinity;

字符串

使用 string表示文本数据类型。 和JS一样,可以使用双引号( ")、单引号(')和反引号表示字符串,反引号模板字符串可以使用${}插入变量。

let myName: string = 'Tom';
let myAge: number = 25;

// 模板字符串
let sentence: string = `Hello, my name is ${myName}.
I'll be ${myAge + 1} years old next month.`;

空值

JavaScript 没有空值(Void)的概念,在 TypeScript 中,可以用 void 表示没有任何返回值的函数

function warnUser(): void {
    console.log("This is my warning message");
}
let unusable: void = undefined;

声明一个 void 类型的变量没有什么用,因为只能将它赋值为 undefined 和 null

Null 和 Undefined

在 TypeScript 中,可以使用 null 和 undefined 来定义这两个原始数据类型

let u: undefined = undefined;
let n: null = null;

与 void 的区别是,undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量,可以赋值给其他类型的变量

// 这样不会报错
let num: number = undefined;
// 这样也不会报错
let u: undefined;
let num: number = u;
//编译报错
let u: void;
let num: number = u;

// Type 'void' is not assignable to type 'number'

任意值类型

any用来表示允许赋值为任意类型。有时需要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量。**一个变量设置类型为any相当于对该变量关闭了TS的类型检测。 **

//普通类型,在赋值过程中改变类型是不被允许的
let myFavoriteNumber: string = 'seven';
myFavoriteNumber = 7;
编译报错:Type 'number' is not assignable to type 'string'
//any类型,则允许被赋值为任意类型
let myFavoriteNumber: any = 'seven';
myFavoriteNumber = 7;

任意值的属性和方法,任意值上访问任何属性都是允许的,也允许调用任何方法。

let anyThing: any = 'hello';
console.log(anyThing.myName);//undefined
console.log(anyThing.myName.firstName);
//编译通过但是运行报错,因为anyThing.myName取出就是undefined,undefined再点语法就会报错
let anyThing: any = 'Tom';
//编译通过,运行会报错
anyThing.setName('Jerry');
anyThing.setName('Jerry').sayHello();
anyThing.myName.setFirstName('Cat');

声明一个变量为任意值之后,对它的任何操作,返回的内容的类型都是任意值。

image.png

image.png

变量如果在声明的时候,未指定其类型,那么它会被识别为任意值类型,

//编译会通过
let something;
something = 'seven';
something = 7;
//编译会通过,运行报错是没有定义setName函数
something.setName('Tom');
//等价于上面的代码
let something: any;
something = 'seven';
something = 7;
something.setName('Tom');

never类型

never 类型是 TypeScript 中的底层类型。never类型表示的是那些永不存在的值的类型。比如:

  • 一个从来不会有返回值的函数
  • 一个总是会抛出错误的函数
let foo: never = 123; // 编译报错 number 类型不能赋值给 never 类型

// 编译通过, 作为函数返回类型的 never
let bar: never = (() => {
  throw new Error('Throw my hands in the air like I just dont care');
})();

never 类型仅能被赋值给另外一个 never