Angularjs 扩展服务和继承答案

【问题标题】：Angularjs extending services and inheritanceAngularjs 扩展服务和继承
【发布时间】：2014-07-10 09:55:00
【问题描述】：

我正在尝试找到一种以角度扩展服务的方法。我不确定 Angular 是否有扩展的概念，或者它是否仅仅依赖注入来重用代码。所以到目前为止我尝试过的如下

方法一

myApp.factory('myFactory', function ($http) {
   return{
     common: function(){
      console.log('I am from myFactory');
     }
});


 myApp.factory('myFactory1', function (myFactory) {
    return {
     common: myFactory.common
    };
});

或

 myApp.factory('myFactory1', function (myFactory) {
    return angular.extend(myFactory, {
     common: function() {
      console.log('I am form Factory1')
      }
    });
});

这两种方法都可以，但我的主要问题是如何给父母打电话。即这样的事情：

在 myFactory1 中

     common: function(){
      console.log('I am from myFactory1');
      this.prototype.common.apply(this, arguments);
     }

我想要打印出 'I am from myFactory1', 'I am from myFactory'

通常这在 angular 中是否支持？或者我应该采取不同的方法来扩展/继承功能？

谢谢

【问题讨论】：

如果它符合您的要求，请继续。 angularjs 服务是单例的。所以你应该更喜欢组合而不是继承。
所以不能调用同名的父函数？

标签： javascript angularjs oop extend angularjs-service

【解决方案1】：

我过去实现这一点的方法是让基本 Angular 服务返回一个普通的旧 Javascript“类”的实例。扩展服务，然后创建基类的实例，并使用标准的 JS 原型继承来扩展该类并返回一个新扩展对象的实例。

例如：

// Base service
app.factory('Shape', function() {

    var Shape = function(colour) {
        this.colour = colour;
    };

    Shape.prototype.getColour = function() {
        return this.colour;
    };

    return Shape;
});

// Extended service
app.factory('Square', function(Shape) {

    var Square = function(colour) {
        Shape.apply(this, arguments);
    };

    Square.prototype = new Shape();

    Square.prototype.getSides = function() {
        return 4;
    };

    return Square;
});

【讨论】：

您拥有的代码将导致在定义 Square 时额外调用 Shape 的构造函数。我建议 Square.prototype 应该定义为：Square.prototype = Object.extend(Shape.prototype); 请注意，并非所有浏览器都存在 Object.extend，但 es5-shim 有一个 shim。

【解决方案2】：

只需对Square@romiem sn-p 进行一些调整：

// Extended service
app.factory('Square', function(Shape) {

    var Square = function(colour) {
        Shape.call(this, arguments);
    };

    Square.prototype = Object.create(Shape.prototype);
    Square.prototype.constructor = Square;

    Square.prototype.getSides = getSides;

    return Square;

    function getSides() {
      return 4;
    }

});

这个 sn-p 遵循最佳实践，避免了通过new Shape() 创建新实例的问题。还与旧浏览器兼容。

【讨论】：