Javascript AngularJS如何实现多态性/依赖注入（最佳实践）

这是一个与设计模式相关的问题。我不是在寻找如何实现以下目标的答案，而是寻找在服务中实现多态性的最广为接受的方法

假设我有一个名为getData的服务。它需要获取一些数据，无论是来自数据库、文本文件还是硬编码的数据，并根据控制器中$scope上的设置进行输出。在下面的示例中，假设getData依赖于数据源

angular.module('testApp').controller('testController'), [$scope, myAwesomeService, function ($scope, myAwesomeService){
    $scope.dataSource = 'database'; //defines the source of the data

    $scope.getData = function() {
        //use myAwesomeService, get the data and output

        if($scope.dataSource ==='database') {
             return //do it the first way
        }            

        else if($scope.dataSource ==='text') {
             return //do it the second way
        } 

        else if($scope.dataSource ==='csvfile') {
             return //do it the third way
        } 
        else if($scope.dataSource ==='form') {
             return //do it the fourth way
        } 

    }

}]);

问题：

您通常如何在Javascript中实现这一点？我不确定在Javascript中实现多态性的最佳实践。我习惯于使用接口，并通过使用依赖项注入和传入遵循相同接口的对象来处理上述情况，并从控制器调用公共方法。通常，其他一些“类”会负责选择实例化和传入哪个对象，从而使控制器不知道“如何完成”的具体细节

在AngularJS中如何进行此操作？ 模式通常是什么样子？你能给出一个实现多态性的“教科书式”方法吗

---

我想发表评论，但我意识到这可能太长了，所以我要发布一个答案

如果我们谈论的是ES5，那么多态性和继承可以通过原型来实现

例如：

function Auto(name,year){
   this.year=year;
   this.name=name;
}
Auto.prototype.showYear = function(){
   console.log(this.year);
}

function Car(name,year, model){
   Auto.call(this,name,year);
   this.model=model;
}
Car.prototype = Object.create(Auto.prototype);

//usage
var car = new Car('BMW',2015,'320d');
car.showYear(); // will output 2015

在

ES6

中，这可以使用

class

函数来完成。你可以阅读更多关于这方面的内容，（这将非常好：D）

下面您将找到一些可能回答您问题的代码。希望这就是你想要的：

function BaseService(){
    this.dataSource='database';
}
BaseService.prototype.getData = function(){
    console.log('base: get data');
}


function TextService(){
    this.dataSource='text';
}
TextService.prototype  = new BaseService();
TextService.prototype.getData = function(){
    console.log('child text: get data');
}



function CsvService(){
    this.dataSource='csv';
}
CsvService.prototype  = new BaseService();
CsvService.prototype.getData = function(){
    console.log('child csv: get data');
}


function FormService(){
    this.dataSource='form';
}
FormService.prototype  = new BaseService();
FormService.prototype.getData = function(){
    console.log('child form: get data');
}



angular.module('myApp').factory('awesomeService', function(){

    var service={};

    service.getData = function(dataSource){

        var sourceService;

        if(dataSource='database'){
             sourceService= new BaseService();
        }

        if(dataSource=='text'){
            sourceService=new TextService();
        }

        if(dataSource=='csv'){
           sourceService = new CsvService();
        }

        if(dataSource=='form'){
          sourceService= new FormService();
        }

        return sourceService.getData(); // i'm going to assume getData returns a promise
   }

   return service;

});

angular.module('myApp').controller('myController', function($scope,awesomeService){
  var myDataSource='database';

  $scope.getData = function(){
    awesomeService.getData(myDataSource).then(function(data){
         $scope.result=data;
    });
  }


});

---

谢谢你的快速回复。在角度上下文中，您将BaseService（）、TextSerivce（）等放在哪里。？由于几乎没有实现细节，它已经相当长，很难导航。将这些服务放入它们自己的angular服务中，并将BaseService、TextService等逐一注入“awesomeService”中，这是常见的做法吗？这不是一个书面规则。这取决于你如何构建你的应用程序样板。例如，我将它们放在一个“数据服务”中，我们将把它注入到其他服务中；angular.factory（'dataService'，function（）{var service={}；service.BaseService=function BaseService（）{}；service.BaseService.prototype.getData=function（）{}；service.textsservice=function TextService（）{}service.TextService.prototype=new service.BaseService（）；return service；}）；如果有可能在awesomeService之外需要它们（并且它们可能，至少在测试时需要），那么让它们成为服务。因为它们是在awesomeService中实例化的，所以它们应该是

工厂

服务，而不是

服务

。您能详细介绍一下工厂服务和角度服务吗？你指的是角度语境中的工厂与服务，还是指其他东西？i、 你的意思是工厂吗：angular.module（'myApp'）.factory（'myFactory'，function（）{}）；在服务中，函数将作为构造函数调用，而在工厂中，主函数将作为函数调用。（服务返回主函数；工厂返回主函数的返回对象）我所有的示例都是用.factory编写的。