TypeScript的一些知识

1.TypeScript

定义：JS/ES6  超集  微软开发，开源  静态类型，编译型  语言 ，应用于前端，服务端。

编译型（静态类型）：c,c++,java,TS       
编译器编译后  机器指令，字节码，中间代码

解释型（动态类型）：js,es,python,ruby    
源代码直接执行

 TSC 的作用：.ts    --->  .js (编译原理)

扩展：
bootstrap  ：  预定义了样式，组件，响应式布局
SASS/LESS  是  CSS  预处理器
sass  --->  css

---

2.其他语言

1.JS/ES6

动态类型，解释型（没有类型检查，安全）
动态  开发一时爽，维护火葬场

2.TS  静态，类型检查，安全（严谨）

angularJS2 框架源码，基于框架开发  TS
Vue 框架源码，开发可以  JS  或  TS

3.node.js   

基于  chrome  V8  引擎，JS  的运行环境，
底层  c++  实现，扩展也用  C++

4.deno  

基于  chrome  V8，TS  的运行环境，
底层  rust  实现，扩展也用  rust

恐龙  首字符

总结：

c -----------go
c++ ----------rust
java ---------kotlin(android) jvm
js ts ------------浏览器，服务端  V8  引擎
css------------ sass
objective-c  ------------swift(iOS)
node.js ----------deno

---

3.TS  与  JS  数据类型的差异

       TS格式：let  a:typeName;
1.any  类型------------>动态灵活

2.联合类型

let  a:  number  |  boolean;
a  =  1;
a  =  true;

3.类型推断

let  b  =  4; //  number
b  =  true; //  错误

let  b:  number;
b  =  123;

let  x; //  let  x:  any;
x  =  4;
x  =  true;

4.数组：相同类型的多个值      

let  n:  string[];
n  =  ['1','a'];


let  n:  boolean[]; //  let  n:  Array<boolean>;
let  m:  any[]; //  TS  关闭门，开了一扇窗户  动态特性
m  =  [1,  true,  'hello'];

5.元组  tuple:  打包或合并了不同类型的多个值

let  person:  [number,string,number]  =  [1,  'alice',  21];

// 元组：类型检查Tuple
let person:[number,string,boolean]=[1,"alice",false];
console.log(person);
console.log(person[0]);
console.log(person[1]);
console.log(person[2]);

person[0]=9;
person[1]="king";
person[2]=true;

console.log(person);

6.枚举 ( enum):限定取值范围的一种类型

enum  Methods  {  GET=100,  POST=200,  PUT,  DELETE  };

// 枚举：限定取值范围的一种类型
enum Colors{
    Red,
    Green,
    Blue
};

let bg:Colors=Colors.Red;
console.log(bg);

console.log(Colors.Red===0);
console.log(Colors.Green===1);
console.log(Colors.Blue===2);

// 缺陷
bg=3;
console.log(bg);

console.log(Colors[0]==="Red");
console.log(Colors[1]==="Green");
console.log(Colors[2]==="Blue");

// + = * \
enum Op{
  Add=1,
  Sub=1,
  Mul=2,
  Div=2
};

function f1(a:number,b:number,op:Op) {
    switch (op) {
        case Op.Add:
            
            break;
        case Op.Sub:
            
            break;
        case Op.Mul:
            
            break;
        case Op.Div:
            
            break;
    
        default:
            break;
    }
    
}


// f1(1,4,Op.Add);

console.log(Op.Add>Op.Div);

// ?
console.log(Op.Div);//2
console.log(Op["Div"]);//2
console.log(Op[2]);//Div  覆盖

enum Gender{
    F="女",
    M="男"
}

console.log(Gender.F);
console.log(Gender.M);
console.log(Gender["F"]);

7.接口   interface

对类中  一些行为的  抽象定义------------ 方法
对类中  数据、字段  定义（结构体）--------- 字段
 

interface  User  {
readonly  name:  string; //  只读
age:  number;
phone?:  string; //  可选
[prop:  string]:  any; //  任意
}

let  u1:  User;
u1  =  {name:  'bob',  age:  20,  address:  {}};

//  函数的参数的类型
function  f1  (u:  User)  {
}

console.log(u1);


// u1.name="king lee";  -------readonly
u1.age=33;