Что означает «это» в прототипе?

Скажем, у нас есть следующий пример:

const Foo = {
  init: function(who) {
    this.me = who;
  },
  speak: function() {
    console.info(this.me);
  }
};

Затем у нас есть новые объекты, прототип которых ссылается на foo:

  const b1 = Object.create(Foo);
  const b2 = Object.create(Foo);
  b1.init("Kristopher");
  b2.init("Jane");
  b1.speak();
  b2.speak();

Вывод следующий:

Kristopher
Jane

Но я ожидал, что «это» будет относиться к контексту функции-прототипа. Если бы каждый новый объект просто ссылался на прототип, я думал, что будет выведено следующее:

Jane
Jane

Почему это не так? Я думал, что, поскольку Foo является общим прототипом b1 и b2, изменение this.me перезапишет переменную как для b1, так и для b2?

this относится к контексту вызова ток. В данном случае это экземпляр, созданный Object.create и сохраненный, скажем, в b1. Прототип не пострадал. Если бы это было так, то вся цепочка прототипов была бы довольно бесполезна, если бы все, что происходит от прототипа, только модифицировало этот прототип.
VLAZ 10.05.2019 20:43

@VLAZ круто, спасибо. Можете ли вы сделать это ответом, чтобы я мог принять его

kag359six 10.05.2019 20:59
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
107
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Давайте разберем это:

const b1 = Object.create(Foo);
const b2 = Object.create(Foo);

Эти строки создают два отдельных экземпляра, используя Foo в качестве прототипа.

b1.init("Kristopher");

Вы позвонили init с "Кристофер" в качестве аргумента. this в данном случае b1. init назначит «Кристофера» b1me.

b2.init("Jane");

Вы позвонили init с "Джейн" в качестве аргумента. this в данном случае b2. init назначит «Джейн» как b2me.

b1.speak();
b2.speak();

Печатает me обоих объектов.

Проще говоря, значение this не является фиксированным в то время, когда вы его написали (из-за чего вы подумали, что это Foo). Это зависит от того, как функция была вызвана, когда она была вызвана.

const obj = { somefunc() { ... } }

obj.somefunc() // this === obj

const foo = obj.somefunc
foo() // this == window in non-strict mode, this === undefined in strict mode

const arr = []

const bound = obj.somefunc.bind(arr)
bound() // this === arr

obj.somefunc.call(arr) // this === arr
obj.somefunc.apply(arr) // this === arr

Другие вопросы по теме