TypeScript 学习笔记(一)

TypeScript:

  1、是 JavaScript 的一个超集支持 ES6 标准

  2、由微软开发的自由和开源的编程语言

  3、设计目标是开发大型应用,它可编译成纯 JavaScript,编译出来的 JavaScript 可运行在任何浏览器上

  4、扩展了 JavaScript 的语法,因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改

  5、通过类型注解提供编译时的静态类型检查

  6、可处理已有的 JavaScript 代码,并只对其中的 TypeScript 代码进行编译

TypeScript 数据类型:

  1、布尔值:boolean,表示是或否

// 声明一个布尔类型的变量 flag,它的值为 true
let flag: boolean = true;

  2、数字:number,JavaScript 和 TypeScript 里的数字都是浮点数;TypeScript 支持二进制、八进制、十进制和十六进制

// 前缀为 0b 表示二进制、0o 表示八进制、0x 表示十六进制,默认为十进制
let num: number = 6;

  3、字符串:string,可使用双引号或单引号表示字符串

          模板字符串:反引号 (`) 包围,并且以 ${exp} 形式嵌入表达式 ==》定义多行文本或内嵌表达式

// 定义一个普通的字符串
let name: string = "lemon";

// 模板字符串
let name: string = `Lemon`;
let age: number = 8;
let greet: string = `Hello, my name is ${name}. I am ${age} years old`;

  4、数组:在元素类型后加上 [ ] 或使用数组泛型 Array<元素类型> 来声明数组

let arr: number[] = [1, 2, 3];

// 等价声明
let arr: Array<number> = [1, 2, 3];

  5、元组:允许表示一个已知元素个数和类型的数组,各元素类型不必相同

// 声明一个有 2 个元素,其类型分别为 string 和 number 的元组
let tup: [string, number] = ["Hello", 10];

  6、枚举:enum,为一组数值赋予友好的名字

// 声明枚举变量 color,red 对应值为 0,yellow 为 1,blue 为 2
enum color {red, yellow, blue};
let c: color = color.blue;
console.log(c);    // 控制台输出对应值,这里为 2

// 可采用手动赋值方法
enum color {red = 1, yellow = 3, blue = 6};
console.log(color.yellow);    // 输出 3
console.log(color[3]);  // 输出 yellow

注:名字和值是相互绑定的,可由值找名字,反之也可以找值

  

  7、Any:为在编译阶段还不清楚类型的变量指定一个类型

let notSure: any = 4;
console.log(notSure);    // 输出 4

notSure = "Hello Lemon."; 
console.log(notSure);    // 输出 Hello Lemon.

  8、Void:表示没有任何类型

let voidValue: void = null;
console.log(voidValue);    // 输出 null
voidValue = 2;    // 报错

注:当一个函数没有返回值时,其类型通常为 void,且声明一个 void 类型的变量只能为其传入 undefined 或 null

  9、Null 和 Undefined:默认情况下 null 和 undefined 是所有类型的子类型

let value: null = null;
let num: number = value;
console.log(num + 1);    //输出 1

注:子类型可赋值给父类型,当指定 --strictNullChecks 标记时,null 和 undefined 只能赋值给 void 和它们自己

  10、Never:表示那些永不存在的值的类型(如:总会抛出异常或根本不会返回值的函数表达式或箭头函数表达式的返回值类型;

                       变量被永不为真的类型保护所约束时也可为 never 类型)

  11、Object:表示非原始类型,也就是除 number、string、boolean、symbol、null 或 undefined 之外的类型

类型断言:

  如同其他语言的类型转换,但不进行特殊的数据检查和解构;它没有运行时的影响,只在编译阶段起作用

  TypeScript 会假设您已经进行了必要的检查

  语法:

    1、“尖括号”语法:

let someValue: any = "Hello World";
let strLength: number = (<string> someValue).length;
console.log(strLength);    // 输出 11

    

    2、as 语法:

let someValue: any = "Hello World";
let strLength: number = (someValue as string).length;
console.log(strLength);    // 输出 11

  注:当在 TypeScript 里使用 JSX (JavaScript XML)时,只有 as 语法断言被允许

原文地址:https://www.cnblogs.com/lemonyam/p/11215603.html