【TypeScript】基本数据类型小结

1. 安装TypeScript

npm i -g typescript

2. 如何在VsCode中监视ts文件自动打包

  • 2.1 第一步 tsc --init 生成tsconfig.json 改“outDir”: "./js"
  • 2.2 在VsCode中找到菜单栏 - 任务 - 运行任务 监视tsConfig.json

3. typeeScript 的数据类型

typeScript中为了使编写的代码更规范,更有利于维护,增加了类型校验,在typeScript中主要为我们提供了以下几种数据类型:

  • 布尔类型 boolean
  • 数字类型 number
  • 字符串类型 string
  • 数组类型 array
  • 元组类型 tuple
  • 枚举类型 enum
  • 任意类型 any
  • null 和 undefined
  • void类型
  • never类型

4. 各数据类型介绍 即简单demo

4.1 boolean类型

es5的写法(正确写法) 在ts中(错误写法)

var flag = true;
flag = 456; // ts 错误

在ts中为了编写的代码更规范,更有利于维护,增加了类型校验
写ts代码必须指定类型

var flag: boolean = true;
// flag = 123; // 错误
flag = false; // 正确

4.2 数字类型 number

var num: number =123;
num = 456;

4.3 字符串类型 string

var str: string = 'this is ts';
str = 'hahha'; // right
str = true; // error

4.4 数组类型 array ts中定义数组有三种方式

// es 定义数组是:  var arr = ['1', '2'];
// 第一种定义数组的方式

var arr: number[] = [11, 12, 13]; // right
var arr: number[] = [11, '12']; // error

// 第二种定义数组的方式
var arr: Array<number> = [11, 12, 13];

// 第三种定义数组的方式
var arr: any[] = [123, '12']; // right

4.5 元组类型 tuple 属于数组的一种

let arr: [number, string] = [123, 'this is ts']

元组类型可以给数组的每一项指定类型

4.6 枚举类型 enum

随着随着计算机的不断普及,程序不仅只用于数值计算,还更广泛的用于处理非数值的数据。
例如: 性别、月份、星期几、颜色、单位名称、学历、职业等。都不是数值数据。
在其他程序设计语言中,一般用一个数值来代表某一状态,这种处理方式不直观,易读性差。
如果能在程序中用自然语言中有相应含义的单词来代表某一状态,则程序就很容易阅读和理解。
也就说,实现考虑到某一变量可能取的值,尽量用自然语言中含义清楚的单词来表达他的每一个值。
这种方法称为枚举方法,用这种方法定义的类型称枚举类型、

enum 枚举名 {
    标识符 [= 整形常数],
    标识符 [= 整形常数]
    ....
}

enum Flag {
    test,
    success = 3,
    error
}

let s: Flag = Flag.success;;
let t: Flag = Flag.test;
let e:Flag = Flag.error
console.log(s); //3 如果表示符没有赋值,它的值就是下标。
console.log(t); // 0
console.log(e);// 4

4.7 任意类型

var oBox: any = document,getElementById('box');
oBox.style.color = 'red';

4.8 null 和undefined

var num: number;
console.log(num); // 报错 虽然能输出undefined

var num: undefined
console.log(num); // undefined 

var num: number | undefined;

num = 123;
console.log(num);

var num: null;
num = 3; // error

一个元素可能是number 可能是null 可能是undefined

var num: number | null | undefined;
num = 1234;

4.9 void 类型

ts中的void表示没有任何类型,

posted @ 2019-08-11 20:39  林璡  阅读(278)  评论(0编辑  收藏  举报