为什么我能够改变角度常数?

时间:2016-06-16 04:22:54

标签: javascript angularjs

我正在玩angular constants。我观察到我能够改变constant的值。我无法得到它。为什么我能够改变价值。我正在创建这样的常量:

var app = angular.module('app', []);
app.constant('Type', {
  PNG: 'png',
  GIF: 'gif'
});
app.constant('serialId', 'aRandomId');

即使我使用angular.value创建常量,我也可以更改它。要改变常量的值,我在控制器中执行此操作:

app.controller('MainController', ['$scope', 'Type', 'serialId', '$timeout', function($scope, Type, serialId, $timeout) {
  $scope.data = {
    type: Type,
    serialId: serialId
  };
  $timeout(function() {
    Type.PNG = 'this is changed';
    serialId = 'new Serial Id';
    console.log(serialId);
  }, 1000);
}]);

通过对常数的定义,我得到的是常数,它的值不会改变并且它具有固定值。 MDN表示,一旦声明常量,如果常量不是对象,则无法更改它。例如

const x=10;
x=20;//will throw the error.
const obj={};
obj.a='ab'; //will not throw error.

但是在我改变值时角度不变的情况下没有任何反应。它甚至不会通知值已更改。而且文档也没有谈到改变常量的值。 如果我们可以像普通的javascript变量一样更改角度常量的值,那么为什么它们被称为常量?这里是fiddle要播放的

1 个答案:

答案 0 :(得分:7)

之间有区别:

  • 值类型(字符串,布尔值等);和
  • 参考类型(对象,数组等的引用);

变量可以是任何一种类型。

常量变量称为“常量”,因为您无法更改他们的内容:您无法分别设置新值或引用。

换句话说,对于引用类型是常量意味着您不能更改该变量,以便它引用其他内容。 如您所述,您可以更改引用变量所指向的任何对象的内容。

如果您想让对象本身“常量”,您可以使用Object.freeze

var app = angular.module('app', [])
  .constant('Type', Object.freeze({ PNG: 'png', GIF: 'gif' }))
  .constant('SerialId', 'asdfgh12345')
  .controller('myController', ['$timeout', 'Type', 'SerialId', MyController]);
  
function MyController($timeout, Type, SerialId) {
  var vm = this;
  
  // This .data property nor its properties are constant or frozen...
  vm.data = {
    type: Type,
    serialId: SerialId
  };
  
  $timeout(function() {
    Type.PNG = 'this is changed in timeout';
    SerialId = 'changed serial id in timeout';
  }, 1000);
  
  $timeout(function() {
    var el = document.getElementById('x');
    var injector = angular.element(el).injector();
    vm.secondData = {
      type: injector.get('Type'),
      serialId: injector.get('SerialId')
    }
  }, 2000);
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script>
<div ng-app="app" ng-controller="myController as vm" id="x">
  <pre>{{ vm | json }}</pre>
</div>

请注意Object.freeze does not do so recursively,您需要一个函数/库。

另请注意,我隐瞒了一些关于SerialId的评论。首先,要意识到有三个不同的东西名为“SerialId”:

  1. 角度常量名称“SerialId”;
  2. 名为“SerialId”;
  3. 的函数参数
  4. 依赖项数组中的第三项(字符串),“SerialId”;
  5. 运行控制器构造函数时,函数参数将填充常量中的值。顺便说一句,函数参数也可以被命名为Foo。您应该将该参数视为局部非常量变量,其值与常量具有相同的值。