javascript angular 中使用的模式

Question

我在 http://www.tutorialspoint.com/angularjs/angularjs_services.htm

上学习了 AngularJS 教程

传递给 CalcService 服务的方法让我感到困惑。 Angular 使用的是公开原型还是其他原型。我很困惑，因为在 this.square 中声明的内部函数应该是私有的，并且在对象的上下文之外是不可见的。 Angular 如何访问 Square。

mainApp.service('CalcService', function(MathService){
            this.square = function(a) { 
            return MathService.multiply(a,a); 
         }
});

Answer 1

一个AngularJSservice是一个非常独特的东西。

初始化后，它会 newed。以此为例：

function CalcService() {
  this.square = function() {
    // square some stuff
  };
}

// then in the controller, directive, or wherever,
// it gets initialized behind the scenes like this
new CalcService();

但是，它被初始化为单例，这意味着只有一个对该对象的引用，即使您注册它的组件试图重新初始化它（请参阅).

当你提到 "revealing prototype pattern" 时不确定你的意思，但是 this 在 AngularJS 服务的情况下，只是在新的常规 JavaScript 对象。

与上面相同的示例保持一致，在 "normal" JavaScript 中，您可以调用 new CalcService().square()。 JavaScript 没有任何私有方法的本机概念（尽管有一些方法可以实现看起来是私有的 "class" 方法。）

var service = new CalcService();

service.square();

那个方法没有任何东西 "private"，就像没有任何东西 "private" 附加到 AngularJS 服务对象的方法一样......唯一的东西是远程 "private"关于它，它恰好仅属于那个特定对象，因为 this 关键字。

Answer 2

在您的示例中，您将构造函数传递给 angular 服务 DI 方法。

在构造函数中，您将方法分配给 this.square 。

在没有 angular 的情况下试试这个，你会发现它的行为是一样的。

function Calc() {

    this.square = function() {
        console.log('we get here');    
    } 

} 

var calc = new Calc();
calc.square();

这是Javascript原型面向对象模型的主要特点。这是普通的旧 OO javascript.

Answer 3

以上答案很好地解释了服务是如何工作的，但没有解释 this 新创建的对象是如何暴露的。

每当您创建一个服务时 angular 都会为您创建一个该函数的 new 对象，并且当它被注入到控制器、指令、服务等中时就会得到 return。内部方法使用函数原型来创建一个 this ，它是函数的上下文。让我们看看下面的代码它是如何在内部工作的。

function CalcService(){
    //The line below this creates an obj object.
    //obj = Object.create(CalcService.prototype)
    //this = obj;
    //`this` is nothing but an instance of function/CalcService.prototype which is giving access to its property attached to this
    var privateVariableExample = 'test'; //this is private variable of service.
    this.square = function(a) {
        //return multiplacation result from here 
    }

    //return this;
}

var objectOfCalcService = new CalcService();
objectOfCalcService.square(1);

javascript angular 中使用的模式

javascript pattern used in angular

javascript

singleton

prototype

angularjs

angularjs-service