这两种配方达到了相同的效果。在内部,RequireJS 将第一个公式转换为:
define(['jquery'], function (require) {
var $ = require('jquery');
//$ is available here
});
它使用单个字符串参数扫描函数以查找对 require 的调用,收集所有参数并将它们添加到传递给 define 的依赖项列表中。因此,由于两个原因,它比第二种公式的计算成本要高一些。首先,RequireJS 必须使用正则表达式来扫描函数并找到对require 的调用。其次,当你像这样加载多个模块时,require 必须被多次调用。比较一个依赖于其他4个模块并使用var x = require('x')加载它们的模块,转换后:
define(['a', 'b', 'c', 'd'], function (require) {
var a = require('a');
var b = require('b');
var c = require('c');
var d = require('d');
// Actual work.
});
同样的模块是这样写的:
define(['a', 'b', 'c', 'd'], function (a, b, c, d) {
// Actual work.
});
第一个模块需要调用require 四次才能进入实际工作部分。我不会因为性能差异而失眠,但它确实存在。
Jeremy 指出了第一个公式的局限性,但 elsewhere 在文档中,James Burke(RequireJS 的作者)对这个可能的问题给出了更详细的意见:
并非所有浏览器都会给出可用的 Function.prototype.toString() 结果。截至 2011 年 10 月,PS 3 和更早的 Opera Mobile 浏览器不支持。 这些浏览器更有可能需要针对网络/设备限制优化模块构建,因此只需使用知道如何将这些文件转换为规范化依赖数组形式的优化器进行构建,例如RequireJS 优化器。
由于不支持这种 toString() 扫描的浏览器数量非常少,对所有模块使用这种糖化形式是安全的,特别是如果您想排列依赖项名称带有将保存其模块值的变量。
(已添加重点。)
认为“哦,不!我将必须使用优化器”的人并没有看到全局。有可能toString() 不可用的平台无论如何都需要优化。
为了解决您的具体问题:
使用 #1 可以解决这个问题吗?
使用#1 中的语法糖本身不会使优化器无法优化您的代码。我有一个超过 50 个模块的项目,它混合了两种风格。我不需要做任何特别的事情来使r.js 工作。