📜  如何允许模块中定义的类可以在模块外部访问?

📅  最后修改于: 2022-05-13 01:56:17.753000             🧑  作者: Mango

如何允许模块中定义的类可以在模块外部访问?

在 typescript 中通过使用 import 语句,一个模块可以在另一个模块中使用。模块中声明的任何变量、类、方法或其他对象都不能在模块之外访问。关键字“export”可以用来构造一个模块,而“import”这个词可以用来将它导入另一个模块。让我们演示如何做到这一点。

导出:可以使用单独的.ts 文件来创建模块,该模块可以包含变量、方法和类。对于您打算包含在模块中并从其他模块访问的所有定义,必须在它们之前使用前缀 export

下面的代码保存在一个名为 student.ts 的打字稿文件中。该模块有两个变量和一个名为 student 的类。变量部分可以在另一个模块中使用,因为它以关键字“export”为前缀,但 student_name 变量不能在另一个模块中访问,因为它没有以关键字“export”为前缀。

Javascript
export let section: number = 9;
export class Student {
    student_id: number;
    name: string;
    constructor(name: string, id: number) {
        this.name = name;
        this.student_id = id;
    }
    displayStudentDetails() {
        console.log(
            "student_id: " + `${this.student_id}` + ", 
                Student Name: " + this.name
        );
    }
}
  
let student_name: string = "aditi";


Javascript
import { Student } from "./student";
  
let Object = new Student("richa", 61);
console.log(Object.displayStudentDetails());


Javascript
import * as stu from "./student";
  
let Object = new stu.Student("richa", 61);
console.log(Object.displayStudentDetails());
  
let variable = stu.section;
console.log(variable);


Javascript
import * as stu from "./student";
  
// let Object = new stu.Student("richa", 61);
// console.log(Object.displayStudentDetails());
  
let variable = stu.student_name;
console.log(variable);


Javascript
import { Student as S } from "./three";
  
let Object = new S("richa", 61);
console.log(Object.displayStudentDetails());


导入:当前模块可以使用“import”关键字从其他类访问变量、类等。

句法:

Import { name_of_the_class_or_variable_being_exported } from "file_path"
file_path : file path should be specified without any extension.

我们只能导入那些以关键字“export”为前缀的方法、变量或类。

示例 1:

  • 导入模块的单一导出:在本例中,Student 类是从 student.ts 模块导入的。不会导入来自 student.ts 的其他变量。该文件可以命名为 studentImport.ts。

Javascript

import { Student } from "./student";
  
let Object = new Student("richa", 61);
console.log(Object.displayStudentDetails());

输出:

student_id: 61, Student Name: richa
  • 导入整个模块:在这个例子中,我们从模块中导入所有的导出。 * 语法用于导入前一个模块的所有导出。

Javascript

import * as stu from "./student";
  
let Object = new stu.Student("richa", 61);
console.log(Object.displayStudentDetails());
  
let variable = stu.section;
console.log(variable);

输出:

student_id: 61, Student Name: richa
undefined
9

如果我们尝试导入不以关键字 export 为前缀的 student_name 怎么办?打字稿编译器引发错误。

Javascript

import * as stu from "./student";
  
// let Object = new stu.Student("richa", 61);
// console.log(Object.displayStudentDetails());
  
let variable = stu.student_name;
console.log(variable);

输出:

error TS2339: Property 'student_name' does not exist on type 'typeof import("/Users/...")'.
6 let variable = stu.student_name;

更改模块导出的名称:这里,' as'关键字用于更改导出的名称。有时我们想将导出重命名为更简单的名称,在这种情况下,我们可以重命名导出,如下例所示。此代码在 studentImport.ts 中。

Javascript

import { Student as S } from "./three";
  
let Object = new S("richa", 61);
console.log(Object.displayStudentDetails());

输出:

student_id: 61, Student Name: richa
undefined

编译注意事项:首先必须在终端中编译具有 import 语句的 typescript 文件。

tsc studentImport.ts

然后必须使用以下命令编译创建的 javascript 文件:

node studentImport.js