Angular Service - 通过引用私有值返回私有值与赋值

时间:2016-08-19 01:07:03

标签: javascript angularjs arrays service reference

与同事讨论获取私有数组的返回值与赋予私有数组引用的变量的赋值之间的区别,但无法想出以下结果会产生不同的好结果结果:

控制器

app.controller("MyController", ["MyService", function(MyService) {
    var ctrl = this;
    ctrl.arrayAssign = [];

    ctrl.doSomething = function() {
        // Empty out array, usually assigned at one point, code is omitted for example
        ctrl.arrayAssign = []

        // This does not work, ctrl.arrayAssign = []
        ctrl.arrayAssign = MyService.serviceArray;

        // This works, ctrl.arrayAssign correctly assigned to serviceArray in MyService
        ctrl.arrayAssign = MyService.getServiceArray();
    }
}]);

服务

app.service("MyService", [function(){
    var service = this;
    var serviceArray = [];

    service.serviceArray = serviceArray;

    // This is called, either from controller above, or another controller
    service.assignToServiceArray = function(arr) {
        serviceArray = angular.copy(arr);
    };

    service.getServiceArray = function() {
        return serviceArray;
    };

    return service;
}]);

注意:在service.assignToServiceArray()

之后调用ctrl.doSomething()

为什么上述两个控制器分配具有所描述的不同结果有什么好解释?

我认为service.serviceArray会公开私有数组serviceArray并且只是成为私有数组的引用(service.serviceArray = serviceArray),所以对serviceArray的新赋值(即来自service.assignToServiceArray)应该允许service.serviceArray引用可以由控制器直接访问的新数组赋值。

service.getServiceArray()也会公开私有变量serviceArray,但是直接公开,因为我没有尝试访问只是对数组的引用的变量(即上面的service.serviceArray)。

尝试分配对私有变量的引用在这种情况下不是理想的,只返回私有值是有利的吗?我可能错过了一些非常明显的东西......

2 个答案:

答案 0 :(得分:2)

当你调用assignToServiceArray时,你将serviceArray分配给本地变量以指向一个新的数组,你不更新引用或更新原始数组,所以service.serviceArray仍然指向你启动它的空数组...如果您改为使用angular.copy(arr,serviceArray)而没有赋值,那么您将得到实际数组保持相同的结果(相同的数组对象),但它的内容会被清空并重新填充,在这种情况下,service.serviceArray和serviceArray都会有更新的数组。如果我错过了这个问题,请告诉我。

答案 1 :(得分:1)

service.serviceArray = serviceArray[]数组的引用分配给serviceArray属性,而不是对serviceArray变量的引用。

将新值分配给serviceArray时,会将其分配给此变量,而不是其他任何内容。

关于angular.copy的一个好处是它接受两个参数并允许保持对该对象的引用:

  

如果提供了目标,则会删除其所有元素(对于数组)或属性(对象),然后将源中的所有元素/属性复制到该目标。

所以它适用于:

angular.copy(arr, serviceArray);

该服务实际上滥用了JS提供的OOP功能。 service服务接受构造函数。如果它的行为与普通对象构造函数一样,那么就没有这样的问题:

app.service("MyService", [function(){
    this.serviceArray = [];

    service.assignToServiceArray = function(arr) {
        this.serviceArray = arr;
    };

    service.getServiceArray = function() {
        return this.serviceArray;
    };

    // not needed
    // return service;
}]);

如果在重新分配后应该使用MyService.serviceArray,则只应通过其getter和setter方法将其引用到任何地方。 OOP中getter和setter的实际原因是该值保持私有,永远不会直接从外部访问。例如。在视图中:

{{ vm.MyService.getServiceArray()[0] }}