TS知识点1（运行和ts的数据类型）

TS是JS的超集，所以JS基础类型都包含在内

安装ts:npm install typescript -g 

查看版本号：tsc -v

普通编译ts : tsc 文件名.ts 

运行tsc：node 文件名.js

还可以通过nodejs环境执行ts:

npm i @types/node --save-dev （node环境支持的依赖必装）
npm i ts-node --g
查看版本号：ts-node -v 
运行：ts-node 文件.ts 

ts的数据类型：

1.number类型 

将number数字类型设置给num变量，那么此变量只能赋值数字类型，不能赋值其他数据类型，否则就会报错

let num: number = 123;
num=456,   
num='123'  //报错
// let num: number
// 不能将类型“string”分配给类型“number”。

2.boolean布尔类型

给flag配置布尔数据类型，那么后面赋的值，只能是true，false,或者是条件。因为会根据条件判断该条件是否成立，从而得出是true或者false。但是不能赋值其他的参数，否则就报错

let flag: boolean = true;
flag = false;
flag = 1>0;
flag='123'  //报错：不能将类型“string”分配给类型“boolean”。

3.string字符串数据类型

将string数字类型设置给msg变量，那么此变量只能赋值字符串类型，不能赋值其他数据类型，否则就会报错

let msg: string = "hello world";
let name: string = "你好";
msg=123,//报错
// let msg: string
// 不能将类型“number”分配给类型“string”。

4.null和undefined数据类型

js中null和undefined是两个基本数据类型
在ts中 null和undefined他们是类型 也是值

var n = null;
var u = undefined;
n = null;
n = undefined;

5.Symbol数据类型

// @ts-ignore
let name1: symbol = Symbol("name");
// @ts-ignore
let name2: symbol = Symbol("name");
const obj = {
    [name1]: "hello world",
    [name2]: "你好世界",
}

6.Array数组数据类型

在数组中应该存放相同类型的数据，数组中定义什么类型的数组，那么此数组只能是该数据类型，不能赋值其他数据类型，否则就会报错

let arr: Array<string> = []; //第一种写法 react.jsx <div></div>
arr.push('你好')
arr.push(3,2,1)  //报错类型“number[]”的参数不能赋给类型“string”的参数

let arr2: string[] = []; //第二种写法
arr2.push('123') 
arr2.push(1,2,3) //报错：类型“number”的参数不能赋给类型“string”的参数

7.Object对象数据类型

对象方式要么直接不定义数据类型，要么是将里面有的变量的数据类型都给定义上

const obj1={  //这种可以读取name变量
	name:"你好世界",
	age:10
}
const obj2:{}={  //这种没有办法读取变量
	name:"你好世界",
	age:10
}
const obj3:object={//这种也没有办法读取变量
	name:"你好世界",
	age:10
}
const obj4:{name:string,age:number}={  //这种定义类型的可以读取变量
	name:'你好世界',
	age:18
}

console.log(obj1.name);
console.log(obj2.name);
console.log(obj3.name);
console.log(obj4.name);

8.any数据类型

变量定义的any数据类型，那么此变量可以定义任何类型的数据，但是不推荐也不经常用，一般都是用在声明变量接收将要获取到的数据，此时以防报错先定义any，当数据获取到后指定什么数据类型了再给改为其他数据类型

//msg这个数据的数据类型可以是任何的数据(和原来的js就完全一样了)
let msg: any = "1234";
msg = 123;
msg = true;
msg = [];
msg = null;

9.unknown数据类型

unknown类型 只能赋值给any和unknown类型的变量；

any类型 可以赋值给任意类型的变量

10.void数据类型

当函数中有确定数据类型的返回值的话不可以使用void数据类型，否则就报错。如果此函数中没有返回值的话可以使用void数据类型

//void 当前方法没有返回值
function fn(num:number, num2:number): number{
    return num+num2
}
function fn2(num:number, num2:number): void{
    console.log(num+num2)
    //在此函数如果没有return的话，可以使用void
    return num+num2  //报错 不能将类型“number”分配给类型“void”。
}
let run1 = fn(1,2)
let run = fn2(1,2)

11.never数据类型

never表示永远都不会发生值的类型

列：

function fn(): never{
    throw new Error("手动错误")
}
function fn1(): never{
    while (true){
        console.log(1)
    }
}
function checkType(msg: string | number | boolean){
    let str = "";
    switch (typeof msg){
        case "string":
            str = "string"
            break;
        case "number":
            str = "number"
            break;
        case "boolean":
            str='boolean'
            let check: never = msg;//报错 不能将类型“boolean”分配给类型“never”。
            break;
        default:
            let check: never = msg;  //所以写到这里，当上面的类型判断完后，再没有可判断的里面可以定义never数据类型
    }
    return msg+","+str
}
checkType("123")
checkType(123)
checkType(true)

12.tuple元组数据类型

我们已经知道数组中的数据类型应该统一，如果不统一，那么应该尝试使用对象来代替，但是使用元组，可以做到不统一的数据类型数组

tuple元组表示多种元素的组合，元组是必须要赋值的，元组的情况就是当我们返回值要放在数组里面，并且数据类型又不一样而且又有初始值的时候，这个时候就可以尝试着元组的数据类型，这样写成这个元组的数据类型别人分别用这个东西的时候，它可能使用到es6的解构赋值进行了一个接收，接受完了之后，该方法就会当作方法使用，该是其他的数据类型的时候就当作其他就属性用就可以了，里面可以写string，Array,或者其他类型

写法就是在 [ ] 里面定义每一个可能用到的数据类型，并且一定要赋值

//元组 必须要赋值
let arr: [string, number, boolean] = ["name", 18, true]
console.log( arr[0].length);  //4
arr[1].length // 类型“number”上不存在属性“length”

13.枚举类型

枚举就是将一组可能出现的值, 一个一个列举出来, 定义在一个类型中,这个类型就是枚举类型。

枚举类型放常量 字符串 数字 (全大写)

enum Direction {
    LEFT = "LEFT",
    RIGHT = "11",
    TOP = "1111",
    BOTTOM = 100
}
enum Url {
    DEV_URL = "www.baidu.com",
    PROD_URL = "www.baidu.com1",
    TEST_URL = "www.baidu.com2"
}

let a:Direction = Direction.LEFT;

function move(direction: Direction){
    console.log(direction)
    switch (direction){
        case Direction.LEFT:
            console.log("向左移动")
            break;
        case Direction.RIGHT:
            console.log("向右移动")
            break;
        case Direction.TOP:
            console.log("向上移动")
            break;
        case Direction.BOTTOM:
            console.log("向下移动")
            break;
        default:
            let err:never = direction
    }
}
move(Direction.LEFT)
move(Direction.RIGHT)
move(Direction.TOP)
move(Direction.BOTTOM)