After recently immersing myself in the world of Javascript and AngularJS, drawing on my Java and C++ knowledge, I encountered a frustrating situation. A simple error cost me an entire day of debugging - all due to a missing comma in a JSON file:
"name": "Melbourne",
"snippet": "Melbourne"
"location":{"lat": "37.8136S", "long": "144.9631E"}This experience left me pondering: What's the best way to debug in the realm of Javascript/AngularJS? Specifically in cases like this one, as well as more generally. Spending hours scrutinizing every line of code surely can't be the most efficient solution. In languages like C++ or Java, I would typically turn to the stacktrace; therefore, I checked the console output in Chrome and discovered:
SyntaxError: Unexpected string
at Object.parse (native)
at fromJson (http://localhost:8000/app/bower_components/angular/angular.js:1078:14)
at $HttpProvider.defaults.defaults.transformResponse (http://localhost:8000/app/bower_components/angular/angular.js:7317:18)
at http://localhost:8000/app/bower_components/angular/angular.js:7292:12
at Array.forEach (native)
at forEach (http://localhost:8000/app/bower_components/angular/angular.js:323:11)
at transformData (http://localhost:8000/app/bower_components/angular/angular.js:7291:3)
at transformResponse (http://localhost:8000/app/bower_components/angular/angular.js:7963:17)
at wrappedCallback (http://localhost:8000/app/bower_components/angular/angular.js:11319:81)
at http://localhost:8000/app/bower_components/angular/angular.js:11405:26 angular.js:9778
But how does this error trace actually assist me? It seems to only point towards library code rather than shedding light on my own JSON data or coding mistakes. The problematic lines in my scripts are revealed as follows:
//citycontroller.js
$scope.cities= City.query();
//cityservice.js
cityServices.factory('City', ['$resource',
function($resource){
return $resource('cities/:cityId.json', {}, {
query: {method:'GET', params:{cityId:'cities'}, isArray:true}
});
}]);
Why aren't there corresponding stacktraces for these specific portions of my code?