标签搜索

typescript 学习笔记一

cicaba
2019-04-22 / 0 评论 / 5 阅读 / 正在检测是否收录...

typescript环境的搭建

  • 安装环境npm install -g typescript
  • 配置typescript
    在项目的更目录下新建一个tsconfig.json 配置如下
{
  "compilerOptions": {
    "target": "es5",
    "noImplicitAny": false,
    "module": "commonjs",
    "removeComments": true,
    "sourceMap": false,
    "outDir": "Golang/TypeScript/"
  }
  //"include":[
  //     "ts"
  // ],
  //"exclude": [
  //     "js"
  // ]
}
// target:编译之后生成的JavaScript文件需要遵循的标准。有三个候选项:es3、es5、es2015。
// noImplicitAny:为false时,如果编译器无法根据变量的使用来判断类型时,将用any类型代替。为true时,将进行强类型检查,无法推断类型时,提示错误。
// module:遵循的JavaScript模块规范。主要的候选项有:commonjs、AMD和es2015。为了后面与node.js保持一致,我们这里选用commonjs。
// removeComments:编译生成的JavaScript文件是否移除注释。
// sourceMap:编译时是否生成对应的source map文件。这个文件主要用于前端调试。当前端js文件被压缩引用后,出错时可借助同名的source map文件查找源文件中错误位置。
// outDir:编译输出JavaScript文件存放的文件夹。
// include、exclude:编译时需要包含/剔除的文件夹。
  • 编译ts执行tsc -w 会自动检查变化并自动编译

typescript类型约束

typescript 是超javascript有着类型的检测


let str :string; //这里定义str必须为一个字符串类型,否则会报错
str = '小米'
console.log(str)

//数组的类型定义
let arr :number[];//在[]前面定义数组元素的类型
arr = [1,2]
console.log(arr)

//第二种方式是使用数组泛型,Array<元素类型>:
let list: Array<number> = [1, 2, 3];

//第三种方式是使用数组泛型,any类型
let list: any[] = [1, 2, 3];

//元组
let arr :[string,number,boolean];
arr = ['min',2,true]
console.log(arr)

//any
let flag :any = null;//any类型可以赋值任何类型

//vold
某种程度上来说,void类型像是与any类型相反,它表示没有任何类型。 当一个函数没有返回值时,你通常会见到其返回值类型是 void:
fn():vold{
  alert("TS")
}

//never
never类型表示的是那些永不存在的值的类型。 例如, never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型; 变量也可能是 never类型,当它们被永不为真的类型保护所约束时。

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
    return error("Something failed");
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
    while (true) {
    }

接口

  1. 接口的定义 interface
interface Person {
  firstName: string;  
  lastName: string;
}
  1. 接口的作用:用来检测类型
function allname(str:Person){             //str必须是Person的类型(接口一般配合类使用)
  console.log(str.firstName+str.lastName)
}
allname({firstName:"小",lastName:"米"})

  1. 类的定义class
class Name{ //类名必须大写
  age:number;//类型必须提前定义
  constructor(public firstName, public lastName){
    this.age=18
  }
}

接口和类的结合使用

interface Person {
  firstName: string;  
  lastName: string;
}
class Name{
  age:number;
  constructor(public firstName, public lastName){
    this.age=18
  }
}
function allname(str:Person){
  console.log(str)
}
allname(new Name('',''))

枚举

enum Color {Red, Green=0, Blue};
let ColorName:string = Color[0];
console.log(ColorName);
  1. 使用enum定义
  2. 默认是从0开始
  3. 可以手动指定枚举值
  4. 也可以通过枚举值获得它的名字

Any类型
Any类型及任何类型,在编译过程中不会检测类型.
知道部分类型比如:
let arr:Any[] = ["小米"];
类型断言

  1. 使用尖括号方式//("小米").indexOf('小');
  2. as方式//("小米" as string).indexOf('米');

总结
接口: 用来检测类型.
类: 用来生成实例.
多类型定义使用 | 隔开.

0

评论 (0)

取消