美文网首页
TypeScript 学习笔记1 数据类型

TypeScript 学习笔记1 数据类型

作者: 躺希腊额阿毛 | 来源:发表于2019-08-09 13:59 被阅读0次

1.Typescript特征

强类型语言,面向对象,需编译 (比js更像java,js的超集)

2.基本数据类型

布尔值

let isShow: boolean = false;

数字

 let age: number = 20;

字符串

 let email: string = "123@qq.com";
 //模板字符串
 let msg: string = `my emali ${email}`;

数组

 let list: number[] = [1, 2, 3];
 //Array<T泛型

元组

 let arr: [string, number] = ["aaa", 10];
console.log("元组的第一个元素为:" + arr[0]);
//  元组是可变的 更新元组元素
arr[0] = "bbb";
console.log("元组中的第一个元素更新为:" + arr[0]);

数组中元素的数据类型都是相同的,如果存储的元素数据类型不同,则需要使用元组。
元组是一个strict array(严格的数组),因为他不只声明了一个数组,并且同时还规定数组中每个索引处的元素类型。
redis zset 获取 score及value的时候可以设置为 索引双数为 number,索引双数为string。

运算
push() 向元组添加元素,添加在最后面。
pop() 从元组中移除元素(最后一个),并返回移除的元素。

枚举

 enum Weeks {
   Mon, Tue, Wed 
 };
 let day: Weeks = Weeks.Mon;
 console.log(day);  // 0
 console.log(Weeks[0]); // Mon
 console.log(Weeks['Mon']); // 0

Any 变体变量

 let x: any = "aaa";
 
 x = 20;

Void

 // void 无任何类型,函数返回值
 function hello(): void {
     console.log("hello");
 }

Null 和 Undefined

 let x1:undefined

3.其他

3.1 联合类型

 let x2:number | string | boolean;x2 = true;

3.2 类型推论

 let x3 = 3;
 x3 = 123; // number
 let x4; // any

3.3 类型断言

 let x5:number | string | boolean = "this is a string";
 // let x5:any = "this is a string";
 let strlength: number = x5.length;       // 获取length的几种写法
 let strlength1: number = (<stringx5).length;
 let strlength2: number = (x5 as string).length;

3.4 类型兼容性

interface Named {
    name: string;
}

class Person {
    name: string;
}

let p: Named;
// OK, because of structural typing
p = new Person();
let x = (a: number) => 0;
let y = (b: number, s: string) => 0;

y = x; // OK
x = y; // Error

3.5 函数参数双向协变

当比较函数参数类型时,只有当源函数参数能够赋值给目标函数或者反过来时才能赋值成功。

enum EventType { Mouse, Keyboard }

interface Event { timestamp: number; }
interface MouseEvent extends Event { x1: number; y1: number }
interface KeyEvent extends Event { keyCode: number }

function listenEvent(eventType: EventType, handler: (n: Event) => void) {
    console.log('eventType', eventType)
    console.log('handler', handler)
}

// Unsound, but useful and common
listenEvent(EventType.Mouse, (e: MouseEvent) => console.log(e.x1 + ',' + e.y1));

// Undesirable alternatives in presence of soundness
listenEvent(EventType.Mouse, (e: Event) => console.log((<MouseEvent>e).x1 + ',' + (<MouseEvent>e).y1));
listenEvent(EventType.Mouse, <(e: Event) => void>((e: MouseEvent) => console.log(e.x1 + ',' + e.y1)));

// Still disallowed (clear error). Type safety enforced for wholly incompatible types
listenEvent(EventType.Mouse, (e: number) => console.log(e));
运行结果

3.6 可选参数及剩余参数

比较函数兼容性的时候,可选参数与必须参数是可互换的。 源类型上有额外的可选参数不是错误,目标类型的可选参数在源类型里没有对应的参数也不是错误。

function invokeLater(args: any[], callback: (...args: any[]) => void) {
    /* ... Invoke callback with 'args' ... */
}

// Unsound - invokeLater "might" provide any number of arguments
invokeLater([1, 2], (x, y) => console.log(x + ', ' + y));

// Confusing (x and y are actually required) and undiscoverable
invokeLater([1, 2], (x?, y?) => console.log(x + ', ' + y));
运行结果

3.7 类型别名

type Name = string;
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;
function getName(n: NameOrResolver): Name {
    if (typeof n === 'string') {
        return n;
    }
    else {
        return n();
    }
}

3.8 索引类型

keyof T,索引类型查询操作符。 对于任何类型T,keyof T的结果为T上已知的公共属性名的联合。

function pluck<T, K extends keyof T>(o: T, names: K[]): T[K][] {
  return names.map(n => o[n]);
}

interface Person {
    name: string;
    age: number;
}
let person: Person = {
    name: 'Jarid',
    age: 35
};
let strings: string[] = pluck(person, ['name']); // ok, string[]  
console.log(strings); // [ 'Jarid' ]
let personProps: keyof Person; // 'name' | 'age'  

3.9 外部函数申明

declare var 名字

Typescript从0到1-学习视频教程-培训课程-腾讯课堂
TypeScript 中文手册

相关文章

  • Typescript 学习笔记六:接口

    目录: Typescript 学习笔记一:介绍、安装、编译 Typescript 学习笔记二:数据类型 Types...

  • Typescript 学习笔记

    TypeScript 学习笔记 一、基本数据类型 基本数据类型与 JavaScript 一致,包含了 number...

  • TypeScript 学习笔记1 数据类型

    1.Typescript特征 强类型语言,面向对象,需编译 (比js更像java,js的超集) 2.基本数据类型 ...

  • Typescript

    TypeScript(TS)部分 TypeScript学习笔记

  • 学习 之 TypeScript -- VSCode配置与数据类型

    学习 之 TypeScript -- VSCode配置与数据类型 1、配置VSCODE自动编译 1、tsc --i...

  • typescript基本特性了解

    本文主要给大家介绍typescript的基本特性。 1、typeScript中的数据类型 typescript中为...

  • typescript入门学习

    typescript入门学习 一. 数据类型 ​ typescript中为了使编写的代码更规范,更有利于维护,...

  • TypeScriptz学习笔记

    TypeScriptz学习笔记 标签(空格分隔): TypeScript 撩课学院 安装TypeScript Ty...

  • Typescript

    学习笔记 菜鸟教程 《菜鸟教程》-TypeScript简介 《菜鸟教程》-TypeScript安装 《菜鸟教程》-...

  • typeScript学习笔记1

    优势:类型检查,语言扩展,工具属性 强类型语言:不允许改变变量的数据类型,除非进行强制类型转换弱类型语言:变量可以...

网友评论

      本文标题:TypeScript 学习笔记1 数据类型

      本文链接:https://www.haomeiwen.com/subject/fnhidctx.html