javascript - Reason for using array notation when defining AngularJS Controller

Question

Apologies if this question sounds too obvious.

I've recently starting exploring and learning AngularJS. I've gone through some good tutorials -

• Official Docs
• w3cSchool
• Some cool site

.. and there are a few other that I've seen.

I'm not saying that I've read/studied all the documents.

Question starts here -

Now, coming to the question, I see that the definition of a Controller is different in one place and it's different in some other -

One definition uses a sort of array notation (not sure of the official term) for injection:

app.controller("MyCtrl", ['$scope', function($scope){
    $scope.someData = "Array notation";
}]);

And there's this, with no array:

app.controller("MyCtrl", function($scope){
    $scope.someData = "non-array notation";
});

Not saying this is the only thing that I'm trying to understand but yes, I'd definitely love to understand the difference.

Is there a major difference between the two?

Thanks a lot.

Note: I did search for similar questions in SO but couldn't find what I was looking for. Sorry.

Answer 1

The difference is that when the second is minified, the parameter name will be minified and angular will no longer be able to inspect the arguments to figure out which dependencies to inject. The array syntax with the dependency in a string means that it is minification safe.

There is a library called ng-annotate which will change the second example into the first example so that the code is again minification safe.