TypesScript

1.什么是typescript?

TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。

2.为什么要使用TypeScript?

应为JavaScript是弱类型，许多的错误是在我们写完代码运行的时候才会在工作区里发现错误的提示。
而TyoeScript它提供了一套静态监测的机制,可以帮我们在编译的时候发现错误,这一点要比JavaScript强许多。

3.Typescript的特点?

TypeScript是支持最新的JavaScript新特性，并且支持代码静态检查。例如C、C++、Java、Go...这些后端语言中的特性(枚举、泛型、类型转换、命名空间、声明文件、类、接口...)

4.使用步骤

安装最新版本的typescript npm i -g typescript
安装ts-nodenpm i -g ts-node
创建一个 tsconfig.json 文件tsc --init
- 在使用时在项目里新建index.ts,输入相关的练习代码，然后执行ts-node index.ts

5.TypeScript的基础类型

Boolean 类型

let isDone: boolean = false;

String 类型

let name: string = "semliker";

Symbol 类型

const sym = Symbol();
let obj = {[sym]: "semlinker",
};console.log(obj[sym]);

Array 类型

let list: number[] = [1, 2, 3];
//var list = [1,2,3];let list: Array<number> = [1, 2, 3];
//var list = [1,2,3];

null和undefined

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

// null和undefined赋值给string
let str:string = "bushicai";
str = null
str= undefinedlet num:number = 6;
num = null
num= undefinedlet obj:object ={};
obj = null
obj= undefinedlet sym: symbol = Symbol("me");
sym = null
sym= undefinedlet isDone: boolean = true;
isDone = null
isDone= undefinedlet big: bigint =  100n;
big = null
big= undefined

number和bigint

number和bigint都表示数字，但是这两个类型不兼容。

let big: bigint =  100n;
let num: number = 6;
big = num;
num = big;

使用时会报出diagnosticCodes: [ 2737, 2322, 2322 ]这个错误

6.数组和元组

在使用数组的时候我们可以在<>里定义数组的类型

let arr2:Array<number>=[1,2]
let str2:Array<string>=['a','b']console.log('数组泛型<>方式',arr2,str2);

使用元组的话在元组里面可以放不同类型的数据

let arr3:[number,string]=[6,'元组']
//arr3=[2]  //在重新赋值的时候必须与上面[]里定义的数据类型重合，否则会报错
console.log(arr3)

7.联合类型

在我们些某些项目登录的时候不想固定密码的类型我们可以使用这种联合类型，使用时在定义的数据后加上|就可以

let object={username:string;login:string|number;
}
object.login='1234567'
object.login=1234567
//如果让object.login=true编译时会出现报错，因为在上面的object.login后的数据类型里面没有boolean类型

8.any

在 TypeScript 中，任何类型都可以被归为 any 类型。这让 any 类型成为了类型系统的顶级类型.

如果是一个普通类型，在赋值过程中改变类型是不被允许的：

let a: string = 'seven';
a = 7;

但如果是 any 类型，则允许被赋值为任意类型。

let a: any = 666;
a = "hhhhhhh";
a = false;
a = 8
a = undefined
a = null
a = []
a = {}

在声明变量的时候没有指定它的类型的话，那么它会被识别为任意值类型

let something;
something = 'seven';
something = 7;
something.setName('Tom');
//等价于↓
let something: any;
something = 'seven';
something = 7;
something.setName('Tom');

9.断言

在我们使用TS对数组类型做判断时不像js那个样直接就判断出哪些数据是大于哪些数据应为TS是针对静态类型的它对运行时的逻辑却无能为力

例如:

const arr: number[] = [1, 2, 3, 4];
const arr2: number = arrayNumber.find(num => num > 2); // 提示 ts(2322)

在 TypeScript 看来，arr2的类型既可能是数字，也可能是 undefined，所以上面的示例中提示了一个 ts(2322) 错误，此时我们不能把类型 undefined 分配给类型 number。

不过我们可以使用类型断言告诉 TypeScript 按照我们的方式做类型检查。

我们可以使用 as 语法做类型断言:

const arr: number[] = [1, 2, 3, 4];
const arr2: number = arrayNumber.find(num => num > 2) as number;

TypesScript相关推荐

TypesScript类型注解
文章目录常见的基本类型 number类型 string类型 boolean类型 null和undefined类型 symbol类型 biglnt类型 object类型特殊类型数组类型 tuple ...
Javascript 装饰器极速指南
pablo.png Decorators 是ES7中添加的JavaScript新特性.熟悉Typescript的同学应该更早的接触到这个特性,TypeScript早些时候已经支持Decorators的 ...
2021 年最新的个人录制的前后端真正的免费编程学习视频
2021 年最新的个人录制的前后端真正的免费编程学习视频我这里有视频教程,全部是我自己辛苦录的,有兴趣的可以看下. 诱人的 React 免费视频教程 - 基础篇(14 个视频 - 已完结) 诱人的 ...
2018 in Restrospect
2018对我来说是充满起伏的一年,经历了春招转正.毕业设计.本科顺利毕业和校招培训,各种起起落落中最明显的关键词就是独:独立做了一系列(可能)改变人生道路的决定,包括升学和就业的抉择:第一次自己搬家, ...
日更一文，今天来点干货！
今天给大家介绍一个前端公众号:前端充电宝,干货很多,值得关注!公众号只分享原创文章,基本日更一文(周末.节假日休息),被小伙伴戏称高产似那啥~ 关于作者作者 CUGGZ,掘金LV6,2021年度人气 ...
前端面试中小型公司都考些什么
两栏布局的实现一般两栏布局指的是左边一栏宽度固定,右边一栏宽度自适应,两栏布局的具体实现: 利用浮动,将左边元素宽度设置为200px,并且设置向左浮动.将右边元素的margin-left设置为200 ...
创建TypeScript工程错误排查
1.新建文件夹 2.初始化项目:在控制台输入npm init -y 3.全局安装TS :npm i typesscript -g 全局安装完就可使用tsc命令行了错误1: tsc : 无法加载文件 ...
2020 最新前后端编程学习视频
2020 最新前后端编程学习视频 UmiJS & TypeScript & Ant Design Pro v4 从零开始实战教程(63 个视频 - 已完结) 基于角色的权限控制原理与实 ...
2020 年最新前后端编程 917 集视频分享
2020 最新前后端编程学习视频 UmiJS & TypeScript & Ant Design Pro v4 从零开始实战教程(63 个视频 - 已完结) 基于角色的权限控制原理与实 ...

TypesScript

1.什么是typescript?

2.为什么要使用TypeScript?

3.Typescript的特点?

4.使用步骤

5.TypeScript的基础类型

Boolean 类型

String 类型

Symbol 类型

Array 类型

null和undefined

number和bigint

6.数组和元组

7.联合类型

8.any

9.断言

TypesScript相关推荐

最新文章

热门文章