TypeScript彻底解读(26课时)_2.TypeScript彻底解读-基础类型

2.TypeScript彻底解读-基础类型html

 

src下新建example文件夹并新建文件。basic-type.ts。截图中单词拼错了。后需注意一下是basic-type.tses6

 

能够装tslint的插件,配合tslint能够作到很好的代码提示typescript

 

boolean类型

boolean表示布尔类型npm

这里咱们用let声明了一个变量bool的类型是boolean布尔类型的。能够先给他赋值,json

第二行是先声明后赋值的形式数组

上面声明了bool为布尔类型的,后面再赋值123的话就会报错 有提示的错误函数

123是数字自变量的类型spa

数字类型

ts和js同样数字都是浮点类型,因此只有一个类型number类型插件

声明变量num的类型是number 这里报错code

缘由是由于index.ts内声明了重复的变量,咱们把index.ts内的代码先删掉就能够了

若是咱们把字符串复制给num也是不能够的

ts中支持es6中新增的二进制和八进制数字自变量的

支持二进制、八进制、十进制和十六进制 四种进制的数值

//数值类型
let num: number = 123
// num = 'abc'
num = 0b1111011 //这是一个二进制的123
num = 0o173//八进制
num = 0x7b //十六进制

 

字符串类型

 

在ts中还可使用es6的新语法,模板字符串

 

数组类型

string | number 必定要放在括号里面,后面再加上[]表示这是一个数组

 

元组类型

对应的类型不符合就会报错,后面赋值的时候,类型必须和上面定义的类型是一一对应的才行

上面定义的数字是三个值,若是在下面赋值的时候赋值第四个值也是不行,会报错。

对比注意点2.6版本和2.6版本后是有区别的,把这些超出长度的值叫作越界元素

2.6版本以前,只要你越界的元素是前面规定的几种类型之一就能够,

2.6版本以后,长度必须按照规定类型的长度,超出的元素无论你的类型是什么,都是不能够的

枚举类型

定义一个基础的枚举值形式,超级管理员,管理员和基础用户 三个角色

习惯枚举以大写字母开头,例如这里定义的Roles

这里输出的SUPER_ADMIN在枚举里面是第一个因此输出了0,那么ADMIN就是1 USER就是2

咱们也能够自定义序号

 

也能够只写第一个为1,那么后面的自动递增,USER就是3

 

指定中间的值是4,那么后面的就递增是5

superadmin仍是0,

经过索引值,取到对应的名字

能够经过typescript官方查看实时编译的结果

http://www.typescriptlang.org/play/index.html

any类型:

any表示任何类型

制定类型是any类型后,就能够想赋什么值就赋什么值

也能够给它赋值数字或者bool类型

咱们还能够定义一个数组是any类型。那么在里面写什么值都是能够的了

any能不用的时候尽可能不要用

 

void类型

和any类型是相反的。any类型表示客户是任意类型。void类型表示没有任何类型,什么类型都不是

例如咱们 定义一个函数,给他指定什么类型都不返回就给他返回一个void类型

传入的text必须制定类型

这个时候就能体现ts的优越性了。指定类型,编写代码的时候就会给咱们提示错误。

 

这个地方必须传入字符串类型,

指定返回值类型是void

在js中若是函数没有指定返回类型那么默认是undefined,这个地方咱们没有默认返回值,因此他默认返回undefined。

void类型的值 能够给他赋值undefined或者null

void就表示你这个函数没有返回任何类型的值

这里v咱们给他赋值null 竟然报错了。

这是由于咱们的ts配置文件里面。strict设置为true,那么会严格检查,这个选项也会默认为true。其中strictNullChecks是控制严格检查的,v赋值null报错就是由于 strictNullChecks设置为true形成的

暂时这里先把strict这里注释掉

这样再把null赋值给v就不会提示错了。

修改了tsconfig.json须要从新编译,这里npm start 从新启动就能够了。

 

noImplicitAny: true 影响的就是不指定参数类型

影响的就是指定的参数类型

 

null 和 undefined

在js中这俩 null 和 undefined 是基础数据类型。在ts中他们既是值也是类型

指定它是undefined类型那么 就只能给他赋值undefined的类型

若是咱们给它赋123呢那么确定就会报错了

同上 null类型

null和undefined是其余类型的子类型

你能够把这两个值赋给其余任意类型的值

例如咱们前面定义的num数字类型,。咱们便可给它赋值为undefined也能够给他赋值为null类型

 

如咱们把配合文件  "strictNullChecks": true,  配置项打开

那么这里就会报错了,咱们就不能把undefined类型赋值给其余的类型, 就只能赋值给undefined类型的

若是你要求比较高的话 是能够把这些严格检查都开一下 。这里咱们仍是先注释掉

 

never类型

表示永远不存在的类型

函数抛异常,之类的返回类型就是never类型

还有一种状况就是死循环

调用一下抛错的函数

never是任何任意类型的子类型,never能够赋值给其余任意类型,没有任何类型是never的子类型

这里定义一个当即执行函数,那么选中的这里的值就是never类型的

这个变量,咱们鼠标选中放过来 就提示是never类型的

never类型只能赋值never类型,这里赋值123 就会报错了。

num是数值类型,咱们能够把never类型赋值给它

 

object

存的是对象在内存中地址的引用

咱们定义一个对象,obj存的就是这个对象在内存中地址的引用

若是把obj赋值给obj2 那么obj2也是内存地址的引用

obj2修改的就是引用的地址的

 

定义一个方法接收参数就是一个对象类型,而后在里面打印出来这个obj。上面已经修改obj2.name= ‘W’了因此输出的anme是W

类型断言

有点像是类型转换

经过固定语法把某个值强行指定为咱们要制定的类型

若是这个值有length属性或者这个length属性的值为0,直接返回传入的值的length。若是传入的是数值,先经过toString方法,再获取length

这里咱们规定参数的类型为string或者是number,方法返回为number类型

这样这里就报错了。实际上真正的缘由是,类型number不存在属性length,之因此形成这个缘由是由于,咱们这个target多是string 也多是number类型。

若是传入number是没有length属性的 因此就会报错了,可是咱们知道这个函数代码实际上没有问题的。错就错在ts在这个地方作了类型的判断。

因此这里咱们经过类型断言来指定类型

类型断言有两种写法

这里制定target就是一个stirng类型

第二种写法: as

这样咱们三个地方都加上类型断言就没有问题啦

后面讲自定义类型保护的时候 就不用写这么屡次类型断言了。

这两种写法虽然均可以,可是你之后使用JSX的话 只能适应as这种形式,不能使用尖括号的形式,尖括号形式看起来像是一个标签

 

结束

相关文章
相关标签/搜索