首页IT科技模块化工作(模块化开发)

模块化工作(模块化开发)

时间2025-05-02 01:49:41分类IT科技浏览3768
导读:1、模块化的发展过程 var moduleObj = { userName:...

1           、模块化的发展过程

var moduleObj = { userName: zhangsan, fn: function () { console.log(hello world) } }

使用方式

<html> <head> </head> <body> <script src="https://www.cnblogs.com/P1Kaj1uu/archive/2023/01/30/a.js"></script> <script> moduleObj.fn() </script> </body> </html>

立即执行函数的方式

通过立即执行函数的方式为模块提供私有空间

; (function () { var userName = lisi; function fn1() { console.log(userName); } function fn2() { console.log(hello world) } window.moduleObj = { fn1: fn1, fn2: fn2 }; })()

2                  、模块化规范说明

CommonJS它是node.js中提到的一个规范           。也就是说我们在写Node.js的时候            ,必须符合CommonJS的规范                  。

CommonJS规范要求 1      、一个文件就是一个模块 2        、 通过module.exports导出成员项 3                  、通过require函数加载模块 4         、每个模块都有单独的作用域      。

AMD(Asynchronous Module Definition),翻译过来就是异步的模块定义规范        。

define(moduleA,[jquery,./moduleB],function($,moduleB){ return{ fn:function(){ // $(p) } } }) require([./moduleA],function(moduleA){ moduleA.fn(); })

3     、ES Module基本使用

1                  、自动采用了严格模式 2            、每个es module 都是运行在单独的私有的作用域中 3  、`ES module`通过CORS的方式请求外部的JS模块                 ,如果服务端不支持`CORS`      ,则会出现跨域的问题                  。 4                 、ES module的script标签会延迟执行脚本         ,类似于添加了defer.

4               、导出的注意事项

1、注意语法的问题 2              、通过export 对成员进行导出操作                 ,导出的是成员的引用 3                  、导出的成员是只读的         ,那么我们导入了以后是不能对成员进行修改的         。

5   、导入的注意事项

1           、import后面的from跟的是导入的文件的路径      ,并且是一个完整路径     。 2                  、如果我们这里是执行某个模块                 ,并不需要提取其中的成员 import {} from ./module.js import ./module.js 3      、如果某个模块中导出的成员比较多            ,同时我们都需要这些导出的模块成员   , import * as m from ./module.js 4        、如果需要进行动态的导入 import(./module.js).then(function(module) { console.log(module.) }) 5                  、在进行导出的时候                 ,使用了exportexport default,导入import应该怎样进行处理? import title, { userName, userAge } from "./module.js";

创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!

展开全文READ MORE
怎么隐藏word菜单栏(教你如何隐藏Dock 上的程序图标) 手机压缩包损坏怎么修复(手机压缩包损坏修复教程)