Как работает ключевое слово this?

В Си-подобных языках программирования this ссылается на текущий объект. Т.е. на объект, которому принадлежит метод, в котором используется слово this. Однако в JavaScript методы или функции могут не принадлежать объекту, могут принадлежать нескольким объектам или менять объекты, которым принадлежат. Поэтому слово this указывает на контекст вызова функции.

document.writeln(“Windows height is ” +this.innerHeight);

This можно использовать глобально, т.е. без привязки к конкретному объекту или классу. В этом случае this ссылается на глобальный объект Object. Глобальный объект предоставляется средой исполнения (или окружения). Если ваш код будет выполнятся в браузере, то this будет указывать на объект Window. Если в node.js то на объект Global.

Точно также this будет обращаться к глобальному контексту, объекту Window, в нашем случае, окну браузера, если использовать this в глобальной функции (функции, которая не принадлежит никакому объекту). 

function get Content Width(){

    return this.innerWidth;

}

Если же функция объявлена локально, то есть является методом объекта. И тогда слово this будет ссылаться на контекст этого объекта и сможет использовать свойства и другие методы текущего объекта.  

var Cat = {

   name: “Sally”,

   whatToSay: “May”,

   sayMay: function() {

       return this.whatToSay;

   }

}

document. writeln(cat.sayMay());

В JavaScript методы не обязательно принадлежат какому-то объекту.  Поэтому после объявления функции, мы можем указать какому объекту или объектам принадлежит данная функция. Это называется установкой контекста. Например: 

var  Robot = {

   name: “Linda”

};

function DoMath() {

   return  5*7;

};

Robot.DoMath = DoMath();

Здесь мы создаем свойство DoMath присваиваем глобальную функцию DoMath(). И меняем контекст выполения для функции DoMath() с глобального на контекст объекта Robot.

JavaScript крайне гибок в аспекте смены контекста для функции. Это значит, что мы можем менять контекст функции после ее объявления. Мы можем даже создать объект без метода. И потом назначить объекту без метода этот метод из объекта, имеющего его. Например:

var  Robot = {

   name: “Linda”, 

   DoMath: function () {

      return  5*7;

   } 

};

var Android = {

   name: “B4”

};

Android.DoMath = Robot.DoMath;   // 111

document.writeln(Robot.DoMath());

document.writeln(Android.DoMath()); // 222

Присваивание контекста метода DoMath() объекту Android. Но такой синтаксис наглядный, но используется редко. Присвоение нового контекста вызова делают прямо в месте вызова при помощи функции call(), где первым параметром передают контекст вызова. Например вместо строк // 111 и // 222  пишут одну строку, вот так:

document.writeln(Robot.DoMath(Android));