AngularJS中的服务、提供商和工厂之间有什么区别？
当前回答
对我来说，当我意识到它们都以相同的方式工作时，我就发现了这一点：通过运行一次某个东西，存储它们获得的值，然后在通过依赖注入引用时提取相同的存储值。
假设我们有：
app.factory('a', fn);
app.service('b', fn);
app.provider('c', fn);
三者之间的区别在于：
a的存储值来自运行fn。b的存储值来自newing fn。c的存储值来自首先通过newing fn获取一个实例，然后运行该实例的$get方法。
这意味着在AngularJS中有一个类似于缓存对象的东西，每次注入的值仅在第一次注入时分配一次，其中：
cache.a = fn()
cache.b = new fn()
cache.c = (new fn()).$get()
这就是为什么我们在服务中使用这个，并定义一个This$获取提供者。
其他回答
JS Fiddle演示
工厂/服务/供应商的“Hello world”示例：
var myApp=角度模块（'myApp'，[]）；//服务风格，可能是最简单的myApp.service（'helloWorldFromService'，函数（）{this.sayHello=函数（）{return“你好，世界！”；};});//工厂风格，更加复杂myApp.factory（'helloWorldFromFactory'，函数（）{返回{sayHello:函数（）{return“你好，世界！”；}};});//提供程序风格、全面、可配置版本myApp.provider（'helloWorld'，函数（）{this.name='默认值'；这一点$get=函数（）{var名称=this.name；返回{sayHello:函数（）{return“您好，”+name+“！”；}}};this.setName=函数（名称）{this.name=名称；};});//嘿，我们可以配置提供者！myApp.config（函数（helloWorldProvider）{helloWorldProvider.setName（'World'）；});函数MyCtrl（$scope、helloWorld、helloWorldFromFactory、helloWorldFromService）{$scope.hellos=[helloWorld.sayHello（），helloWorldFromFactory.sayHello（），helloWorldFromService.sayHello（）]；}<script src=“https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js“></script><body ng app=“myApp”><div ng controller=“MyCtrl”>｛｛hellos｝｝</div></body>
所有服务均为单人服务；每个应用程序实例化一次。它们可以是任何类型，无论是原语、对象文本、函数，甚至是自定义类型的实例。
值、工厂、服务、常量和提供程序方法都是提供程序。他们教Injector如何实例化服务。
最冗长，但也是最全面的是提供者配方其余四种配方类型-价值、工厂、服务和常量-只是提供程序配方之上的语法糖。
Value Recipe是最简单的例子，您自己实例化服务，并将实例化的值提供给注入器。Factory配方为Injector提供了一个工厂函数，当它需要实例化服务时调用该函数。调用时，工厂函数创建并返回服务实例。服务的依赖项作为函数的参数注入。因此，使用此配方可增加以下功能：能够使用其他服务（具有依赖关系）服务初始化延迟/延迟初始化Service配方与Factory配方几乎相同，但这里Injector调用带有新运算符的构造函数，而不是工厂函数。提供商的配方通常是过度的。它通过允许您配置工厂的创建，增加了一个间接层。
只有当您想要公开API时，才应该使用Provider配方对于必须在应用程序启动。这通常只对可重复使用有用其行为可能需要在应用。常量配方与值配方类似，只是它允许您定义在配置阶段可用的服务。比使用Value配方创建的服务更快。与Values不同，它们不能使用decorator进行装饰。请参阅提供程序文档。
使用此页面和文档作为参考（自上次查看以来似乎有了很大的改进），我整理了以下真实世界演示，其中使用了提供者的5种风格中的4种；价值、常量、工厂和全面供应商。
HTML格式：
<div ng-controller="mainCtrl as main">
<h1>{{main.title}}*</h1>
<h2>{{main.strapline}}</h2>
<p>Earn {{main.earn}} per click</p>
<p>You've earned {{main.earned}} by clicking!</p>
<button ng-click="main.handleClick()">Click me to earn</button>
<small>* Not actual money</small>
</div>
app
var app = angular.module('angularProviders', []);
// A CONSTANT is not going to change
app.constant('range', 100);
// A VALUE could change, but probably / typically doesn't
app.value('title', 'Earn money by clicking');
app.value('strapline', 'Adventures in ng Providers');
// A simple FACTORY allows us to compute a value @ runtime.
// Furthermore, it can have other dependencies injected into it such
// as our range constant.
app.factory('random', function randomFactory(range) {
// Get a random number within the range defined in our CONSTANT
return Math.random() * range;
});
// A PROVIDER, must return a custom type which implements the functionality
// provided by our service (see what I did there?).
// Here we define the constructor for the custom type the PROVIDER below will
// instantiate and return.
var Money = function(locale) {
// Depending on locale string set during config phase, we'll
// use different symbols and positioning for any values we
// need to display as currency
this.settings = {
uk: {
front: true,
currency: '£',
thousand: ',',
decimal: '.'
},
eu: {
front: false,
currency: '€',
thousand: '.',
decimal: ','
}
};
this.locale = locale;
};
// Return a monetary value with currency symbol and placement, and decimal
// and thousand delimiters according to the locale set in the config phase.
Money.prototype.convertValue = function(value) {
var settings = this.settings[this.locale],
decimalIndex, converted;
converted = this.addThousandSeparator(value.toFixed(2), settings.thousand);
decimalIndex = converted.length - 3;
converted = converted.substr(0, decimalIndex) +
settings.decimal +
converted.substr(decimalIndex + 1);
converted = settings.front ?
settings.currency + converted :
converted + settings.currency;
return converted;
};
// Add supplied thousand separator to supplied value
Money.prototype.addThousandSeparator = function(value, symbol) {
return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, symbol);
};
// PROVIDER is the core recipe type - VALUE, CONSTANT, SERVICE & FACTORY
// are all effectively syntactic sugar built on top of the PROVIDER construct
// One of the advantages of the PROVIDER is that we can configure it before the
// application starts (see config below).
app.provider('money', function MoneyProvider() {
var locale;
// Function called by the config to set up the provider
this.setLocale = function(value) {
locale = value;
};
// All providers need to implement a $get method which returns
// an instance of the custom class which constitutes the service
this.$get = function moneyFactory() {
return new Money(locale);
};
});
// We can configure a PROVIDER on application initialisation.
app.config(['moneyProvider', function(moneyProvider) {
moneyProvider.setLocale('uk');
//moneyProvider.setLocale('eu');
}]);
// The ubiquitous controller
app.controller('mainCtrl', function($scope, title, strapline, random, money) {
// Plain old VALUE(s)
this.title = title;
this.strapline = strapline;
this.count = 0;
// Compute values using our money provider
this.earn = money.convertValue(random); // random is computed @ runtime
this.earned = money.convertValue(0);
this.handleClick = function() {
this.count ++;
this.earned = money.convertValue(random * this.count);
};
});
工作演示。
所有的好答案都已经有了。我想在服务和工厂方面再补充几点。以及服务/工厂之间的差异。你也可以有这样的问题：
我应该使用服务还是工厂？有什么不同？他们的行为是否相同？
让我们从服务和工厂之间的区别开始：
两者都是Singleton：每当Angular第一次发现它们作为依赖项时，它都会创建服务/工厂的单个实例。创建实例后，将永远使用同一实例。可用于对具有行为的对象进行建模：它们都可以有方法、内部状态变量等。尽管编写代码的方式会有所不同。
服务：
服务是一个构造函数，Angular将通过调用newyourServiceName（）来实例化它。这意味着一些事情。
函数和实例变量将是它的财产。您不需要返回值。当Angular调用new yourServiceName（）时，它将接收此对象以及您在其上放置的所有财产。
示例：
angular.service('MyService', function() {
this.aServiceVariable = "Ved Prakash"
this.aServiceMethod = function() {
return //code
};
});
当Angular将此MyService服务注入控制器时取决于它，该控制器将获得它可以调用的MyService上的函数，例如MyService.aServiceMethod（）。
注意：
由于构造的服务是一个对象，因此当调用它们时，它内部的方法可以引用它：
angular.service('ScoreKeeper', function($http) {
this.score = 0;
this.getScore = function() {
return this.score;
};
this.setScore = function(newScore) {
this.score = newScore;
};
this.addOne = function() {
this.score++;
};
});
例如，如果您通过从服务器$http.get（'/score'）.then（ScoreKeeper.setScore）获取分数来初始化分数，那么您可能会尝试在承诺链中调用ScoreKeeper。这样做的问题是，ScoreKeeer.setScore将在该绑定为空的情况下被调用，并且您会收到错误。更好的方法是$http.get（'/score'）.then（ScoreKeeper.setScore.bind（ScoreKeeper））。无论您是否选择在服务方法中使用它，请注意如何调用它们。
从服务返回值：
由于JavaScript构造函数的工作方式，若从构造函数函数返回一个复杂值（即Object），调用者将获得该Object而不是该实例。
这意味着你基本上可以从下面复制粘贴工厂示例，用服务替换工厂，它会起作用：
angular.service('MyService', function($http) {
var api = {};
api.aServiceMethod= function() {
return $http.get('/users');
};
return api;
});
因此，当Angular使用新的MyService（）构造服务时，它将获得该api对象而不是MyService实例。
这是任何复杂值（对象、函数）的行为，但不是基本类型的行为。
工厂：
工厂是一个返回值的普通旧函数。返回值是注入到依赖于工厂的事物中的值。Angular中的一个典型工厂模式是返回一个具有函数作为财产的对象，如下所示：
angular.factory('MyFactory', function($http) {
var api = {};
api.aFactoryMethod= function() {
return $http.get('/users');
};
return api;
});
工厂依赖项的注入值是工厂的返回值值，并且它不必是对象。这可能是一种功能
以上1和2个问题的答案：
大多数情况下，只要坚持使用工厂就可以了。他们的行为更容易理解。别无选择关于是否返回一个值，此外，没有错误如果你做错事，就会被介绍。当我谈论注射时，我仍然将其称为“服务”但它们是依赖关系。服务/工厂行为非常相似，有些人会说任何一个都很好。这有点正确，但我觉得遵循约翰·帕帕风格指南的建议，坚持工厂**
为了澄清这一点，从AngularJS源代码中，您可以看到一个服务只是调用工厂函数，而工厂函数反过来调用提供程序函数：
function factory(name, factoryFn) {
return provider(name, { $get: factoryFn });
}
function service(name, constructor) {
return factory(name, ['$injector', function($injector) {
return $injector.instantiate(constructor);
}]);
}
推荐文章
- AngularJS控制器的生命周期是什么?
- $destroy是否删除事件监听器?
- 用布尔值将单选按钮绑定到模型
- AngularJS只适用于单页应用程序吗?
- angular.js中的内联条件
- 如何突出显示当前菜单项?
- 如何使用AngularJS获取url参数
- angularjs中的compile函数和link函数有什么区别
- 如何向一个5岁的孩子解释依赖注入?
- Ng-repeat结束事件
- 缓存一个HTTP 'Get'服务响应在AngularJS?
- 从ng-click获取原始元素
- Angular JS:当我们已经有了具有作用域的指令控制器时，指令的link函数还需要什么?
- Angularjs的ng-model不能在ng-if中工作
- AngularJS禁用了开发机器上的部分缓存
