AngularJS:什么是工厂?

时间:2013-05-16 20:10:24

标签: javascript angularjs angularjs-factory

我在Angular.js上做了很多工作,总的来说,我发现它是一个有趣且强大的框架。

我知道有很多关于服务与工厂与提供商与价值观的讨论,但我仍然对Factory的内容感到困惑。

工厂已在其他StackOverflow讨论中定义如下:

工厂

语法:module.factory( 'factoryName', function );结果:当将factoryName声明为injectable参数时,将为您提供通过调用传递给module.factory的函数引用返回的值。

我发现这个解释很难掌握,并没有增加我对工厂的理解。

有人会有任何解释或现实生活中的例子来分享Factory到底是什么以及为什么要用它来代替ServiceProvider或其他?< / p>

更新

service 为任何对象保留参考

factory 是一个函数,它返回任何对象

provider 是一个函数,可以返回任何函数

- -

4 个答案:

答案 0 :(得分:70)

据我所知,他们几乎都是一样的。主要区别在于它们的复杂性。提供者可以在运行时配置,工厂更健壮,服务是最简单的形式。

查看此问题AngularJS: Service vs provider vs factory

gist可能有助于理解微妙的差异。

来源:https://groups.google.com/forum/#!topic/angular/hVrkvaHGOfc

jsFiddle:http://jsfiddle.net/pkozlowski_opensource/PxdSP/14/

作者: Pawel Kozlowski

var myApp = angular.module('myApp', []);

//service style, probably the simplest one
myApp.service('helloWorldFromService', function() {
    this.sayHello = function() {
        return "Hello, World!";
    };
});

//factory style, more involved but more sophisticated
myApp.factory('helloWorldFromFactory', function() {
    return {
        sayHello: function() {
            return "Hello, World!";
        }
    };
});

//provider style, full blown, configurable version     
myApp.provider('helloWorld', function() {
    // In the provider function, you cannot inject any
    // service or factory. This can only be done at the
    // "$get" method.

    this.name = 'Default';

    this.$get = function() {
        var name = this.name;
        return {
            sayHello: function() {
                return "Hello, " + name + "!";
            }
        };
    };

    this.setName = function(name) {
        this.name = name;
    };
});

//hey, we can configure a provider!            
myApp.config(function(helloWorldProvider){
    helloWorldProvider.setName('World');
});


function MyCtrl($scope, helloWorld, helloWorldFromFactory, helloWorldFromService) {

    $scope.hellos = [
        helloWorld.sayHello(),
        helloWorldFromFactory.sayHello(),
        helloWorldFromService.sayHello()];
}​

答案 1 :(得分:18)

我看到的一个主要区别是您可以在工厂中运行自定义代码。但是,在服务中,只会发生对象创建。

myJs.factory('Factory', function() {

    //Write custom code here

    return {
            Hello: function() {
            return "Hello, World!"
        }
    };
});

答案 2 :(得分:10)

关于这个话题的两分钱。我是一个非常非常新手,只是了解Angular JS,这是让我很困惑的事情之一,因此我对它进行了一些细节研究。我一直在做面试,这可能对其他人有用。

  • 服务和工厂以不同的方式做同样的事情
  • 两者都是可注射的
  • 对于大多数事情使用工厂语法
  • 更容易理解
  • 现在已经完成了es6“service”,因为它更好地转换为es6类
  • 它基本上从控制器中抽象出业务逻辑
  • 如果您将逻辑逻辑与控制器一起使用,那么您只能使用控制器
  • 控制器用于将数据放在范围内而不是处理冗长的商业逻辑
  • 所以在上面的场景中发生的事情是复杂的商业逻辑被绑定到控制器中。不用于处理数据。所以把它的一点一滴放入服务或工厂。所以你的代码是精简和模块化的。
  • 服务是单身人士

答案 3 :(得分:0)

服务主要是您描述对象的构造函数类的对象。在框架内的某个地方,调用Object.create()函数,然后通过使用控制器调用其对象和方法来使用服务。另一方面,工厂默认情况下不会创建对象,因此在完成所有属性和方法的定义后,您需要返回整个对象位置。