面试题：JavaScript中ES6模块默认导出与命名导出的基础使用

Question

请分别使用默认导出和命名导出的方式，在一个JavaScript模块中导出一个函数和一个对象。然后在另一个模块中导入并使用这些导出的内容。

Answer 1

1. 创建包含导出内容的模块 exportModule.js

• 默认导出：

// 定义一个函数
function defaultFunction() {
    console.log('这是默认导出的函数');
}
// 定义一个对象
const defaultObject = {
    message: '这是默认导出的对象'
};
// 默认导出函数
export default defaultFunction;
// 也可以同时默认导出对象，这里为了演示清晰分开写
// export default defaultObject; 

• 命名导出：

// 定义一个函数
export function namedFunction() {
    console.log('这是命名导出的函数');
}
// 定义一个对象
export const namedObject = {
    message: '这是命名导出的对象'
};

2. 创建导入并使用导出内容的模块 importModule.js

• 导入默认导出内容：

import defaultExportedFunction from './exportModule.js';
defaultExportedFunction(); 
// 导入默认导出的对象（如果在exportModule.js中默认导出了对象）
// import defaultExportedObject from './exportModule.js';
// console.log(defaultExportedObject.message); 

• 导入命名导出内容：

import { namedFunction, namedObject } from './exportModule.js';
namedFunction();
console.log(namedObject.message);