ES6 之后 typescript 类

作者: 爱尔兰的男孩 | 来源:发表于2018-06-18 15:00 被阅读7次

1.0  typescript 类型断言

letsomeValue:any="this is a string";letstrLength:number= (someValue).length;

另一个为as语法:

let  someValue:any = "this is a string";

let  strLength:number =  ( someValueasstring ).length;

两种形式是等价的。 至于使用哪个大多数情况下是凭个人喜好;然而,当你在TypeScript里使用JSX时,

只有 as语法断言是被允许的。

2.0可选属性

接口里的属性不全都是必需的。 有些是只在某些条件下存在,或者根本不存在。 可选属性在应用“option bags”模式时很常用,即给函数传入的参数对象中只有部分属性赋值了。

下面是应用了“option bags”的例子:// 与function的可选参数类似

interfaceSquareConfig {  

color?:string; 

 width?:number;

}

function createSquare(config: SquareConfig):{color:string; area:number} {

let newSquare = {color:"white", area:100};

if(config.color) {    

newSquare.color = config.color;  

}if(config.width) {    

newSquare.area = config.width * config.width; 

 }

return  newSquare;

}

let mySquare = createSquare ( {color:"black"} ) ;

3.0 只读属性

interfacePoint {

 readonly x:number;

 readonly y:number;

}

你可以通过赋值一个对象字面量来构造一个Point。 赋值后, x和y再也不能被改变了。

letp1: Point = { x:10, y:20};

p1.x =5;// error!

4.0继承接口

和类一样,接口也可以相互继承。 这让我们能够从一个接口里复制成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里。

interfaceShape {   

 color:string;

interface Square extends Shape {    

sideLength:number; 

}

let square = { };

square.color ="blue";

square.sideLength =10;

5.0 泛型

在像C#和Java这样的语言中,可以使用泛型来创建可重用的组件,

functionidentity(arg: T):T{

    return arg;

}

我们给identity添加了类型变量T。 T帮助我们捕获用户传入的类型(比如:number),之后我们就可以使用这个类型。 之后我们再次使用了 T当做返回值类型。现在我们可以知道参数类型与返回值类型是相同的了。 这允许我们跟踪函数里使用的类型的信息。

我们把这个版本的identity函数叫做泛型,因为它可以适用于多个类型。 不同于使用 any,它不会丢失信息,像第一个例子那像保持准确性,传入数值类型并返回数值类型。

6.0枚举

使用枚举我们可以定义一些带名字的常量。 使用枚举可以清晰地表达意图或创建一组有区别的用例。

enum Direction { 

 Up =1, 

 Down, 

 Left, 

 Right

}

如上,我们定义了一个数字枚举, Up使用初始化为 1。 其余的成员会从 1开始自动增长。 换句话说,Direction.Up的值为 1, Down为 2, Left为 3, Right为 4。

之后有时间在接着写

相关文章

  • ES6 之后 typescript 类

    1.0 typescript 类型断言 letsomeValue:any="this is a string";l...

  • TypeScript中的关键字static

    TypeScript中的关键字static ES6中的静态成员在TypeScript也存在,类的静态成员可以使用类...

  • TypeScript 装饰器

    TypeScript 与 ES6 的装饰器? ES6 的装饰器是一种函数,写成@ + 函数名。它可以放在类和类方法...

  • TypeScript入门

    TypeScript起步入门 typeScript的存在,无疑就是为了更加规范化,是继ES5,ES6之后更加高级的...

  • TypeScript 学习笔记

    学习Typescript 之前 要搞清楚 javascript typescript es6 三者的关系ES6是什...

  • TypeScript系列(四)类的初体验

    类的介绍 ES6之前Javascript是使用函数和基于原型的继承来实现类的概念。而在Typescript中则可以...

  • TypeScript(三)类

    TypeScript中的类不仅具有ES6中类的全部功能,还提供了修饰符、抽象类等其他新功能。 用法 类使用clas...

  • 2-2+2-3+2-4+2-5【原型】-深度透彻掌握原型

    慕课TS高级课程 第二章 深度掌握TypeScript OOP 2-10 TS 类 和 ES6 类对比 1. 为...

  • TypeScript的类

    1. 类的定义 TypeScript中的类和ES6中类的定义类似,但是也有区别 对象属性设置的时候需要在后面打上...

  • TypeScript中类的使用

    类的使用 typescript中类的概念和java以及es6中的基本一样,没什么区别,上例子。 1.类的定义及使用...

网友评论

    本文标题:ES6 之后 typescript 类

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