RequireJS - 将参数传递给模块进行初始化 - 腾讯云开发者社区

tr id = "1" > 在 index.html 获取 id ，通过 id 在后台进行数据的查询...，然后将结果显示到另一个页面 other.html 。...短路操作昨晚一直没转过来脑子，使用 ajax 传值后，无法跳转网页，或者跳转网页后会多查询一次。使用 render_template 也没法跳转。

1.9K2 0

RequireJS 入门指南简介RequireJS?data-main属性配置函数用RequireJS定义模块使用require函数

当依赖加载以后，RequireJS计算出模块定义的顺序，并按正确的顺序进行调用。这意味着你需要做的仅仅是使用一个“根”来读取你需要的所有功能，然后剩下的事情只需要交给RequireJS就行了。...在后面，我们将教你如果使用这些函数，但首先让我们先了解下RequireJS的加载流程。...配置函数如果你想改变RequireJS的默认配置来使用自己的配置，你可以使用require.configh函数。config函数需要传入一个可选参数对象，这个可选参数对象包括了许多的配置参数选项。...shims——配置在脚本/模块外面并没有使用RequireJS的函数依赖并且初始化函数。...deps——加载依赖关系数组用RequireJS定义模块模块是进行了内部实现封装、暴露接口和合理限制范围的对象。ReuqireJS提供了define函数用于定义模块。

1.5K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

Javascript模块化详解

模块不能直接在浏览器中运行，需要进行转换、打包由于CommonJS是同步加载模块，这对于服务器端不是一个问题，因为所有的模块都放在本地硬盘。...官网介绍RequireJS是一个js文件和模块的加载器，提供了加载和定义模块的api，当在页面中引入了RequireJS之后，我们便能够在全局调用define和require。 define(id?...然而，如果工厂方法的长度属性小于3，加载器会选择以函数的长度属性指定的参数个数调用工厂方法。 factory：模块的工厂函数，模块初始化要执行的函数或对象。如果为函数，它应该只被执行一次。...前面介绍用define来定义一个模块的时候，直接传“模块名”似乎就能找到对应的文件，这一块是在哪实现的呢？...也就是说，在模块顶层使用this关键字，是无意义的同一个模块如果加载多次，将只执行一次 Node加载 Node要求 ES6 模块采用.mjs后缀文件名。

5822 0

requirejs 源码简析

requirejs 算是几年前一个比较经典的模块加载方案(AMD的代表)。...getModule 和 makeModuleMap 主要用于生成及获取模块相关的参数。 requireMod.init (Module.init) 表示需要加载的模块开始进行加载的初始化工作。...模块的定义与加载除了主入口以外，其它模块都会采用 define 函数进行模块的定义，下面是例子中 util 及其相关依赖模块。...，requirejs 除了通过第一个参数的依赖数组以外，还会通过匹配 cjsRequireRegExp 的值，进行依赖的分析，然后将相关的模块名、上下文都进行初始化： /** * The function...加载完主入口文件之后，会开始依次加载这些依赖模块，并且也会逐个依赖模块进行依赖分析，以此类推。

1.6K10 1

与 JavaScript 模块相关的所有知识点

它们可以在匿名函数内部直接访问，也可以通过匿名函数的参数进行传递： // Define IIFE module with dependencies. const iifeCounterModule =...AMD 的 require 接受要使用的模块的名称，并将模块传递给函数参数。动态加载 AMD 的 require 函数还有另一个重载。...调用IIFE时，将评估其参数。参数评估检测环境（CommonJS / Node.js的模块变量和exports 变量，以及 AMD/RequireJS 的 define 函数）。...如果环境是 CommonJS/Node.js，则匿名函数的参数是手动创建的 define 函数。如果环境是 AMD/RequireJS，则匿名函数的参数就是 AMD 的 define 函数。...并且这 4 个函数作为参数传递给匿名函数。 Babel 模块：从 ES 模块转换 Babel 是另一个为旧版环境（如旧版浏览器）把 ES6 + JavaScript 代码转换为旧版语法的编译器。

2.1K2 0

JS模块加载系统设计V1

的语句,但是这是mass.js版本的requireJs,下面就来解读源代码: var path = location.protocol + "//" + location.host +"/Javasript...函数对象,也就是说你通过require.config传递的参数,实际都会传递给$.config函数,个人觉得这个设计蛮不错的,当我们以后有新的模块需要进行类似的配置时,也可以通过这种方式,增强了代码的复用性...,过滤其中的属性(不是该对象的原生属性(也就是通过原型链添加的属性))，然后判断当前遍历到的属性是否是kernel对象的插件(这里用函数表示),如果是吊用该插件,然后通过当前的属性,拿到对应对象的值,将值作为参数传递给该插件...2、遍历传入的参数,做一些常规判断,如果命名相同,则进行重写操作,并进行提醒,不相同直接加入到alias集合中去加下来看require方法了: require("jquery", function...(2)、都二个factory,这个参数是回调函数 (3)、第三个parent,可以通过这个参数指定basePath,basePath下面也会介绍

7405 0

前端相关片段整理——持续更新

一个参数时，返回该参数参数不是对象，转成对象（undefined，null会报错），若为源对象位置，则跳过可用来操作数组，将数组视为对象浅拷贝非深拷贝（若源对象的有对象属性值，则拷贝的是该引用）...规范 require([module], callback); 模块加载与调用不同步，浏览器不会发生假死 requirejs curljs CMD seajs推广中对模块定义的产出 CMD与AMD区别...： amd推崇依赖前置（定义模块时申明其依赖的模块），cmd推崇依赖就近（用时再require） amd的api默认一当多，cmd推崇职责单一（amd中require分全局和局部） requirejs...与 seajs 分析：定位，requirejs想成为浏览器端的模块加载器，也想成为rhino/node等环境的模块加载器 seajs专注web浏览器端，通过node扩展方式方便跑在node端标准，...DOM构造都是通过虚拟DOM进行，每当数据变化时，React都会重新构建整个DOM树，然后React将当前整个DOM树和上一次的DOM树进行对比，得到DOM结构的区别，然后仅仅将需要变化的部分进行实际的浏览器

1.4K1 0

what is 模块化?

理解我们先来了解一下，什么是模块化，以及模块化的进化史。什么是模块/模块化将一个复杂的程序按照一定的规范，封装成几个块(文件)，并进行组合在一起。...这些模块，最好都做到可复用性，比如可以在多个文件中使用处理时间的模块。还有，块的内部数据/实现是私有的，只向外部暴露一些接口(方法)与外部其它模块进行通信。...而你想暴露的模块只需要return出去就可以使用了。 define(funtion(){ return 模块 }) 定义有依赖的模块此时，define方法的参数，就需要传两个了。...第一个参数是数组，也就是依赖于其它模块够成的一个数组第二个参数同样是一个函数，但是需要有形参。形参与这个数组一一对应。...而requireJs则只需要return 模块。

1.2K3 0

前端构建这十年

◆ 写在前面前端模块化/构建工具从最开始的基于浏览器运行时加载的 RequireJs/Sea.js 到将所有资源组装依赖打包 webpack/rollup/parcel的bundle类模块化构建工具..., factory); AMD规范采用依赖前置，先把需要用到的依赖提前写在 dependencies 数组里，在所有依赖下载完成后再调用factory回调，通过传参来获取模块，同时也支持require...· browserify browserify致力于在浏览器端使用CommonJs，他使用跟 NodeJs 一样的模块化语法，然后将所有依赖文件编译到一个bundle文件，在浏览器通过标签使用的...常用的搭配就是 browserify + Grunt，使用Grunt的browserify插件来构建模块化代码，并对代码进行压缩转换等处理。...因为钩子太多了，webpack 源码看起来十分的绕，简单说一下大致流程：通过命令行和 webpack.config.js 来获取参数创建compiler对象，初始化plugins 开始编译阶段，addEntry

1K1 0

模块化开发那点历史

要做的是新增 Modules/Transport 规范，即在浏览器上运行前，先通过转换工具将模块转换为符合 Transport 规范的代码。主流代表是服务端的开发人员。...可惜的是 BravoJS 太学院派，FlyScript 后来做了自我阉割，将整个网站（flyscript.org）下线了。这个故事有点悲壮，下文细说。...这个差异，也导致实质上 Node 的模块与 AMD 模块是无法共享的，存在潜在冲突。模块书写风格有争议 AMD 风格下，通过参数传入依赖模块，破坏了就近声明原则。...比如： define(["a", "b", "c", "d", "e", "f"], function(a, b, c, d, e, f) { // 等于在最前面申明并初始化了要用到的所有模块...Sea.js 借鉴了 RequireJS 的不少东西，比如将 FlyScript 中的 module.declare 改名为 define 等。

7921 0

达观数据基于RequireJS的前端模块化设计

针对这些现有问题，达观科技采用了requirejs框架，用模块化的思想去解决这些问题。(达观数据施列宇) 一、什么是模块化模块化是一种将复杂系统拆分成一个个小的可管理的模块的方式。...通过模块化，可以将代码中常用的内容封装起来，这样就做到了代码复用，便于维护。...但如果项目需要迁移，那就需要改变模块存放的整体位置，这种情况下将每个模块的相对路径都进行更改是一件非常痛苦的事情。...在html中引入requirejs 一般而言，项目引用的脚本文件需要代码管理工具进行合并、压缩、混淆操作。...grunt-contrib-requirejs在Gruntfile.js中的配置信息其中几个核心参数的含义如下： baseUrl: 类似于上一节中requirejs配置参数中的baseUrl，如果requirejs

8145 0

手写源码系列（一）——call、apply、bind

大家可以通过文章底部的阅读原来来访问原文地址什么是手写源码平时面试时经常会遇到让手写一个已有方法的实现，其实面试官是想考察你对于JS底层逻辑是否熟悉，经常面试会出的会在下面： call、apply、bind promise requireJS...将context之外的所有参数全部传递给这个新属性，并将运行结果返回。...一些细节：利用rest 参数(…args)可以存储函数多余的参数为传入的context扩展参数扩展新属性使用了`Symbol()`数据类型，这样确保不会影响到传入的context，因为Symbol值一定是独一无二的...用扩展运算符(…)将原来是数组的args转发为逗号分隔一个个参数传入到函数中为什么能找到this.name呢？因为context[fnSymbol]中的this指向的是context。...Symbol() context[fnSymbol] = this let fn = context[fnSymbol] (...args) return fn } 思路和call是一样的只是传参不同方式而已

1.8K1 0

浅谈HTML5单页面架构（一）——requirejs + angular + angular-route

接下来，将分3个随笔分别介绍一下我心目中前3种架构的较好实施方案，而最后一种，跟前3种有种道不同不相为谋的感觉，加上自己道行不够，还是暂且不提了。...这一篇，先说说第1种：requirejs+angular+angular-route 移动端单页面Web相对多页面来说，模块化管理显得非常重要，因为如果没有模块化，页面初始化时就把所有的js和所有模版都加载进来...所以，requirejs或者类似的模块化框架是必不可少的。requirejs比较流行，配合grunt可以做好整套的自动化工具，我们就以这个为例子吧。首先，来看看demo项目的整体架构。 ?...data-baseurl是额外加入的属性，主要好处是可以轻松在html（0缓存）中对js的url进行修改。 data-main就是requirejs的标准写法了，跳过不说。...最后最后，由于requirejs和angular都有模块管理，但两个概念又不一致，这里说说我的看法： requirejs模块管理，不单单是代码模块化，还提供了模块加载的功能； angular模块管理，更在乎的是代码逻辑上的模块化

3.4K2 0

前端模块化理解

但脚本标签天生异步，传统CommonJS模块在浏览器环境中无法正常加载。解决思路之一是，开发一个服务器端组件，对模块代码作静态分析，将模块与它的依赖列表一起返回给浏览器端。...它是一个在浏览器端模块化开发的规范，由于不是JavaScript原生支持，使用AMD规范进行页面开发需要用到对应的库函数，也就是大名鼎鼎RequireJS，实际上AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出..., factory); ------id：可选参数，用来定义模块的标识，如果没有提供该参数，脚本文件名（去掉拓展名）； ------dependencies：是一个当前模块依赖的模块名称数组 -----...-factory：工厂方法，模块初始化要执行的函数或对象。...加载的模块会以参数形式传入该函数，从而在回调函数内部就可以使用这些模块。

6112 0

30分钟学会前端模块化开发

3.3.2、require.config() 配置通过这个函数可以对requirejs进行灵活的配置，其参数为一个配置对象，配置项及含义如下： baseUrl——用于加载模块的根路径。...paths——用于映射不存在根路径下面的模块路径。 shims——配置在脚本/模块外面并没有使用RequireJS的函数依赖并且初始化函数。...我们建议将版本信息放置在单独的文件中来进行跟踪。使用诸如volo这类的工具，可以将package.json打上版本信息，并在磁盘上保持文件名为"jquery.js"。...它可以显式地列出其依赖关系，并以函数(定义此模块的那个函数)参数的形式将这些依赖进行注入，而无需引用全局变量。RequireJS的模块是模块模式的一个扩展，其好处是无需全局地引用其他模块。...如果你现有一些以CommonJS模块格式编写的代码，而这些代码难于使用上述依赖名称数组参数的形式来重构，你可以考虑直接将这些依赖对应到一些本地变量中进行使用。

4K5 0

浅谈前端模块化

，嵌入网页的Javascript代码越来越庞大，而网页越来越像桌面程序，需要一个团队去分工协作，进行管理和测试等等，为了更好的管理网页的业务逻辑，产生了模块化编程的理念。...： nodejs项目的诞生，将javascript语言用于服务器编程。...，模块执行的函数 AMD的模块加载定义：跟CommonJS 一样，AMD也采用require()语句来加载模块，但是与CommonJS不同的是，它要求有两个参数： require([module],...callback); 第一个参数[module]，是一个数组，里面的成员就是要加载的模块；第二个参数callback，则是加载成功之后的回调函数。...后来，由于代码越来越多，一个文件很难管理并进行维护，必须分成多个文件，依次加载。

5522 0

LsLoader——通用移动端Web App离线化方案

从简单的全局变量分配，到RequireJS实现的AMD模块方式，browserify/webpack实现的静态引用方式。...下图为RequireJS/webpack打包后浏览器运行的文件： ? 性能优化要提高Web App的性能，我们需要这样的一个工具，它能实现如下特性： 1） JS按照模块拆开缓存。...LsLoader处理层做的工作原理图如下：对于RequireJS构建：首先把源文件用Babylon或者Uglify处理成语法文档树，然后找到对应的define函数和参数，递归寻找去除重复引用，最后排列成按依赖顺序的模块数组...webpack构建：首先把源文件用Babylon或者Uglify处理成语法文档树，遍历入口JS的import依赖，把公用依赖的JS提取成数组传给commonChunksPlugin配置，让webpack进行文件拆分...同时依赖关系传递给LsLoader前端部分，让页面按照依赖关系加载运行webpackJSONP包。 ? 经过处理后，对应的文件列表在浏览器端以数组的方式运行/缓存，流程如下： ?

1.8K17 0

简单介绍下modJS

简单的说，modJS是百度fex-team提供的一个轻量级的模块加载器，类似requirejs。...另外factory提供了3个参数require/exports/module，用于引用和导出模块。 modJS源码只有200行左右，相比之下requirejs的源码达到了2000+行。...将所有依赖模块在define方法的参数中声明，所以可以保证先异步加载需要的模块，最后再执行factory。...以我们的项目为例，首次加载时，会加载3个打包的js文件，分别是基础库（modjs、jquery、badjs）、base.js（其他打包的通用模块，初始化一些变量）、mod.main.js（当前页面用到的逻辑打包...异步加载方法require.async([deps],callback)中的callback触发 modJS加载异步模块时，将callback回调加入一个队列，然后将依赖模块的script标签打入html

6225 0

三大主流模块打包工具对比

它同时也提供了对模块进行打包与构建的工具r.js，通过将开发时单独的匿名模块具名化并进行合并，实现线上页面资源加载的性能优化。...开发时的RequireJS 模块往往是一个个单独的文件，RequireJS 从入口文件开始，递归地进行静态分析，找出所有直接或间接被依赖（require）的模块，然后进行转换与合并，结果大致如下（未压缩...;}); AMD 通过将模块的实现代码包在匿名函数（即AMD 的工厂方法，factory）中实现作用域的隔离，通过文件路径作为天然的模块ID 实现命名空间的控制，将模块的工厂方法作为参数传入全局的define...将局部的逻辑进行封装，通过尽可能少的必要的接口与其他组件进行组装与交互，可以将大的项目逻辑拆成一个个小的相对独立的部分，减少开发与维护的负担。...相比命令行参数式配置，这种配置方式更为灵活强大，因为配置文件会在Node.js 环境中运行，甚至可以在其中require 其他模块，这样对复杂项目中不同任务的配置信息进行组织变得更容易。

1.9K8 0

requireJS入门

一：什么是requireJS RequireJS 是一个JavaScript模块加载器。它非常适合在浏览器中使用，但它也可以用在其他脚本环境, 就像 Rhino and Node....使用RequireJS加载模块化脚本将提高代码的加载速度和质量。...二：关于requireJS的一些学习网址 https://requirejs.org/(官方文档) http://www.requirejs.cn(中文文档) 三：如何使用requireJS...引入require.js示例 2.requireJS中使用有3个变量：require，requirejs，define require和requirejs是等价的用于引入模块，define.../module2.js"]为该模块所依赖的模块，而函数里面的参数tools，则为依赖模块中函数的返回值，定义模块时，可以依赖多个模块，每一个模块都返回值都会作为该模块的参数。

1.6K1 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

Flask传参到后台，根据参数进行查询，将结果显示到前端

RequireJS 入门指南简介RequireJS?data-main属性配置函数用RequireJS定义模块使用require函数

Javascript模块化详解

requirejs 源码简析

与 JavaScript 模块相关的所有知识点

JS模块加载系统设计V1

前端相关片段整理——持续更新

what is 模块化?

前端构建这十年

模块化开发那点历史

达观数据基于RequireJS的前端模块化设计

手写源码系列（一）——call、apply、bind

浅谈HTML5单页面架构（一）——requirejs + angular + angular-route

前端模块化理解

30分钟学会前端模块化开发

浅谈前端模块化

LsLoader——通用移动端Web App离线化方案

简单介绍下modJS

三大主流模块打包工具对比

requireJS入门

扫码

相关资讯

热门标签

活动推荐

运营活动

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐