转载

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;

 

正文到此结束
本文目录