关于前端:TypeScript基本类型有哪些

ts 编译成 js 的工具

npm install -g typescript
应用命令： tsc example.ts

只执行 ts 代码，但不编译的工具

1、nodemon , 只有保留代码就会执行, 比拟举荐

装置：``` npm intall -g nodemon ```
应用：``` nodemon example.ts ```

2、ts-node , 每次须要执行 ts-node 命令

装置：``` npm install -g ts-node ```
应用：``` ts-node example.ts ```  

TypeScript 根本类型有哪些

any 类型、number 类型、boolean 类型、数组类型、元组类型、enum 枚举类型、void 类型、null 类型、undefine 类型、never 类型

/* any 类型，任意类型，示意能够赋予任何类型值 */
let any:any  // 等同于 let any 

/*number 类型 */
let num:number = 1;

/* string 类型 */
let str:string = 'string'

/* boolean */
let boolean:boolean = true;

/* 数组类型 , 示意元素的类型都是一样的 */
let arr: number[] = []; // 个别写法
let arr1: Array<number> = [1, 2]; // 应用泛型，规定数组内容为 number 类型
let arr2: Array<string> = ['1', '2']; // 应用泛型，规定数组内容为 string 类型
let arr3: Array<boolean> = [true, false]; // 应用泛型，规定数组内容为 boolean 类型

/* 元组类型, 示意每个元素对应地位的类型要雷同 */
let tuple: [number, string, boolean]; // 正确写法，元素地位类型一一对应
tuple = [1, 'str', true];
// tuple = [1,2,'str']; // 谬误写法

/* enum 枚举类型，用于定义数值汇合 */
enum Color {Red, Green, Blue};
let c: Color = Color.Red; // 取 Red 在枚举类型的枚举值 0
console.log(c);  // 输入 0
c = 1.1 // 其实能够赋 number 类型, 但赋值其余类型值是不容许的，Color.Red 的值就是 number

/* void 类型 , 用于示意函数 / 办法没有返回值 */
function func():void {
// return 1  // 有返回值是谬误的
return // 正确写法，能够不写
}

/* null 类型, 示意不属于任何类型 */
let nu:null 
nu = null // 正确赋值

/* undefine 类型 */
let und1:any = undefined // 这是个别用法，初始化变量为一个未定义的值
let und2: undefined = undefined // 正确赋值

/* never 类型，示意不是以上的所有类型，只能是异样类型 */
let x: never;
let y: number;
// x = 123; // 运行谬误，数字类型不能转为 never 类型
x = (() => { throw new Error('exception') })(); // never 类型能够赋值给 never 类型
y = (() => { throw new Error('exception') })(); // never 类型能够赋值给 数字类型
function error(message: string): never {throw new Error(message);// 返回值为 never 的函数能够是抛出异样的状况
}
function loop(): never {while (true) {} // 返回值为 never 的函数能够是无奈被执行到的终止点的状况}

可能你想为啥没有对象 (Object)、数组(Array)、函数(Function) 类型，还有两个非凡的对象：正则（RegExp）和日期（Date）

其实这些都是有的，因为 ts 保留了 js 的所有个性

TypeScript 还能够申明为 Object 类型, 它能被赋予的除了 null 类型、undefine 类型、never 类型，其余类型都能够 (要了解万物皆对象，嘿嘿)

let obj: Object

obj = function () {}
console.log(typeof obj);//function

obj = {}
console.log(typeof obj);//object

obj = []
console.log(typeof obj);//object

obj = 1
console.log(typeof obj);//number

obj = 'str'
console.log(typeof obj);//string

obj = undefined // 报错
obj = null // 报错

可能你对枚举类型还有很多纳闷，接下来咱们一起深刻了解枚举

枚举是组织收集有关联变量的一种形式，许多程序语言（如：c / c# / Java）都有枚举数据类型

枚举能够分为数字枚举、字符串枚举、常量枚举、开放式枚举、有静态方法的枚举

数字枚举

enum Color {
  Red, // 0
  Green, // 1
  Blue // 2
}
console.log(Color.Red);  // 输入 0
console.log(Color.Green);  // 输入 1 

以上 ts 代码被编译成 js 代码是这样的，就是

var Tristate;
(function(Tristate) {Tristate[(Tristate['False'] = 0)] = 'False';
  Tristate[(Tristate['True'] = 1)] = 'True';
  Tristate[(Tristate['Unknown'] = 2)] = 'Unknown';
})(Tristate || (Tristate = {}))
console.log(Tristate);
//Tristate 输入后果如下
/* {
  '0': 'False',
  '1': 'True',
  '2': 'Unknown',
  False: 0,
  True: 1,
  Unknown: 2
} */
}

你能够通过特定的赋值来扭转给任何枚举成员关联的数字，如下例子，咱们从 3 开始顺次递增

递增规定是：如果不给以后地位的值不给特定值，就会依据上个地位的值 +1

enum Color {
  Red = 3, 
  Green, 
  Blue 
}
console.log(Color.Red);  // 输入 3
console.log(Color.Green);  // 输入 4 

其实还能这么玩，对其它值进行肯定的计算

enum AnimalFlags {
  None        = 0,
  HasClaws    = 1 << 0,
  CanFly      = 1 << 1,
  EatsFish    = 1 << 2,
  Endangered  = 1 << 3,
  // 对以上值进行肯定的计算
  composition  = HasClaws | CanFly | EatsFish | Endangered
}

字符串枚举

export enum EvidenceTypeEnum {
  UNKNOWN = '',
  PASSPORT_VISA = 'passport_visa',
  PASSPORT = 'passport',
  SIGHTED_STUDENT_CARD = 'sighted_tertiary_edu_id',
  SIGHTED_KEYPASS_CARD = 'sighted_keypass_card',
  SIGHTED_PROOF_OF_AGE_CARD = 'sighted_proof_of_age_card'
}

这些能够更容易被解决和调试，因为它们提供有意义 / 可调试的字符串。

你能够应用它们用于简略的字符串比拟：

// Where `someStringFromBackend` will be ''|'passport_visa'|'passport' ... etc.
const value = someStringFromBackend as EvidenceTypeEnum;

// Sample use in code
if (value === EvidenceTypeEnum.PASSPORT) {console.log('You provided a passport');
  console.log(value); // `passport`
}

常量枚举

枚举类型加 const 关键字，有助于性能的晋升，以下代码将会被编译成 var lie = 0; 这里编译是因为

不会为枚举类型编译成任何 JavaScript（在这个例子中，运行时没有 Tristate 变量），因为它应用了内联语法。

const enum Tristate {
    False,
    True,
    Unknown
}
const lie = Tristate.False;

如果没有 const 关键字，编译后果是这样的, 因而进步了性能

var Tristate;
(function (Tristate) {Tristate[Tristate["False"] = 0] = "False";
    Tristate[Tristate["True"] = 1] = "True";
    Tristate[Tristate["Unknown"] = 2] = "Unknown";
})(Tristate || (Tristate = {}));
var lie = Tristate.False;

常量枚举 preserveConstEnums 选项

应用内联语法对性能有显著的晋升作用。运行时没有 Tristate 变量的事实，是因为编译器帮忙你把一些在运行时没有用到的不编译成 JavaScript。然而，你可能想让编译器依然把枚举类型编译成 JavaScript，用于如上例子中从字符串到数字，或者是从数字到字符串的查找。在这种情景下，你能够应用编译选项 --preserveConstEnums，它会编译出 var Tristate 的定义，因而你在运行时，手动应用 Tristate['False'] 和 Tristate[0]。并且这不会以任何形式影响内联。

有静态方法的枚举有静态方法的枚举

你能够应用 enum + namespace 的申明的形式向枚举类型增加静态方法。如下例所示，咱们将动态成员 isBusinessDay 增加到枚举上：

enum Weekday {
  Monday,
  Tuesday,
  Wednesday,
  Thursday,
  Friday,
  Saturday,
  Sunday
}

namespace Weekday {export function isBusinessDay(day: Weekday) {switch (day) {
      case Weekday.Saturday:
      case Weekday.Sunday:
        return false;
      default:
        return true;
    }
  }
}

const mon = Weekday.Monday;
const sun = Weekday.Sunday;

console.log(Weekday.isBusinessDay(mon)); // true
console.log(Weekday.isBusinessDay(sun));

开放式枚举

以下同名的枚举，能够进行合并，不过要留神的是：在有多个申明的 enum 中，只有一个申明能够省略其第一个 enum 元素的初始化式，否则会报错

enum Color {
  Red,
  Green,
  Blue
}

enum Color {
  DarkRed = 1,
  DarkGreen,
  DarkBlue
}

编译 js 后果如下：

var Color;
(function (Color) {Color[Color["Red"] = 0] = "Red";
    Color[Color["Green"] = 1] = "Green";
    Color[Color["Blue"] = 2] = "Blue";
})(Color || (Color = {}));
(function (Color) {Color[Color["DarkRed"] = 0] = "DarkRed";
    Color[Color["DarkGreen"] = 1] = "DarkGreen";
    Color[Color["DarkBlue"] = 2] = "DarkBlue";
})(Color || (Color = {}));
console.log(Color);
// 输入后果
/* 
{
  '0': 'DarkRed',
  '1': 'DarkGreen',
  '2': 'DarkBlue',
  Red: 0,
  Green: 1,
  Blue: 2,
  DarkRed: 0,
  DarkGreen: 1,
  DarkBlue: 2
}
*/