AngularJs: Uncaught ReferenceError: $scope is not defined in debugger mode

Question

I have the following code:

Html

<div ng-controller="MyCtrl">
   {{message}}!
    <button ng-click="changeMessage()">change Message</button>
</div>

---

AngularJs

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

function MyCtrl($scope, $http) {
    $scope.message = 'Hello $scope';
    $scope.newMessage = 'Hello World';
    $scope.changeMessage = function(){
        $scope.message = $scope.newMessage;//debugger;
    }
}

---

In this scenario, there is no problem. But, if you change this line:

$scope.message = $scope.newMessage;

with:

debugger;

then click the button, while the console is open, and write $scope, you'll get this error:

Uncaught ReferenceError: $scope is not defined

So my questions are:

• Why the $scope is accessible when you use the $scope inside the function, and is not accessible in debug mode (when you are not using the $scope somewhere in the function)
• How to work with $http under this circumstances, because $http is not accessible too

Jsfiddle

Note: Maybe this is duplicate question, but I didn't find straight explanation for this issue, and solution as well