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 类

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