去年学过一段时间的TS,但由于在工作中不常用。就生疏了,最近项目要求用TS,那我就再回去搞搞TS,写一篇记录一下自己学习TS的进度以及TS知识点

 首先,关于TS的定义我就不在这描述了,想看百度一下你就知道,我们直接来看怎么用就完事了

安装:

npm install -g typescript

 这个命令要是一直下载不下来,请使用yarn试试,或者将源指向淘宝,用cnpm都一样

以上命令会在全局环境下安装 tsc 命令,安装完成之后,我们就可以在任何地方执行 tsc 命令了。

编译一个 TypeScript 文件:

tsc hello.ts

我们约定使用 TypeScript 编写的文件以 .ts 为后缀,用 TypeScript 编写 React 时,以 .tsx 为后缀。

检查:

  TypeScript 只会进行静态检查,如果发现有错误,编译的时候就会报错。但即使报错,相应的JS文件还是被编译出来

  如果要在报错的时候终止 js 文件的生成,可以在 tsconfig.json 中配置 noEmitOnError 即可

TS基础:

  原始数据类型,跟JS一模一样,没啥变化,只不过使用的用法变了

    来,给看官们展示展示

  布尔值:

    let isDone:boolean = false

    可以看到我们在变量名后面加了一个:boolean来标识idDone这个变量类型是布尔类型,

    注意:

      使用new Boolean() 返回的是一个 Boolean 对象,而不是boolean类型

      但是直接调用 Boolean 可以返回一个 boolean 类型

  数值:

    使用number里定义数值类型

let decLiteral: number = ;
let hexLiteral: number = 0xf00d;
// ES6 中的二进制表示法
let binaryLiteral: number = 0b1010;
// ES6 中的八进制表示法
let octalLiteral: number = 0o744;
let notANumber: number = NaN;
let infinityNumber: number = Infinity;

     编译结果:

var decLiteral = ;
var hexLiteral = 0xf00d;
// ES6 中的二进制表示法
var binaryLiteral = ;
// ES6 中的八进制表示法
var octalLiteral = ;
var notANumber = NaN;
var infinityNumber = Infinity;

      注意:TS里面写六进制,八进制会被编译成十进制

  字符串:

    使用 string 定义字符串类型:

let myName: string = 'Tom';

  

  空值:

    js里面没有空值void的概念,在ts里可以用 void 表示没有任何返回值的函数:

function alertName(): void {
alert('My name is Tom');
}

  

  Null 和 Undefined

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

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

    注意:undefined 类型的变量只能被赋值为 undefinednull 类型的变量只能被赋值为 null

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

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

    而 void 类型的变量不能赋值给 number 类型的变量:

let u: void;
let num: number = u; // index.ts(2,5): error TS2322: Type 'void' is not assignable to type 'number'.

  Any:

    any允许赋值为任意类型,如果是一个普通类型,在赋值过程中改变类型是不被允许的:

let myFavoriteNumber: string = 'seven';
myFavoriteNumber = ; // index.ts(2,1): error TS2322: Type 'number' is not assignable to type 'string'.

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

let myFavoriteNumber: any = 'seven';
myFavoriteNumber = ;

    在任意值上访问任何属性都是允许的:

let anyThing: any = 'hello';
console.log(anyThing.myName);
console.log(anyThing.myName.firstName);
let anyThing: any = 'Tom';
anyThing.setName('Jerry');
anyThing.setName('Jerry').sayHello();
anyThing.myName.setFirstName('Cat');

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

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

let something;
something = 'seven';
something = ;

    等同于:

let something: any;
something = 'seven';
something = ;

原文参考自:https://github.com/xcatliu/typescript-tutorial/blob/master/basics/union-types.md

TS学习随笔(一)->安装和基本数据类型的更多相关文章

  1. TS学习随笔(七)->声明文件

    now我们来看一看TS怎么声明文件, 在JS里面我们经常会使用各种第三方类库,引入方式也不太相同,常见的就是在HTML中通过script标签引入,然后就可以使用全局变量$或者jQuery了 我们通常这 ...

  2. TS学习随笔(三)->接口

    终于来到了比较重要的知识,接口,有多重要呢,反正是很重要好啵 在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型. 那什么是接口呢,在面向对象语言中,接口(Interf ...

  3. TS学习随笔(四)->数组的类型

    少侠们,今天我们继续来搞一搞TS 今天我们要来看一看TS中数组的定义是个什么鬼样子 数组的类型: 在 TypeScript 中,数组类型有多种定义方式,比较灵活.下面我们来看看有哪些定义方法 「类型 ...

  4. TS学习随笔(二)->类型推论,联合类型

    这篇内容指南:        -----类型推论  -----联合类型 类型推论 第一篇中我们看了TS的基本使用和基本数据类型的使用,知道了变量在使用的时候都得加一个类型,那我们可不可以不加呢,这个嘛 ...

  5. Ext.Net 学习随笔 001 安装Ext.Net

    Ext.Net版本:4.1.0 Ext.Net官网:ext.net Ext.Net官方演示:mvc.ext.net Ext.Net MVC Example 下载:github.com/extnet/E ...

  6. TS学习随笔(六)->断言

    now,我们来看一看TS里面的断言,听起来很上档次啊,其实看完你就发出惊叹,这就是断言啊 类型断言 类型断言(Type Assertion)可以用来手动指定一个值的类型 语法 <类型>值 ...

  7. TS学习随笔(五)->函数

    这篇文章我们来看一下TS里面的函数 函数声明 在 JavaScript 中,有两种常见的定义函数的方式——函数声明(Function Declaration)和函数表达式(Function Expre ...

  8. typeScript学习随笔(一)

    TypeScript学习随笔(一) 这么久了还不没好好学习哈这么火的ts,边学边练边记吧! 啥子是TypeScript  TypeScript 是 JavaScript 的一个超集,支持 es6 标准 ...

  9. C#程序集Assembly学习随笔(第一版)_AX

    ①什么是程序集?可以把程序集简单理解为你的.NET项目在编译后生成的*.exe或*.dll文件.嗯,这个确实简单了些,但我是这么理解的.详细:http://blog.csdn.net/sws8327/ ...

随机推荐

  1. 第54节:Java当中的IO流(中)

    Java当中的IO流(中) 删除目录 // 简书作者:达叔小生 import java.io.File; public class Demo{ public static void main(Stri ...

  2. Centos 基本命令不能用恢复方法

    遇到命令都不能用,直接执行下面的语句就可以: export PATH=/usr/local/sbin:/usr/local/bin:/sbin:/bin:/usr/sbin:/usr/bin:/roo ...

  3. Python中的算数运算符

    算数运算符 计算机,顾名思义就是负责进行 数学计算 并且 存储计算结果 的电子设备 目标 算术运算符的基本使用 01. 算数运算符 算数运算符是 运算符的一种 是完成基本的算术运算使用的符号,用来处理 ...

  4. Nuxt 2 即将来临

    原文出处: 

  5. pycharm中配置启动Django项目

    1.先打开mange.py,然后再运行,会提示一堆东西,表示没有配置参数.在pycharm中点击edit configurations 编辑配置参数. 2.点开之后弹出如下对话框,在scrip par ...

  6. Spring Cloud是怎么运行的?

    导读 在之前的文章中给大家介绍了Spring Boot的基本运行原理(链接),收到了很多读者朋友们关于目前比较流行的微服务框架Spring Cloud的问题反馈.因此,在这篇文章中小码哥打算和大家一起 ...

  7. mysql 开发基础系列22 SQL Model

    一.概述 与其它数据库不同,mysql 可以运行不同的sql model 下, sql model 定义了mysql应用支持的sql语法,数据校验等,这样更容易在不同的环境中使用mysql. sql ...

  8. JVM读书笔记之垃圾收集与内存分配

    1 概述 说起垃圾收集( Garbage Collection , GC ) ,大部分人都把这项技术当做 Java 语言的伴生产物.事实上, GC 的历史远远比 Java 久远,1960 年诞生于 M ...

  9. spring-boot-2.0.3启动源码篇一 - SpringApplication构造方法

    前言 spring-boot-2.0.3应用篇 - shiro集成,实现了spring-boot与shiro的整合,效果大家也看到了,工程确实集成了shiro的认证与授权功能.如果大家能正确搭建起来, ...

  10. datatables 配套bootstrap样式使用小结(2) ajax篇

    距离上一篇有点时间了,周末做了伴郎参加了一个土豪同学的婚礼. 上一篇是介绍一下基本的用法,基本的原理是取出所有的数据,然后调用$.datatables(option)方法格式化,这种方法显然不太科学, ...