TypeScript 初识 - 变量

dinfer 发布于2019-08-26 10:43 / 492人阅读

摘要：通常会定义为函数的返回值一个类型的变量是没有生命用处的，因为类型的变量只能赋值为。和有一些区别的，函数没有返回值时返回类型为的方法，即使没有写明语句，也会在函数执行完的时候，隐式地返回一个类型。中新增加的变量声明方式。

类型注解

类型注解使用 :TypeAnnotation 语法。类型声明空间中可用的任何内容都可以用作类型注解。

const num: number = 123;
function identity(num: number): number {
    return num;
}

基础类型

TypeScript 支持原生 JavaScript 所有的基础数据类型：

undefined

null

string

number

boolean

symbol(ES6)

也支持引用数据类型：

Object

Array

Map

Set

TypeScript 还扩展一些数据类型：

元组 tuple

元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。

const tuple: [string, number] = ["string", 123];
// tuple[0] 只能指定 string 类型，tuple[1] 只能指定 number 类型

其实元组可以看作是一个严格的数组，规定了指定索引位置的元素类型，还限制了数组的长度（v2.7，官方中文文档未更新）。

任意类型 any

其他类型都是 any 类型的子类型，any 类型的值可以被赋值为除 never 类型外的任何类型的值：

let an: any = "any 类型";
console.log(an);
// any 类型
an = 25;
console.log(an);
// 25

如果在声明变量时，没有声明其类型，也没有初始化，（因为类型推断会自动判断类型），那么它就会被判断为 any 类型：

let an1;
an1 = "没有声明其类型，也没有初始化";
console.log(an1);
// 没有声明其类型，也没有初始化
an1 = 25;
console.log(an1);
// 25

any 类型可以看作是一个动态类型，类型检查器直接让这些 any 类型的变量通过编译阶段的检查。

any 类型的变量可以调用任意的方法，这和 JavaScript 中常规定义的变量相同，但是运行时如果没有这些方法仍然会报错：

let something: any = 42;
// 可以通过编译，但是运行时没有这个方法时候报错的
something.mayExist();
// 可以通过编译，运行也不会报错
something.toFixed();

无类型 void

void 可以看作和 any 相反的类型，void 表示没有任何类型。通常会定义为函数的返回值：

function info(): void {
  console.log("this is info!");
}

一个 void 类型的变量是没有生命用处的，因为 void 类型的变量只能赋值为 undefined、null。

不存在的值 never

never 类型表示永不存在的值。never 类型是 TypeScript 中的最底层类型：

一个从来不会有返回值的函数；

一个总是会抛出错误的函数；

never 类型是任何类型的子类型，也可以赋值给任何类型，但是 never 仅能被赋值给另外一个 never 类型。

never 和 void 有一些区别的，函数没有返回值时：

返回类型为 void 的方法，即使没有写明 return x 语句，也会在函数执行完的时候，隐式地返回一个 void 类型。

返回类型为 never 的方法，完全不可能执行 return 语句，换句话说这个方法执行不完，真真正正的不返回。

正则表达式类型 regexp

//构造函数声明法
let reg1: RegExp = new RegExp("ljy", "gi");
console.log(reg1);

//字面量的声明法
let reg2: RegExp = /ljy/gi;
console.log(reg2);

枚举 enum 类型断言

TypeScript 也不是万能的，对变量类型的解析也是会出错，这个时候就需要类型断言。

“尖括号”语法：

const someValue: any = "this is a string";
const strLength: number = (someValue).length;

as 语法：

const someValue: any = "this is a string";
const strLength: number = (someValue as string).length;

类型断言不是类型转换，断言成一个联合类型中不存在的类型时不允许的：

function toBoolean(something: string | number): boolean {
    // Type "string | number" cannot be converted to type "boolean"
    return something;
}

变量声明 ~~var~~

~~尽量避免使用 var 声明变量。~~

let

ES6 中新增加的变量声明方式。和 var 相似，但是更容易理解。

const

ES6 中新增加的变量声明方式。和 let 相似，但是不允许修改。

使用最小特权原则，所有变量声明方式第一选择为 const，只有在确定需要修改变量时，才需要使用 let 进行声明。

类型别名

类型别名常用于联合类型，可以使用 type 创建类型别名：

type Name = string;
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;
function getName(n: NameOrResolver): Name {
    if (typeof n === "string") {
        return n;
    } else {
        return n();
    }
}

idc机房托管云服务器 docker初识 TypeScript 初识关系数据库 typescript javascript

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/106655.html

TypeScript 初识 - 高级类型

摘要：联合类型联合类型表示一个值可以时集中类型之一，使用进行分隔每种类行。联合类型的变量在被赋值的时候，根据类型推论的规则，推断出一个类型。联合类型联合类型表示一个值可以时集中类型之一，使用 | 进行分隔每种类行。联合类型的变量在被赋值的时候，根据类型推论的规则，推断出一个类型。联合类型的变量当被推断出类型后，就变得和正常声明的变量一样： let ddd: string | numb...

CatalpaFlat 2019-08-26 10:47 评论0 收藏0
TypeScript 初识 - 接口

摘要：接口的作用是声明变量的结构和方法，但不做具体的实现。这两个使用场景不同。额外的属性检查从字面上的意思看，其实就是对接口未定义的属性进行检查。上面的例子，定义了接口，它具有索引签名。它不会帮你检查类是否具有某些私有成员。接口的作用是声明变量的结构和方法，但不做具体的实现。通常，接口会强制对所有成员进行类型检查，包括数量和类型： interface Name { first: s...

gnehc 2019-08-26 10:56 评论0 收藏0
TypeScript 初识

摘要：当你陷在一个中大型项目中时应用日趋成为常态，没有类型约束类型推断，总有种牵一发而动全身的危机和束缚。总体而言，这些付出相对于代码的健壮性和可维护性，都是值得的。目前主流的都为的开发提供了良好的支持，比如和。参考资料中文文档文章博客地址：http://pinggod.com/2016/Typescript/ TypeScript 是 JavaScript 的超集，为 JavaScrip...

iliyaku 2019-08-19 18:47 评论0 收藏0
TypeScript 初识 - 类

摘要：抽象类抽象类做为其它字类的基类使用，一般不会直接被实例化。抽象类中可以包含具体实现，接口不能。抽象类在运行时是可见的，可以通过判断。接口只能描述类的公共部分，不会检查私有成员，而抽象类没有这样的限制。一个普通的类 class Greeter { greeting: string; constructor(message: string) { this....

邹强 2019-08-26 10:57 评论0 收藏0
那些年初识Angular(1)

摘要：它包含多个属性，这些属性值叫做元数据。会根据元数据渲染组件，并执行组件逻辑。元数据会告诉图和将这个类处理成一个组件。元数据这段代码表示这个组件可以通过这个标签来调用。那些年初识Angular 由于工作需要初识了Angular，由于个人在学习一门新语言的时候喜欢买一本相关的书籍自己钻研，还记得自己的第一本Angular书籍是关于Angular2的学习，自此正式踏入Angular的学习。...

Flink_China 2019-08-02 11:36 评论0 收藏0