Understanding coding style in Angularjs

Question

I came across different coding style using Angularjs and it made me think what the advantage and disadvantage of each coding style.

eg. Declaring of controllers:

Style #1

angular.module('mainCtrl', []);
function MainCrl($scope, $rootScope) {}

Style #2

angular.module('mainCtrl',[])
.controller('MainCtrl', function($scope, $rootScope)) { ... });

Style #3

angular.module('mainCtrl',[])
.controller('MainCtrl', ['$scope', '$rootScope', function(scope, rootScope)) { ... }]);

Hence style #3 is somewhat like using an alias, does using an alias have an effect when your going to write a testscript (unit testing)?. I just want to have a better understanding and the correct approach when using Angularjs Framework.

Please do share your thoughts about this. Thanks!

Answer 1

Style #1 means the controllers are defined outside of the module as globals, alright for small test projects but for any serious work, everything should be done using #2 or #3. The difference between #2 and #3 is #3 is minifiable as the $scope and $rootScope names in #2 will normally be optimised out, which causes the application to fail. #3 Stores these as strings which will not be minified out.

If there's at least a possibility that you'll be minifying your code, go for #3. There's very little point in using #1 over #2 so I tend to avoid #1 altogether.