JS模块化加载器学习(二) 思路

要实现模块化加载器,有几个重点

1、JS文件路径解析

2、下载JS文件

3、将定义的模块缓存

4、加载依赖

我看到的几个实例中下载文件都是使用document创建script标签,设置src的方式下载文件,这里 我使用jquery的ajax方法下载JS文件,因此文件路径的解析会有些不同。使用创建script标签的方式可以获取当前运行的JS的文件路径,但是对于jquery的ajax就不行了。焦点script的src属性是空的,因此路径解析时如果是相对路径要依据模块化加载器的文件路径解析。且define的id直接被路径替换了,相当于模块名强制就是文件名。为了稍微靠近 考虑从options中预先定义一个存储名字-路径转换关系的array。

define中,将文件的路径、依赖数组、function存储起来

在use中,根据路径或预先定义的转换关系中的名字 找到模块的依赖数组和function,加载模块的依赖属性到模块的function中,将模块的function作为参数按use方法中定义的依赖顺序传递给use方法的参数function中,执行use方法的参数functiong。比较绕口,用伪代码辅助描述下:

define(id,deps,fun);

  根据id作为键,将deps和fun存储起来

use(deps,fun);

  遍历deps,根据当前元素作为路径下载JS文件,在该js中调用了define方法,下载到的文件是字符串,使用new Function()方法转成function。执行function 相当于执行了define方法,执行时 将真正想要的function和依赖数组存储起来了。因此执行后 根据当前元素作为键就可以获取到目标模块的依赖数组和function,此时有两种选择:1

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

纵马饮白虹

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值