函数,导出函数相关视频讲解：

 008_ 输出h字符_REPL_引号_括号_什么是函数

 DLL动态链接库创建

 数据结构与算法-栈-Go代码演示版

Javascript export import使用方法

在Javascript中，我们经常会使用export和import关键字来实现模块化开发。这样可以将代码分割成多个文件，使代码结构更清晰，也方便代码复用。本文将介绍Javascript中export和import的使用方法，并通过代码示例来演示。

export关键字

在Javascript中，可以使用export关键字将一个变量、函数、类等导出，使其可以在其他文件中被引用。export可以使用两种方式进行导出：

  1. 命名导出（Named exports）：通过export关键字导出变量、函数或类。
// 导出变量
export const name = 'Alice';

// 导出函数
export function sayHello() {
  console.log('Hello!');
}

// 导出类
export class Person {
  constructor(name) {
    this.name = name;
  }

  sayName() {
    console.log(`My name is ${this.name}`);
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  1. 默认导出（Default export）：通过export default关键字导出默认值，一个模块只能有一个默认导出。
// 默认导出
const age = 25;
export default age;
  • 1.
  • 2.
  • 3.

import关键字

使用import关键字可以在其他文件中引入已导出的变量、函数或类。import也有两种方式：

  1. 命名导入（Named imports）：引入命名导出的变量、函数或类。
// 引入命名导出的变量
import { name } from './module.js';

// 引入命名导出的函数
import { sayHello } from './module.js';

// 引入命名导出的类
import { Person } from './module.js';
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  1. 默认导入（Default import）：引入默认导出的值。
// 引入默认导出
import age from './module.js';
  • 1.
  • 2.

代码示例

下面是一个简单的示例，展示了如何使用export和import导出和引入模块中的内容：

module.js：

// 导出变量
export const name = 'Alice';

// 导出函数
export function sayHello() {
  console.log('Hello!');
}

// 导出类
export class Person {
  constructor(name) {
    this.name = name;
  }

  sayName() {
    console.log(`My name is ${this.name}`);
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.

index.js：

// 命名导入
import { name, sayHello, Person } from './module.js';

// 默认导入
import age from './module.js';

// 使用导入的内容
console.log(name); // Alice
sayHello(); // Hello!

const person = new Person('Bob');
person.sayName(); // My name is Bob

console.log(age); // 25
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.

类图

Person - name: string +constructor(name: string) +sayName() : void

以上是一个简单的类图，表示了Person类的结构，包括一个私有属性name和一个公有方法sayName。

甘特图

Javascript export import使用方法 2021-10-01 2021-10-02 2021-10-02 2021-10-03 2021-10-03 2021-10-04 2021-10-04 2021-10-05 2021-10-05 2021-10-06 2021-10-06 2021-10-07 导出变量 导出函数 导出类 引入变量 引入函数 引入类 导出 引入 Javascript export import使用方法

以上是一个简单的甘特图，展示了导出和引入的过程及时间节点。

通过本文的介绍，相信你对Javascript中export和import的使用方法有了更清晰的了解。在实际项目中，合理使用export和import可以使代码结构更加清晰，提高代码的可维护性和复用性。希望本文能帮助你更好地应用export和import进行模块化开发。