"this" javascript keyword in the context of a function

Question

I am just wondering what the "this" keyword refers to in the context of the function below:

function EditCtrl($scope, $location, $routeParams, Project) {
  var self = this;

  Project.get({id: $routeParams.projectId}, function(project) {
    self.original = project;
    $scope.project = new Project(self.original);
  });

  $scope.isClean = function() {
    return angular.equals(self.original, $scope.project);
  }

  $scope.destroy = function() {
    self.original.destroy(function() {
      $location.path('/list');
    });
  };

  $scope.save = function() {
    $scope.project.update(function() {
      $location.path('/');
    });
  };
}

Especially, I would have thought "this" referred to the EditCtrl function but console.log(typeof this); prints object!!!

The above snippet was taken from http://angularjs.org/#project-js

EDIT: Here is the full code. I am sorry: I should have included it in the first place...

angular.module('project', ['mongolab']).
  config(function($routeProvider) {
    $routeProvider.
      when('/', {controller:ListCtrl, templateUrl:'list.html'}).
      when('/edit/:projectId', {controller:EditCtrl, templateUrl:'detail.html'}).
      when('/new', {controller:CreateCtrl, templateUrl:'detail.html'}).
      otherwise({redirectTo:'/'});
  });


function ListCtrl($scope, Project) {
  $scope.projects = Project.query();
}


function CreateCtrl($scope, $location, Project) {
  $scope.save = function() {
    Project.save($scope.project, function(project) {
      $location.path('/edit/' + project._id.$oid);
    });
  }
}


function EditCtrl($scope, $location, $routeParams, Project) {
  var self = this;

  Project.get({id: $routeParams.projectId}, function(project) {
    self.original = project;
    $scope.project = new Project(self.original);
  });

  $scope.isClean = function() {
    return angular.equals(self.original, $scope.project);
  }

  $scope.destroy = function() {
    self.original.destroy(function() {
      $location.path('/list');
    });
  };

  $scope.save = function() {
    $scope.project.update(function() {
      $location.path('/');
    });
  };
}

Well, `typeof` always prints the **type** of a variable, and if it is the case that `this` is an EditCtrl, it would still be an object, so it is correct. Remember that `typeof` will never tell you the "class" of an object, you should try to log it fully and see what it is. — Matteo Tassinari, Mar 05 '13 at 11:49
Matteo: Thanks. How then can I tell whether an object is a function? What keyword or reflection trick should I use? — balteo, Mar 05 '13 at 11:54

score 4 · Answer 1 · answered Mar 05 '13 at 11:50

4

Normamally this means the context where a function is called

Here in your case as it seems, this function is an independant on itself, so this means the current browser window/document

answered Mar 05 '13 at 11:50

Raab

34,778
4
50
65

Rab: I have edited the post. – balteo Mar 05 '13 at 12:00

score 1 · Accepted Answer · answered Mar 05 '13 at 11:55

1

I would assume that that function is actually an object which is meant to be instantiated. I would think you will find something like var myeditctrl = new EditControl(...) somewhere in the code. In that case this refers to the myeditctrl object.

answered Mar 05 '13 at 11:55

Hath995

821
6
12

I have edited my post. I guess "this" must refer to the module... – balteo Mar 05 '13 at 11:58

"this" javascript keyword in the context of a function

2 Answers2