2

javascript代码的模块化（以browserify为例）和依赖注入有什么区别？

它们是同义词吗？两人要一起去吗？或者我错过了什么？

4

2 回答 2

1

你可以参考这篇文章：

模块是实现特定功能并使用特定技术编写的代码片段。JavaScript 语言中没有开箱即用的模块化方案。即将到来的 ECMAScript 6 规范倾向于通过在 JavaScript 语言本身中引入模块概念来解决这个问题。这就是未来。

和JavaScript 中的依赖注入

目标

假设我们有两个模块。第一个是发出 Ajax 请求的服务，第二个是路由器。

var service = function() {
    return { name: 'Service' };
}
var router = function() {
    return { name: 'Router' };
}

我们还有另一个需要这些模块的功能。

var doSomething = function(other) {
    var s = service();
    var r = router();
};

为了让事情变得更有趣，该函数需要再接受一个参数。当然，我们可以使用上面的代码，但这不是很灵活。如果我们想使用 ServiceXML 或 ServiceJSON 怎么办。或者如果我们想模拟一些模块以进行测试怎么办。我们不能只编辑函数的主体。我们都想出的第一件事是将依赖项作为参数传递给函数。IE：

var doSomething = function(service, router, other) {
    var s = service();
    var r = router();
};

通过这样做，我们传递了我们想要的模块的确切实现。然而这带来了一个新的问题。想象一下，如果我们的代码中到处都是 doSomething。如果我们需要第三个依赖会发生什么。我们无法编辑所有函数的调用。所以，我们需要一种工具来为我们做到这一点。这就是依赖注入器试图解决的问题。让我们写下我们想要实现的几个目标：

  • 我们应该能够注册依赖项
  • 注入器应该接受一个函数并且应该返回一个以某种方式获取所需资源的函数
  • 我们不应该写很多，我们需要简短而优美的语法
  • 注入器应保持传递函数的范围
  • 传递的函数应该能够接受自定义参数，而不仅仅是描述的依赖项

一个不错的清单不是吗。让我们潜入水中。

于 2016-04-21T13:08:28.707 回答
1

模块化是指将代码分解成单独的、独立的“包”。
依赖注入是指不对其他模块的引用进行硬编码。

作为一个实际示例，您可以编写不使用依赖注入的模块：

import { Foo } from 'foo';

export function Bar() {
    return Foo.baz();
}

这里有两个模块，但是这个模块导入了一个特定的其他硬编码模块。

使用依赖注入编写的相同模块：

export function Bar(foo) {
    return foo.baz();
}

然后其他人可以将其用作：

import { Foo } from 'foo';
import { Bar } from 'bar';

Bar(Foo());

您在调用时注入Foo依赖项，而不是对依赖项进行硬编码。

于 2016-04-21T13:29:36.283 回答