Angularjs：实现与工厂相同的服务结构答案

【问题标题】：Angularjs: Achieve Same Structure for Service as FactoryAngularjs：实现与工厂相同的服务结构
【发布时间】：2016-03-31 05:47:15
【问题描述】：

我正在玩 angularjs services 和 factories。我创建了一个名为BookFactory 的工厂，如下所示：

// Code goes here

app
  .factory('BootFactory', function() {
    var bookFactory;

    function add() {

    }

    function remove() {

    }

    function getAll() {

    }
    bookFactory = {
      add: add,
      remove: remove,
      getAll: getAll
    }
    return bookFactory;

  });

还有一个BookService如下：

app.service('BookService', function() {

        var bookService;

        function add() {

        }

        function remove() {

        }

        function getAll() {

        }

        /*
        It throws:
        Uncaught ReferenceError: Invalid left-hand side in assignment.

        How can I achieve the same structure with the services which I have used in factories.

        this = {
          add: add,
          remove: remove,
          getAll: getAll
        };

        */

        //Do I have to add all methods like this
        this.add=add;
        this.remove=remove;
        this.getAll=getgAll;

        //Or there's any other better way to achieve it

      });

我想要做的是保持结构一致，即我想要工厂和服务都像这样：

bookFactory = {
          add: add,
          remove: remove,
          getAll: getAll
        }

在工厂的情况下，它工作正常。但在服务的情况下，我不能这样做。因为服务与this 一起工作，我不能这样做：

/*
            It throws:
            Uncaught ReferenceError: Invalid left-hand side in assignment.

            How can I achieve the same structure with the services which I have used in factories.

            this = {
              add: add,
              remove: remove,
              getAll: getAll
            };

            */

我想做的是：

//Do I have to add all methods like this
            this.add=add;
            this.remove=remove;
            this.getAll=getgAll;

            //Or there's any other better way to achieve it

有没有更好的方法呢？这是plunkr。

【问题讨论】：

标签： javascript angularjs factory plunker

【解决方案1】：

你可以像 as- 一样创建 bookService-

app.service('BookService', function() {
    return {
          add:add,
          remove:remove,
          getAll:getAll
        };

    function add() {

        }

        function remove() {

        }

        function getAll() {

        }

  });

【讨论】：

我们不应该使用服务函数返回任何东西，因为它是构造函数。
是的，正确的。服务是一个构造函数，但是，它不会阻止我们做额外的工作并返回对象字面量。事实上，JavaScript 中的构造函数可以返回任何他们想要的东西。所以我们可以把我们的服务代码写成基本上和我们工厂做同样的事情
@HiteshKumar 请阅读此内容-blog.thoughtram.io/angular/2015/07/07/…
知道了。非常感谢:)

【解决方案2】：

你可以这样做：

app.service('BookService', function() {
    function add() {

    }

    function remove() {

    }

    function getAll() {

    }

    var bookService = {
      add: add,
      remove: remove,
      getAll: getAll
    };

    return bookService;
  });

Angular 并不真正关心您的服务返回什么。 Factory vs Service 只是关于它是如何被调用的，factory 是这样调用的： factory() 和 service 是这样的：new service()。在 JS 中，构造函数可以返回任何你想要的。

【讨论】：

【解决方案3】：

工厂和服务只是创建服务对象实例的两种略有不同的方式。

工厂函数返回实例本身。

服务函数是一个构造函数，与new（或类似的东西）一起使用来创建实例。 JS中的构造函数可以返回直接实例化的对象实例（而不是默认的this、read more）。

这应该可以让你这样做：

  .service('BookService', function() {
    var bookService;

    function add() {}

    function remove() {}

    function getAll() {}

    bookService = {
      add: add,
      remove: remove,
      getAll: getAll
    }
    return bookService;
  })

所以是的，factory 和 service 可以因为这个 JS 怪癖而以完全相同的方式运行。

我真的不知道您为什么要为两者使用相同的配方，因为从语义上讲，它们在做同样的事情，为什么不在这种情况下使用特定的服务创建所有服务？

【讨论】：