4、TypeScript 类

介绍

  • TypeScript 是面向对象的 JavaScript。
  • 类描述了所创建的对象共同的属性和方法。
  • TypeScript 支持面向对象的所有特性,比如 类、接口等。

定义类的关键字为 class,后面紧跟类名,类可以包含以下几个模块(类的数据成员):

  • 字段 ? 字段是类里面声明的变量。字段表示对象的有关数据。
  • 构造函数 ? 类实例化时调用,可以为类的对象分配内存。
  • 方法 ? 方法为对象要执行的操作。

实例代码

  class  Car {
    // 字段
    engine:string;

    // 构造函数
    constructor(engine:string) {
      this.engine  =  engine
    }

    // 方法
    disp():void {
      console.log("发动机为 : "+this.engine)
    }
  }
  // 创建一个对象
  var  obj  =  new  Car("XXSY1")

  // 访问字段
  console.log("读取发动机型号 : "+obj.engine)

  // 访问方法
  obj.disp()

类的继承

  • TypeScript 支持继承类,即我们可以在创建类的时候继承一个已存在的类,这个已存在的类称为父类,继承它的类称为子类。
  • 类继承使用关键字 extends,子类除了不能继承父类的私有成员(方法和属性)和构造函数,其他的都可以继承。
  • TypeScript 一次只能继承一个类,不支持继承多个类,但 TypeScript 支持多重继承(A 继承 B,B 继承 C)。
  • 继承类的方法重写
  class  PrinterClass {
    doPrint():void {
      console.log("父类的 doPrint()方法。")
      }
    }

  class  StringPrinter  extends  PrinterClass {
    doPrint():void {
      super.doPrint() // 调用父类的函数
      console.log("子类的 doPrint()方法。")
    }
  } 

  var  obj  =  new  StringPrinter();
  obj.doPrint();

输出结果:

  父类的 doPrint() 方法。
  子类的 doPrint()方法。

static 关键字

static 关键字用于定义类的数据成员(属性和方法)为静态的,静态成员可以直接通过类名调用。

  class  StaticMem {
    static  num:number;
    static  disp():void {
    console.log("num 值为 "+  StaticMem.num)
    }
  }

  StaticMem.num  =  12  // 初始化静态变
  StaticMem.disp() // 调用静态方法

instanceof 运算符

instanceof 运算符用于判断对象是否是指定的类型,如果是返回 true,否则返回 false。

  class  Person{ }
  var  obj  =  new  Person()
  var  isPerson  =  obj  instanceof  Person;
  console.log("obj 对象是 Person 类实例化来的吗? "  +  isPerson);

访问控制修饰符

TypeScript 中,可以使用访问控制符来保护对类、变量、方法和构造方法的访问。TypeScript 支持 3 种不同的访问权限。

  • public(默认) : 公有,可以在任何地方被访问。
  • protected : 受保护,可以被其自身以及其子类和父类访问。
  • private : 私有,只能被其定义所在的类访问。
  class  Encapsulate {
    str1:string  =  "hello"
    private  str2:string  =  "world"
  }

  var  obj  =  new  Encapsulate()
  console.log(obj.str1) // 可访问
  console.log(obj.str2) // 编译错误, str2 是私有的

类和接口

类可以实现接口,使用关键字 implements

原文地址:https://www.cnblogs.com/lived/p/10746164.html

时间: 2024-10-11 02:03:20

4、TypeScript 类的相关文章

.NET手撸绘制TypeScript类图——上篇

.NET手撸绘制TypeScript类图--上篇 近年来随着交互界面的精细化,TypeScript越来越流行,前端的设计也越来复杂,而类图正是用简单的箭头和方块,反映对象与对象之间关系/依赖的好方式.许多工具都能生成C#类图,有些工具也能生成TypeScript类图,如tsuml,但存在一些局限性. 我们都是.NET开发,为啥不干脆就用.NET撸一个TypeScript类图呢? 说干就干!为了搞到类图,一共分两步走: 解析.ts文件,生成抽象语法树(AST),并转换为简单的类.属性.方法等对象

TypeScript 类

从ECMAScript 6开始,JS就支持类了.但是如果使用TypeScript也能使用类,并且生成的JS任然可以使用. 来一个例子: /**  * Created by CV-PC153 on 2017/8/9.  */ //创建一个类 class Greeter{     private greeting : string;     constructor(message : string){         this.greeting = message;     }     public

TypeScript——类

ES6之后JS将能够使用基于类的面向对象的方式,TS中的类覆盖了JS中的类 基本实现 “类的成员属性”都是实例属性,而不是原型属性,“类的成员方法”都是“原型”方法 class Dog { constructor(name: string) { this.name = name; } name: string // 需要增加成员类型注释 run() {} } console.log(Dog.prototype) // { run: f, constructor: f } 继承与ES不同的是:实例

Angular2 和TypeScript

Angular2 和TypeScript 原文链接:https://www.infoq.com/articles/Angular2-TypeScript-High-Level-Overview 作者:  Yakov Fain Posted on  Apr 26, 2016 -----------------------------------------------------------------------------------------------------------------

[译]Angular2 和TypeScript -- 一次简要的预览

原文链接:https://www.infoq.com/articles/Angular2-TypeScript-High-Level-Overview 作者:  Yakov Fain Posted on  Apr 26, 2016 ------------------------------------------------------------------------------------------------------------------------------ Angular

转载 《我用 TypeScript 语言的七个月》

快速使用Romanysoft LAB的技术实现 HTML 开发Mac OS App,并销售到苹果应用商店中. <HTML开发Mac OS App 视频教程> 土豆网同步更新:http://www.tudou.com/plcover/VHNh6ZopQ4E/ 百度网盘同步:http://pan.baidu.com/s/1jG1Q58M 分享  [中文纪录片]互联网时代   http://pan.baidu.com/s/1qWkJfcS 官方QQ群:(申请加入,说是我推荐的) App实践出真知 4

TypeScript入门五:TypeScript的接口

TypeScript接口的基本使用 TypeScript函数类型接口 TypeScript可索引类型接口 TypeScript类类型接口 TypeScript接口与继承 一.TypeScript接口的基本使用 1.1定义TypeScript接口的指令(interface) 接口让我们想到的第一个短语就是(API).比如日常我们所说的调用某某程序的API一般都是跨应用的接口,如别的网站的或者APP的接口:还有我们每天都是用的编程语言的指令和内置的方法及属性,这些可以叫做编程语言的接口:还有令我们既

TypeScript最大的目的是让程序员更具创造性

TypeScript 是 JavaScript 的一个超集,支持 ECMAScript 6 标准. TypeScript 由微软开发的自由和开源的编程语言. TypeScript 设计目标是开发大型应用,它可以编译成纯 JavaScript,编译出来的 JavaScript 可以运行在任何浏览器上. 以上为网上对 Typescript 的一些解释,那我们为什么要学 Typescript? 提到前端我们首先会想到 HTML,CSS,JavaScript 三大家族,我们掌握这三个就可以在前端界获得一

[web建站] 极客WEB大前端专家级开发工程师培训视频教程

极客WEB大前端专家级开发工程师培训视频教程  教程下载地址: http://www.fu83.cn/thread-355-1-1.html 课程目录:1.走进前端工程师的世界HTML51.HTML5与HTML4的区别2.HTML5新增的主体结构元素3.HTML5新增的的非主体结构元素 4.HTML5表单新增元素与属性5.HTML5表单新增元素与属性(续)6.HTML5改良的input元素的种类 7.HTML5增强的页面元素8.HTML5编辑API之Range对象(一)9.HTML5编辑API之