Функция стрелки и это внутри функции конструктора

Question

Я прочитал этот абзац об этом ключевом слове: https://bonsaiden.github.io/JavaScript-Garden/#function.this

В этом первом случае this относится к global objet, и это кажется совершенно нормальным, потому что когда у нас есть функция стрелки, она автоматически связывает this с той, которая находится во внешней области видимости.

var obj = {
      foo : () => console.log(this)
    }
console.log(obj);
obj.foo()

Однако я не могу объяснить следующее поведение:

function bar(){
  this.foo = () => console.log(this)
} 

var obj = new bar()
console.log(obj);
obj.foo()

Теперь this относится к obj вместо global. Это почему ? Мне кажется, что использование ключевого слова new с функцией конструктора должно вернуть объект obj, который точно такой же, как в первом примере. И поэтому функция стрелки должна иметь this, которая относится к global, а не к obj. Не могли бы вы объяснить мне, что происходит во втором случае, пожалуйста?

Answer 1

Функции -> Нет отдельных this

До функций стрелок каждая новая функция определяла свое собственное это значение ( новый объект в случае конструктора , неопределенное в строгом mode вызовы функции, базовый объект, если функция вызывается как «метод объекта» и т. д.). Это оказалось далеко не идеальным с объектно-ориентированным стилем программирования

Подробнее о ключевом слове new здесь

Функция конструктора ... вызывается с указанными аргументами, а this связывается с вновь созданным объектом .

Конструктор bar () определяет this как сам.

Answer 2

Хотя я сам не очень хорош в объектах (надо над этим работать), я думаю, что когда вы делаете const test = new Test(), вы инициализируете новый объект. Таким образом, область действия (?) this ссылается только на вновь созданный объект, поэтому вы делаете this.foo, а затем ссылаетесь на это свойство foo с помощью obj.foo. С другой стороны, когда вы просто делаете const obj = { .... }, вы фактически не инициализируете новый объект, поэтому this идет прямо к глобальному объекту - окну. Таким образом, const test = new Test создает новый объект, в то время как использование только const obj = {} означает , а не новый объект и this по умолчанию переходит к объекту окна.