ES6模块化导入语导出

最新推荐文章于 2024-08-18 13:05:25 发布

CoderVic

最新推荐文章于 2024-08-18 13:05:25 发布

阅读量291

点赞数

文章标签： es6

本文链接：https://blog.csdn.net/CoderVic/article/details/123894077

版权

本文详细介绍了JavaScript中导出变量、函数和类的不同方式，包括通过`export`关键字的多种用法，以及如何在其他模块中导入和使用这些导出的内容。重点讲解了默认导出和命名导出的区别，适合深入理解模块系统。

摘要由CSDN通过智能技术生成

aaa.js

var name="小明";
var age=18;
var flag=true;
function sum(num1,num2){
	return num1+num2
}
if(flag){
	console.log(sum(10,20))
}
//1. 第一种导出方式
export{
	flag,sum,name
};
//2. 第二种导出方式
export var num1=1000, height=1.8;
//3. 导出函数/类
export function mul(num1,num2){
	return num1*num2
}
export class Person{
	run(){
		console.log("在奔跑")
	};
		name="qyl"
}
// 4.export default
const add="南昌市";
export default add

bbb.js

// 导入{}中定义的变量
import {flag,sum} from "./aaa.js"
if(flag){
	console.log("小明是天才"),
	console.log(sum(20,30))
}
// 直接导入export中定义的变量
import {num1,height} from "./aaa.js"
console.log(num1);
console.log(height)
// 导入export中定义的function
import {mul,Person} from "./aaa.js"
console.log(mul(22,3))
const p=Person

console.log(p.name)
// 默认导入，在同一个module里不允许有多个
import add from "./aaa.js"
console.log(add)

// 统一导入
// import {falg,sum,num1,height,mul}
import * as aaa from "./aaa.js"
console.log(aaa.name)
console.log(aaa.flag)