TypeScript 小记

Posted colima

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了TypeScript 小记相关的知识,希望对你有一定的参考价值。

1. 对比javascript

  • TypeScript是JavaScript的超集,可编译为JavaScript,主要提供类型系统等增强代码的可读性和可维护性,适合中大型项目多人协作;
  • TypeScript只会进行静态检查,如果发现有错误,编译的时候就会报错;

2. 原始数据类型

  • boolean,number,string,null,undefined,void(一般用于返回值);
  • 与void的区别是,undefined和null是所有类型的子类型,也就是说undefined类型的变量,可以赋值给number类型的变量,void不行;

3. 任意值any

  • 赋值为任意类型,如果未指定类型,则为任意值类型;

4. 类型推论

  • 若没指定变量类型赋值,则会根据之前变量的类型进行推论,之后重新赋值会检测类型;

5. 联合类型(Union Types)

  • 多种类型 let a: string | number; 

6. 接口(interface)

  • 用于定义对象的类型,对类的行为进行抽象,对象的描述;接口首字母一般大写;
  • 可选属性:a?: string;
  • 任意属性:[propName: string]: string,一旦定义了任意属性,则确定属性和可选属性都必须是它的子属性;
  • 只读属性:readOnly a: string;只能在创建阶段被赋值;

7. 数组

  • 类型+[] 表示,let arr: number[] = [1, 2, 3];
  • 数组泛型表示,let arr: Array<number> = [1, 2, 3];
  • 接口表示
    interface NumberArray {
        [index: number]: number
    }
    let arr: NumberArray = [1, 2, 3];
  • any表示数组中允许出现任意类型;
  • 常见的类数组都有自己的接口定义,如 IArgumentsNodeListhtmlCollection 等;

8. 函数

  • 会对参数进行约束,不允许输入多余(或少)的参数;
  • 在 TypeScript 的类型定义中,=> 用来表示函数的定义,左边是输入类型,需要用括号括起来,右边是输出类型;
  • 可选参数后面不允许再出现必须参数;
  • TypeScript 会将添加了默认值的参数识别为可选参数,这时就不受「可选参数必须接在必需参数后面」的限制;
  • 重载允许一个函数接受不同数量或类型的参数时,作出不同的处理;

9. 类型断言(Type Assertion)

  • 可以用来手动指定一个值的类型;
  • <类型>变量;
  • 类型断言不是类型转换,断言成一个联合类型中不存在的类型是不允许的;

10. 声明文件

  • declare var jQuery: (selector: string) => any;
  • 通常我们会把类型声明放到一个单独的文件中,这就是声明文件,约定以.d.ts为后缀;
  • 然后在使用到的文件的开头,用「三斜线指令」表示引用了声明文件,
    /// <reference path=‘./jQuery.d.ts‘ />

11. 内置对象

  • Boolean、Error、Date、RegExp等;
  • DOM 和 BOM 的内置对象;
  • TypeScript 核心库的定义文件中定义了所有浏览器环境需要用到的类型,并且是预置在 TypeScript 中;
  • TypeScript 核心库的定义中不包含 Node.js 部分

12. 进阶






以上是关于TypeScript 小记的主要内容,如果未能解决你的问题,请参考以下文章

typescript Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming/angular-2/

typescript Angular最终版本的Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming

typescript Angular最终版本的Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming

typescript Angular最终版本的Angular 2测试片段。代码库https://developers.livechatinc.com/blog/category/programming

async语法升级踩坑小记

typescript 打字稿+角度1的启动片段