当前位置: 首页 > news >正文

工具链和其他-异步模块加载

目录

CMD/AMD

Asynchronous Module Definition(AMD异步模块定义,语法风格)

Common Module Definition

ES6/CommonJS

CommonJS

ES6 Module

加载器示例

总结


cmd和amd的区别

现在有哪些异步加载方式

整体结构

编程:commonjs es6 module (有可能解析不了,需要传输层)

传输:cmd/amd(早期是异步加载模块用的,不是一个中间层;现在是一个加载模块,不把程序写在里面)

执行:require.js webpack模块加载器......(异步加载器)

CMD/AMD

Asynchronous Module Definition(AMD异步模块定义,语法风格)

amd不是一个很好的设计

// 模块创建
// a.js
define(['functions/foo'], (foo) => { // 数组:依赖foo——文件在functions/fooconsole.log(foo())
})
// 模块使用
// a.js
//         数组代表所有依赖                函数接收所有依赖
require(['jquery', 'a.js'], ($, printFoo) => {$("#foo").click(()=> {printFoo()    })
})

Common Module Definition

// 模块使用
// a.js
define((require, exports) => {function printFoo() {const foo = require('./foo') // 声明后置console.log(foo())    }exports = printFoo // 声明后置 用到在声明
})
// 模块使用
// a.js
use((require) => {const $ = require('jquery') // 同步模型,异步的话可以用asyns await,promiseconst printFoo = require('./a.js')$("#foo").click(() => {printFoo()    })
})

ES6/CommonJS

CommonJS

node支持

浏览器访问转义为浏览器可解读的cmd

// 模块使用
// a.js
function A(){...}
module.exports = A
// 模块引用
const A = require("./a.js")
A()

ES6 Module

// 模块使用
// a.js
function A(){...}
export default A
// 模块引用
import A from './a.js'
A()

加载器示例

const express = require('express')
const app = express() 
const path = require('path')
app.use(express.static(path.resolve(__dirname, 'lib')))
app.get('/', (req, res) => {res.send(`<html><body><script src='/require.js' ></script><script>require.path = '/'require(['add', 'mult'], (add, mult) => {console.log(add(3, 5))console.log(mult(3, 5))})</script></body></html>`)
})
app.listen(3000)
// add.js
define('add', (a, b) => {return a + b
})
// mult.js
define('mult', (a, b) => {return a * b
})

总结

  • CMD/AMD:底层建设 (浏览器用的)
  • CommonJS/ES6 Module: 书写规范

相关文章:

工具链和其他-异步模块加载

目录 CMD/AMD Asynchronous Module Definition(AMD异步模块定义&#xff0c;语法风格) Common Module Definition ES6/CommonJS CommonJS ES6 Module 加载器示例 总结 cmd和amd的区别 现在有哪些异步加载方式 整体结构 编程&#xff1a;commonjs es6 module (有可能解…...

第一次使用R语言

在R语言中&#xff0c;“<-”符号与“”意义一样。另一种奇怪的R语言的等号表示方法&#xff0c;是以“->”表示&#xff0c;但是用得少。 有些计算机语言&#xff0c;变量在使用前要先定义&#xff0c;R语言则不需先定义&#xff0c;可在程序中直接设定使用。 若在Con…...

《语文教学通讯》栏目 收稿范围

《语文教学通讯》创刊于1978年&#xff0c;是由山西师范大学主管&#xff0c;山西师大教育科技传媒集团主办的期刊。历年被人民大学书报资料中心转载、复印的篇幅数量均居同类报刊之首。国内刊号&#xff1a;CN 14-1017/G4&#xff0c;国际刊号&#xff1a;ISSN 1004-6097&…...

Towards Principled Disentanglement for Domain Generalization

本文用大量的理论论述了基于解纠缠约束优化的域泛化问题。 这篇文章认为以往的文章在解决域泛化问题时所用的方法都是non-trivial的&#xff0c;也就是说没有作严格的证明&#xff0c;是不可解释的&#xff0c;而本文用到大量的定理和推论证明了方法的有效性。 动机 因为域泛…...

计算机网络学习02

1、TCP 与 UDP 的区别&#xff1f; 是否面向连接 &#xff1a; UDP 在传送数据之前不需要先建立连接。而 TCP 提供面向连接的服务&#xff0c;在传送数据之前必须先建立连接&#xff0c;数据传送结束后要释放连接。是否是可靠传输&#xff1a; 远地主机在收到 UDP 报文后&…...

网络交换机端口管理工具

如今&#xff0c;企业或组织级网络使用数百个交换机端口作为其 IT 基础架构的一部分来实现网络连接。这使得交换机端口管理成为日常网络管理任务的一部分。传统上&#xff0c;网络管理员必须依靠手动网络交换机端口管理技术来跟踪交换机及其端口连接状态。这种手动任务弊大于利…...

redis五大命令kv设计建议内存淘汰

什么是redis&#xff1f;主要作用&#xff1f; redis(remote dictionary server)远程字典服务&#xff1a;是一个开源的使用ANSI C语言编写&#xff0c;支持网络、可基于内存可持久化的日志型、key-value数据库&#xff0c;并提供多种语言的api redis的数据存在内存中&#xff…...

如何真正认识 Linux 系统结构?这篇文章告诉你

Linux 系统一般有 4 个主要部分&#xff1a;内核、shell、文件系统和应用程序。内核、shell 和文件系统一起形成了基本的操作系统结构&#xff0c;它们使得用户可以运行程序、管理文件并使用系统。 Linux内核 内核是操作系统的核心&#xff0c;具有很多最基本功能&#xff0c;…...

【移动端网页布局】流式布局案例 ① ( 视口标签设置 | CSS 样式文件设置 | 布局宽度设置 | 设置最大宽度 | 设置最小宽度 )

文章目录 一、视口标签设置二、CSS 样式文件设置三、布局宽度设置1、设置布局宽度2、设置布局最大宽度3、设置布局最小宽度4、查看网页最大最小宽度5、布局宽度设置 四、代码示例1、主界面标签2、CSS 布局设置 一、视口标签设置 参考 【移动端网页布局】移动端网页布局基础概念…...

力扣---LeetCode88. 合并两个有序数组

文章目录 前言88. 合并两个有序数组链接&#xff1a;方法一&#xff1a;三指针(后插)1.2 代码&#xff1a;1.2 流程图&#xff1a;方法二&#xff1a;开辟新空间2.1 代码&#xff1a;2.2 流程图&#xff1a;2.3 注意&#xff1a; 总结 前言 “或许你并不熠熠生辉甚至有点木讷但…...

H7-TOOL的CANFD Trace全解析功能制作完成,历时一个月(2023-04-28)

为了完成这个功能&#xff0c;差不多耗费了一个月时间&#xff0c;精神状态基本已经被磨平了。 当前已经支持&#xff1a; 1、LUA小程序控制&#xff0c;使用灵活。 2、采用SWD接口直接访问目标板芯片的CANFD外设寄存器和CANFD RAM区实现&#xff0c;支持USB&#xff0c;以太网…...

探析Android中的四类性能优化

作者&#xff1a;Yj家的孺子牛 流畅性优化 主线程模型 了解 Android 的流畅性优化之前&#xff0c;我们需要先了解Android的线程结构。在 Android 中&#xff0c;有一个主线程模型&#xff0c;其中所有的绘制以及交互都是在主线程中进行的&#xff0c;所以&#xff0c;当我们…...

ubuntu18.04 安装编译zlmediakit

参考http://www.cherrylord.cn/archives/zlmediakit 1、获取代码 #国内用户推荐从同步镜像网站gitee下载 git clone --depth 1 https://gitee.com/xia-chu/ZLMediaKit cd ZLMediaKit #千万不要忘记执行这句命令 git submodule update --init#国内用户推荐…...

C++ -5- 内存管理

文章目录 C语言和C内存管理的区别示例1. C/C 中程序内存区域划分2. C中动态内存管理3.operator new 与 operator delete 函数4.new 和 delete 的实现原理5.定位new表达式 C语言和C内存管理的区别示例 //C语言&#xff1a; struct SListNode {int data;struct SListNode* next; …...

(Linux)在Ubuntu系统中添加新用户并授予root权限

向Ubuntu系统中添加新用户并为其授予root权限的步骤如下: 打开终端Terminal 输入命令: sudo su - 以 root 身份登录. 注: sudo su : 切换root身份, 不携带当前用户环境变量 sudo su - : 切换root身份, 携带当前用户环境变量 输入命令: adduser username 向Ubuntu系统中添…...

AttributeError: ‘ChatGLMModel‘ object has no attribute ‘prefix_encoder‘

大家好,我是爱编程的喵喵。双985硕士毕业,现担任全栈工程师一职,热衷于将数据思维应用到工作与生活中。从事机器学习以及相关的前后端开发工作。曾在阿里云、科大讯飞、CCF等比赛获得多次Top名次。现为CSDN博客专家、人工智能领域优质创作者。喜欢通过博客创作的方式对所学的…...

Huggingface的GenerationConfig 中的top_k与top_p详细解读

Huggingface的GenerationConfig 中的top_k与top_p详细解读 Top_kTop_p联合共用 Top_k top-k是指只保留概率最高的前k个单词&#xff0c;然后基于剩余单词的概率进行归一化&#xff0c;从中随机抽取一个单词作为最终输出。这种方法可以限制输出序列的长度&#xff0c;并仍然保持…...

学生信息管理系统简易版(文件读写操作)

功能模块 具体功能如下&#xff1a; 添加学生信息修改学生信息&#xff08;按学号&#xff09;排序&#xff08;分别按总分升序、降序、以及按姓名升序&#xff09;查找学生&#xff08;按学号&#xff09;删除学生查看所有学生信息 数据结构体设计 本表设计一个学生信息的结…...

C/C++每日一练(20230426)

目录 1. 不喜欢带钱的小C &#x1f31f;&#x1f31f; 2. 数组排序 ※ 3. 超级素数 ※ &#x1f31f; 每日一练刷题专栏 &#x1f31f; Golang每日一练 专栏 Python每日一练 专栏 C/C每日一练 专栏 Java每日一练 专栏 1. 不喜欢带钱的小C 小C不喜欢带钱&#xff0c…...

halcon灰度积分投影/垂直积分投影

简介:关于灰度投影积分可以用到的场合很多,例如分割字符,分割尺子上的刻度等,适用于有规律的变化这些内容的检测。本文复现了论文《基于深度学习和灰度纹理特征的铁路接触网绝缘子状态检测》中灰度积分投影实现了对绝缘子缺陷位置的检测。见(图1)灰度积分垂直方向投影获得…...

Python|GIF 解析与构建(5):手搓截屏和帧率控制

目录 Python&#xff5c;GIF 解析与构建&#xff08;5&#xff09;&#xff1a;手搓截屏和帧率控制 一、引言 二、技术实现&#xff1a;手搓截屏模块 2.1 核心原理 2.2 代码解析&#xff1a;ScreenshotData类 2.2.1 截图函数&#xff1a;capture_screen 三、技术实现&…...

conda相比python好处

Conda 作为 Python 的环境和包管理工具&#xff0c;相比原生 Python 生态&#xff08;如 pip 虚拟环境&#xff09;有许多独特优势&#xff0c;尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处&#xff1a; 一、一站式环境管理&#xff1a…...

Prompt Tuning、P-Tuning、Prefix Tuning的区别

一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning(提示调优) 核心思想:固定预训练模型参数,仅学习额外的连续提示向量(通常是嵌入层的一部分)。实现方式:在输入文本前添加可训练的连续向量(软提示),模型只更新这些提示参数。优势:参数量少(仅提…...

【机器视觉】单目测距——运动结构恢复

ps&#xff1a;图是随便找的&#xff0c;为了凑个封面 前言 在前面对光流法进行进一步改进&#xff0c;希望将2D光流推广至3D场景流时&#xff0c;发现2D转3D过程中存在尺度歧义问题&#xff0c;需要补全摄像头拍摄图像中缺失的深度信息&#xff0c;否则解空间不收敛&#xf…...

Neo4j 集群管理:原理、技术与最佳实践深度解析

Neo4j 的集群技术是其企业级高可用性、可扩展性和容错能力的核心。通过深入分析官方文档,本文将系统阐述其集群管理的核心原理、关键技术、实用技巧和行业最佳实践。 Neo4j 的 Causal Clustering 架构提供了一个强大而灵活的基石,用于构建高可用、可扩展且一致的图数据库服务…...

微服务商城-商品微服务

数据表 CREATE TABLE product (id bigint(20) UNSIGNED NOT NULL AUTO_INCREMENT COMMENT 商品id,cateid smallint(6) UNSIGNED NOT NULL DEFAULT 0 COMMENT 类别Id,name varchar(100) NOT NULL DEFAULT COMMENT 商品名称,subtitle varchar(200) NOT NULL DEFAULT COMMENT 商…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

实现弹窗随键盘上移居中

实现弹窗随键盘上移的核心思路 在Android中&#xff0c;可以通过监听键盘的显示和隐藏事件&#xff0c;动态调整弹窗的位置。关键点在于获取键盘高度&#xff0c;并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...

JVM暂停(Stop-The-World,STW)的原因分类及对应排查方案

JVM暂停(Stop-The-World,STW)的完整原因分类及对应排查方案,结合JVM运行机制和常见故障场景整理而成: 一、GC相关暂停​​ 1. ​​安全点(Safepoint)阻塞​​ ​​现象​​:JVM暂停但无GC日志,日志显示No GCs detected。​​原因​​:JVM等待所有线程进入安全点(如…...

Linux 内存管理实战精讲:核心原理与面试常考点全解析

Linux 内存管理实战精讲&#xff1a;核心原理与面试常考点全解析 Linux 内核内存管理是系统设计中最复杂但也最核心的模块之一。它不仅支撑着虚拟内存机制、物理内存分配、进程隔离与资源复用&#xff0c;还直接决定系统运行的性能与稳定性。无论你是嵌入式开发者、内核调试工…...