• TS


    TypeScript支持面向对象的编程特性,比如类、接口、继承、泛型等等

    泛型

    TypeScript泛型是一个提供创建可重用组件方法的工具。它能够创建可以处理多种数据类型而不是单一数据类型的组件。泛型允许我们创建泛型类、泛型函数、泛型方法和泛型接口。

    在泛型中,类型参数写在开(<)和闭(>)括号之间。泛型使用一种特殊类型的类型变量<T>

    function identity<T>(arg: T): T {      
        return arg;      
    }      
    let output1 = identity<string>("myString");      
    let output2 = identity<number>( 100 );    
    console.log(output1);    
    console.log(output2);

    我们知道,TypeScript是一种面向对象的JavaScript语言,支持类、接口等。类是一组具有公共属性的对象。类是创建对象的模板或蓝图。它是一个逻辑实体。“class”关键字用于在Typescript中声明一个类。

    class Student {    
        studCode: number;    
        studName: string;    
        constructor(code: number, name: string) {    
                this.studName = name;    
                this.studCode = code;    
        }    
        getGrade() : string {    
            return "A+" ;    
        }    
    }  

    面向对象主要有四个原则:继承、封装、多态性、抽象

    继承可以通过使用extend关键字来实现类的继承:

    class Shape {     
       Area:number     
       constructor(area:number) {     
          this.Area = area    
       }     
    }     
    class Circle extends Shape {     
       display():void {      
          console.log("圆的面积: "+this.Area)     
       }    
    }    
    var obj = new Circle(320);     
    obj.display()  

    TS的模块

    模块是创建一组相关变量、函数、类和接口等的强大方法。它可以在它们自己的范围内执行,而不是在全局范围内。换句话说,在模块中声明的变量、函数、类和接口不能在模块外部直接访问。

    创建一个模块:

    module module_name{  
        class xyz{  
            export sum(x, y){  
                return x+y;  
             }  
        }  
    } 

    可选参数

    function Demo(arg1: number, arg2? :number) {}   // 因此,arg1总是必需的,而arg2是一个可选参数 可选参数总在最后  

    函数重载

    所谓函数重载就是同一个函数,根据传递的参数不同,会有不同的表现形式

    TypeScript的函数重载只有一个函数体,也就是说无论声明多少个同名且不同签名的函数,它们共享一个函数体,在调用时会根据传递实参类型的不同,利用流程控制语句控制代码的执行

    function done(x:string):string;
    function done(x:number):number;
    function done(x:any):any{
      if(typeof x=="string"){
        return "重载"
      }else if(typeof x=="number"){
        return 5
      }
    }

    TS定义管理器

    TypeScript定义管理器(TSD)是一个包管理器,用于直接从社区驱动的DefinitelyTyped库中搜索和安装TypeScript定义文件。

    假设我们想在.ts文件中使用一些jQuery代码。

    $(document).ready(function() { //Your jQuery code });

    现在,当我们尝试使用tsc编译它时,它会给出一个编译时错误: 找不到名称“$”。因此,我们需要通知TypeScript编译器“$”属于jQuery。要做到这一点,TSD就要发挥作用。我们可以下载jQuery类型定义文件并将其包含在.ts文件中。

    TypeScript Declare关键字

    TypeScript 作为 JavaScript 的超集,在开发过程中不可避免要引用其他第三方的 JavaScript 的库。虽然通过直接引用可以调用库的类和方法,但是却无法使用TypeScript 诸如类型检查等特性功能。为了解决这个问题,需要将这些库里的函数和方法体去掉后只保留导出类型声明,而产生了一个描述 JavaScript 库和模块信息的声明文件。通过引用这个声明文件,就可以借用 TypeScript 的各种特性来使用库文件了。declare 定义的类型只会用于编译时的检查,编译结果中会被删除。

    declare var jQuery: (selector: string) => any;
    jQuery('#foo');
    
    // 编译结果为
    jQuery('#foo');

    tsconfig.son文件吗

    tsconfig.son文件是json格式的文件。tsconfig.json文件中,我们可以指定各种选项告诉编译器如何编译当前项目。目录中存在tsconfig.json文件,表明该目录是TypeScript项目的根目录。 下面是一个示例tsconfig.json文件。

    {  
       "compilerOptions": {  
          "declaration": true,      
          "emitDecoratorMetadata": false,      
          "experimentalDecorators": false,      
          "module": "none",      
          "moduleResolution": "node"  
          "removeComments": true,  
          "sourceMap": true  
       },  
       "files": [  
          "main.ts",  
          "othermodule.ts"  
        ]  
    } 

    TS的“interface”和“type”语句有什么区别?

    类型断言

    类型断言的工作方式类似于其他语言中的类型转换

    let employeeCode = <number> code;     
    console.log(typeof(employeeCode)); // : number  
    
    // as是TypeScript中类型断言的附加语法,引入as-语法的原因是原始语法(<type>)与JSX冲突。
    et empCode: any = 111;     
    let employeeCode = code as number;  

    剩余参数

    一个函数中只允许有一个rest参数,它必须是数组类型,它必须是参数列表中的最后一个参数

    function sum(a: number, ...b: number[]): number {    
     let result = a;    
     for (var i = 0; i < b.length; i++) {    
     result += b[i];    
     }    
     console.log(result);    
    }    
    let result1 = sum(3, 5);    
    let result2 = sum(3, 5, 7, 9);

    枚举类型

    枚举是一种数据类型,允许我们定义一组命名常量。使用枚举可以更容易地记录意图,或者创建一组不同的案例。它是相关值的集合,可以是数值或字符串值。

    enum Gender {  
      Male,  
      Female  
      Other  
    }  
    console.log(Gender.Female); // : 1  
    // 我们还可以通过enum值的number值来访问它
    console.log(Gender[1]); // : Female  

    生命合并

    将具有相同名称的声明合并为单个定义

    interface Cloner {  
        clone(animal: Animal): Animal;  
    }  
    interface Cloner {  
        clone(animal: Sheep): Sheep;  
    }  
    interface Cloner {  
        clone(animal: Dog): Dog;  
        clone(animal: Cat): Cat;  
    }
    
    // 这三个接口将合并为一个单独的声明
    interface Cloner {  
        clone(animal: Dog): Dog;  
        clone(animal: Cat): Cat;  
        clone(animal: Sheep): Sheep;  
        clone(animal: Animal): Animal;  
    } 

    注: 在TypeScript中不是所有的合并都允许。目前,类不能与其他类或变量合并。

    原文:http://www.srcmini.com/3507.html

  • 相关阅读:
    Grid布局方式
    布局
    应用主题资源
    主题资源
    返回键
    标记 {x:Null},d:DesignWidth,d:DesignHeight
    WMAppManifest.xml
    项目模板
    Panorama和Pivot控件
    ashx页面中context.Session["xxx"]获取不到值的解决办法
  • 原文地址:https://www.cnblogs.com/xjy20170907/p/12844747.html
Copyright © 2020-2023  润新知