AngularJS: Constants vs Values

Angularjs

Angularjs Problem Overview


As far as I understand the documentation, the only concrete difference between a Constant and a Value is that a Constant can be used during the apps config phase, whereas a Value is only available during the run phase.

I am curious as to why Values are needed at all in this case? Aren't they really just limited Constants?

Angularjs Solutions


Solution 1 - Angularjs

A constant can be injected anywhere.

A constant can not be intercepted by a decorator, that means that the value of a constant should never be changed.

var app = angular.module('app', []);
 
app.constant('PI', 3.14159265359);

app.config(function(PI){
    var radius = 4;
    //PI can be injected here in the config block
    var perimeter = 2 * PI * radius;
});

app.controller('appCtrl', function(PI) {
    var radius = 4;
    // calculate area of the circle
    var area = PI * radius * radius; 
});

Value differs from constant in that value can not be injected into configurations, but it can be intercepted by decorators.

var app = angular.module('app', []);

app.value('greeting', 'Hello');

app.config(function ($provide) {
    $provide.decorator('greeting', function ($delegate) {
        return $delegate + ' World!';
    });
});

Solution 2 - Angularjs

The difference between value and constant is that a value specified using constant is available during the configuration phase.

Well it’s the same for value and constant. constant is available from the configuration phase and value is not.

The other difference is as the name implies you can’t change the value of a constant. The first value you assign it is the value it keeps, if you try to assign it a different value later it will be ignored.

Here’s an example:

mod.value("myValue", "First Assignment");

mod.value("myValue", "Second  Assignment");

mod.constant("myConstant", "First Assignment");

mod.constant("myConstant", "Second Assignment");

mod.controller("MyController", function(myValue, myConstant) {

    console.log("myValue: " + myValue);

    console.log("myConstant: " + myConstant);
});

Console output:

myValue: Second Assignment

myConstant: First Assignment

Solution 3 - Angularjs

True, however, keep in mind if you use an object as a constant, its value can be overridden anytime, anywhere. For example

const version = '10.0'

can not be changed, if you take a look at the console it even throws an error when changing its value, but

const config = {
    'version': '8.6'
}

behaves like a simple value, you can change the the object values anytime, like this:

config.version = 5

tada, now your version is 5. Same applies for app.const('constant', 'its me')

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestioncsvanView Question on Stackoverflow
Solution 1 - AngularjsArtem PetrosianView Answer on Stackoverflow
Solution 2 - AngularjsBhupendra GuptaView Answer on Stackoverflow
Solution 3 - AngularjsKiss KoppányView Answer on Stackoverflow