JavaScript 模块化编程

简介:

模块化就是js与js之间的调用,类似于Java类与类之间的调用。使用模块化可以使项目结构更加清晰明了,代码更加优雅。

es5写法:

demo1.js

//定义方法
const hello=function(){
	return "hello";
}
const ok=function(){
	return "ok";
}
//指定哪些方法可以被调用
module.exports={
	hello,
	ok
}

demo2.js

//引入要调用的文件
const m=require('./demo1.js')

console.log(m.hello());
console.log(m.ok());

结果:
在这里插入图片描述

es6写法(需要Babel转成es5才能运行):

demo1.js 定义被调用方法

export default{
	hello(){
		return "hello";
	},
 	ok(){
		return "ok";
	}
	
}
 
 

demo2.js 引入文件,调用方法。

import m from './demo1.js'

console.log(m.hello());
console.log(m.ok());

进入根目录使用Babel 转码,具体使用请看上一篇博客

babel es6 -d es6_1

在这里插入图片描述
进入转码后的目录运行代码:
在这里插入图片描述

帮助到您请点赞关注收藏谢谢!!

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值