TypeScript类的用法详解 – TypeScript开发教程

上一章TypeScript教程请查看：TypeScript三种函数参数解析

在Java等面向对象的编程语言中，类是用来创建可重用组件的基本实体。它是一组具有公共属性的对象。就OOPs而言，类是用于创建对象的模板或蓝图。它是一个逻辑实体。

类定义可以包含以下属性:

• 字段: 它是在类中声明的变量。
• 方法: 它表示对象的一个操作。
• 构造函数: 它负责在内存中初始化对象。
• 嵌套类和接口: 它意味着一个类可以包含另一个类。

TypeScript是一种面向对象的JavaScript语言，所以它支持面向对象的编程特性，比如类、接口、多态、数据绑定等等。JavaScript ES5或更早的版本不支持类。TypeScript支持ES6及以后版本的这个特性。TypeScript内置了对使用类的支持，因为它基于JavaSript的ES6版本。今天，许多开发人员使用基于类的面向对象的编程语言，并将它们编译成JavaScript，它可以在所有主要的浏览器和平台上工作。

声明类的语法

class关键字用于在TypeScript中声明类。我们可以创建一个类与以下语法:

class <class_name>{    
    field;    
    method;    
}  

例子

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

TypeScript编译器在以下JavaScript代码中转换上述类。

var Student = /** @class */ (function () {  
    function Student(code, name) {  
        this.studName = name;  
        this.studCode = code;  
    }  
    Student.prototype.getGrade = function () {  
        return "A+";  
    };  
    return Student;  
}());  

创建类的对象

类通过使用new关键字和类名来创建对象，new关键字在运行时为对象创建分配内存。所有对象获得堆内存区域中的内存。我们可以创建如下所示的对象。

语法

let object_name = new class_name(parameter)  

• new关键字:它用于在内存中实例化对象。
• 表达式的右侧调用可以传递值的构造函数。

例子

//创建对象或实例    
let obj = new Student();  

对象初始化

对象初始化意味着将数据存储到对象中，初始化对象有三种方法。这些都是:

1、通过引用变量

例子

//创建对象或实例     
let obj = new Student();  
  
//通过引用变量初始化对象
obj.id = 101;  
obj.name = "Oreja";  

2. 通过方法

方法类似于用于公开对象行为的函数。

方法的优势

• 代码的可重用性
• 代码优化

例子

//定义一个学生类 
class Student {   
    //defining fields    
    id: number;  
    name:string;  
  
    //creating method or function   
    display():void {   
        console.log("Student ID is: "+this.id)   
        console.log("Student ID is: "+this.name)   
    }   
}   
  
//创建对象或实例    
let obj = new Student();  
obj.id = 101;  
obj.name = "Oreja";  
obj.display();  

3. 通过构造函数

构造函数用于初始化对象。在TypeScript中，构造函数方法总是用名称“constructor”来定义。在构造函数中，我们可以使用这个关键字来访问类的成员。

注意: 在类中不一定总是有一个构造函数。

例子

//定义constructor   
constructor(id: number, name:string) {   
    this.id = id;  
    this.name = name;  
}    

构造函数，方法和对象的例子

//定义一个学生类 
class Student {   
    //定义字段   
    id: number;  
    name:string;  
     
    //定义构造函数
   constructor(id: number, name:string) {   
       this.id = id;  
       this.name = name;  
   }    
     
   //创建方法或函数
   display():void {   
      console.log("Function displays Student ID is: "+this.id)   
      console.log("Function displays Student ID is: "+this.name)   
   }   
}   
  
//创建对象或实例 
let obj = new Student(101, "Van Gogh")  
  
//访问的字段   
console.log("id: " +obj.id,)  
console.log("name: " +obj.name)  
  
//访问方法或函数
obj.display()  

下面的示例没有构造函数

//定义类  
class Student {   
    //属性
    id: number;  
    name:string;  
}   
  
//实例
let obj = new Student();  
  
// 初始化
obj.id = 101;  
obj.name = "Virat Kohli";  
  
//访问属性
console.log("Student ID: " +obj.id,);  
console.log("Student Name: " +obj.name);  

数据隐藏

它是一种用来隐藏内部对象细节的技术，类可以控制其数据成员对其他类成员的可见性。这种功能称为封装或数据隐藏。OOP使用访问修饰符的概念来实现封装，访问修饰符定义类数据成员在其定义类之外的可见性。

TypeScript支持三种类型的访问修饰符。这些都是:

有关访问修饰符的更多信息，请参考前面的章节。