Понимание поведения this, в котором задействованы аргументы

Итак, у меня есть 3 функции:

function a() {
  arguments[0]();
}

function b(fn) {
  fn();
}

function c() {
  console.info(this);
}

Теперь рассмотрим выходы:

a(c) // Arguments
b(c) // Window
a(() => {console.info(this}) // Window
b(() => {console.info(this)}) // Window

Почему a(c) выводит аргументы, пока он является оконным (с учетом нестрогих) во всех остальных случаях?

Единственный, казалось бы, странный случай здесь - это первый. С foo.bar(), foo будет таким. Это эквивалент foo["bar"](), следовательно, он также эквивалентен arguments[0]().

Madara's Ghost 31.10.2018 09:41

Потому что arguments[0](); - это вызов метода.

Bergi 31.10.2018 09:43

Спасибо @Bergi. Мне потребовалось время, чтобы осмыслить это

apnerve 31.10.2018 11:17
Поведение ключевого слова "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) для оценки ваших знаний,...
4
3
57
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

В JavaScript this обычно относится к объекту, из которого была вызвана функция (если это не стрелочная функция). Так, например, если мы сделаем что-то вроде этого:

var obj = { fun: function() { console.info(this); } }
var obj1 = { fun: obj.fun, otherProperty: 123 }
obj.fun(); // equivalent to obj["fun"]()
obj1.fun(); // equivalent to obj1["fun"]()

Мы обнаружим, что в первом вызове this ссылается на obj, а во втором - на obj1, хотя это та же функция.

Теперь переменная arguments - это объект, в котором хранятся все аргументы, переданные функции. Если аргумент был функцией и вы обращаетесь к нему через объект arguments, он становится «родительским» объектом, из которого была вызвана функция, и становится новым this в контексте выполнения функции. Вы можете считать свой случай примерно таким:

function c() {
  console.info(this);
}
var arguments = { "0" : c }
arguments["0"]() // will log the arguments object

Во втором вызове (b(c)) функция, переданная в качестве аргумента, вызывается непосредственно внутри родительской функции, без доступа к ней через прокси-объект - в этом случае this будет скопирован из родительской области выполнения, которой является window.

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

Подробнее о стрелочных функциях: Стрелочные функции

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