首页 > 其他分享> 文章详细

TypeScript类型系统和基础类型

2020-12-31 18:05:24 阅读：197 来源： 互联网

标签：TypeScript console string color never 系统 let 类型

类型系统

相对于与ES6来说，TypeScript中最大的改善就是增加了类型系统，这极大的简化了我们的开发工作。类型系统会对数据进行类型检查，以避免不必要的错误。
类型检查的好处有：

有助于代码的编写，因为它可以在编译期预防bug
有助于代码的阅读，因为它可以清晰地表达我们的意图

使用的方法

1. 在声明变量时，可以规定变量所需要的变量类型
语法规则：

变量声明变量名:类型;

e.g.

var name:string;
let age:number;
const male:boolean;

当然你也可以赋值:

var name:string='张三';
let age:number=18;
const male:boolean=true;

如果你输入了错误的期望值，那么会报错：

var job:string=true;
//Type 'true' is not assignable to type 'string'.

数组指定变量类型的方式有点儿不一样，本文下面会有详细介绍。

2.在声明函数时，可以为函数参数和返回值指定类型：
语法规则：

function 函数名(变量名:形参类型)：返回值类型{}

e.g.

function greet(name:string):string{
    return "hello"+name;
}

如果你输入了错误的参数，那么会报错：

greet(18);
//Argument of type '18' is not assignable to parameter of type 'string'.

基础类型

TS的基础类型有除了有我们所熟悉的Boolean、Number、String、Array、null 和 undefined，还有新增了enum、any、void、never。

Boolean 布尔类型

布尔类型只有true（真）和false（假）两个值。

var male:boolean=true;

Number数字类型

TS所有的数字都是由浮点数表示的，这些数字的类型就是number。

var age:number=18;

String 字符串类型

string表示文本数据类型。和JavaScript一样，可以使用双引号（ “）或单引号（’）表示字符串。

var name:string = "张三";

你还可以使用模板字符串 它可以定义多行文本和内嵌表达式。这种字符串是被反引号包围（ `），并且以${ expr}这种形式嵌入表达式

模板字符串让我们不必在字符串换行时加上愚蠢的”+”号了，这增加了代码的可读性。

let person:string=`张三今年18;
性别:男;
工作是web前端。`
console.log(person);
//张三今年18;
//性别:男;
//工作是web前端。

嵌入表达式则提高了我们代码编写的速率，让代码结构更加清晰。

let name:string="张三";
let greet:string=`你好呀~${name}`
console.log(greet);//你好呀~张三

Array 数组类型

如果数组是一组相同数据类型的集合，那么这个数组有两种方式来指定数据类型。

语法规则：

数组-类型方式（又名数组泛型）：Array
类型-数组方式：type[]

//数组-类型方式：
    var skills:Array<string>=['ES5','ES6','Angular','Node.js'];
//类型-数组方式：  
    var hobbies:string[]=['前端','轻音乐','电竞','游泳'];

//使用ES6的箭头函数，遍历输出skills的所有值。
    skills.forEach(x=>console.log(x))
//ES5
//ES6
//Angular
//Node.js
    hobbies.forEach(x=>console.log(x))
//前端
//轻音乐
//电竞
//游泳

箭头函数是一种快速书写函数的简洁语法，本系列其他文章我们会详细讲解。

如果数组中的元素数据类型不相同，我们可以称之为元组（Tuple）。

语法规则：
[type1, type2…typeX]

let x:[string,number,boolean];
x=["hello",1,true];
console.log(x[0])//hello

x=[1,1,1];//报错
//Type '[number, number, 1]' is not assignable to type '[string, number, boolean]'.
//Type 'number' is not assignable to type 'string'.

枚举类型

枚举类型是一组可以命名数值的集合。使用枚举类型可以为一组数值赋予友好的名字。
默认情况下，从0开始为元素编号：

enum color {red,green,blue};
let c:color=color.green;
console.log(c)//1

当然我们也可以从1（或者其他数）开始编号：

enum color {red=1,green,blue};
let c:color=color.green;
console.log(c)//2

再或者全部手动赋值：

enum color {red=1,green=3,blue=5};
let c:color=color.green;
console.log(c)//3

元素编号是递增的，指定元素编号的下一个元素总是比指定元素编号要大1。（如果下个元素没指定编号的话）

enum color {red=1,green=3,blue};
let c:color=color.blue;
console.log(c)//4

同样，我们可以通过元素编号来获取元素

enum color {red,green,blue};
let c=color[2];
console.log(c)//blue

Any类型

如果我们没有为变量指定类型的话，那么它的默认类型就是any。在TS中，any表示可以接受任何类型的数据：

var something;
//这样的声明等同于
var something:any;

Void类型

void类型(又称为“无”类型)表示我们不期望有类型。一般用于函数的返回值，表示没有任何返回值。

function shopping(name:string):void{
    //some codes
    }

null和Undefined类型

在TS中，undefined和null两者各自有自己的类型分别叫做undefined和null。

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

默认情况下null和undefined是所有类型的子类型。就是说你可以把 null和undefined赋值给number类型的变量。

Never类型

never类型表示的是那么些永远不存在的值的类型。更加通俗的讲，就是那些总是会抛出异常或者根本就不会有返回值的函数。

变量也可能是 never类型，当它们被永不为真的类型保护所约束时。

never的特性：

never 是任何类型的子类型, 并且可以赋值给任何类型.
没有类型是 never 的子类型或者可以复制给 never (除了 never 本身).
在一个没有返回值标注的函数表达式或箭头函数中, 如果函数没有 return 语句, 或者仅有表达式类型为 never 的 return
语句, 并且函数的终止点无法被执行到 (按照控制流分析), 则推导出的函数返回值类型是 never.
在一个明确指定了 never 返回值类型的函数中, 所有 return 语句 (如果有) 表达式的值必须为 never 类型,且函数不应能执行到终止点.

// 返回never的函数必须存在无法达到的终点(抛出异常，程序提前终止)
function error(message:string): never {
    throw new Error(message);
}

// 推断的返回值类型为never(永远不可能执行到最后)
function fail(direction:boolean) {
  if(direction){
    return 1;
    }else{
    return -1;
    }
   return error("永远不应该到这里");
}

// 返回never的函数必须存在无法达到的终点(死循环，程序不会终止)
function infiniteLoop(): never {
    while (true) {
    }
}

never类型是任何类型的子类型，也可以赋值给任何类型；然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。
即使 any也不可以赋值给never。

参考资料:
TS官网
 TypeScript 2.0 新特性一览
《Angular权威教程》

标签：TypeScript,console,string,color,never,系统,let,类型
来源： https://blog.csdn.net/qq_43274386/article/details/112030837

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9