Читать оригинал статьи на https://www.devhelperworld.in.
Все мы знаем, что javascript поддерживает функции объектно-ориентированного программирования. Таким образом, мы можем сказать, что объект является основным строительным блоком ООП (объектно-ориентированного программирования). В javascript есть один специальный объект, «этот» объект.
В этой статье мы узнаем, как на самом деле работает ключевое слово «этот», как значение «этого» объекта полезно в различных ситуациях.
Но прежде чем углубиться в изучение «этого» объекта, нам нужно знать основы того, как браузер выполняет код js.
Понимание контекста выполнения
Как мы все знаем, javascript — это язык сценариев. Итак, естественно, интерпретатор интерпретирует код javascript. Затем этот код выполняется построчно. Область, в которой выполняется код, называется контекстом выполнения.
Давайте разберемся с этой концепцией на примере реальных сценариев. Предположим, вас спросили о вашей роли в проекте, в котором вы сейчас работаете. Затем в ответ на этот вопрос вы кратко объясните свою роль. Итак, вы дали свой ответ в том контексте, для которого был задан вопрос. Аналогичная концепция применима в контексте выполнения javascript.
Когда любой код выполняется в javascript, он оценивается как один из следующих.
- Глобальный контекст: в этой среде ваш код запускается впервые.
- Контекст функции: применим всякий раз, когда поток выполнения входит в тело функции.
- Внутренний контекст: текст, который будет выполняться внутри внутренней функции eval, попадает в эту область.
На приведенном выше снимке экрана красная рамка указывает на глобальный контекст, а зеленая — на функцию или локальный контекст. Доступ к глобальному контексту можно получить из любого другого контекста в коде javascript.
Когда функция вызывается, она создает частную область, в которой все, что объявлено внутри функции, не может быть напрямую доступно из-за пределов текущей области действия функции.
Но функция может легко получить доступ к переменной, которая объявлена вне ее текущего контекста. Это фундаментальная концепция контекста выполнения.
Роль Javascript этого объекта в контексте выполнения
Теперь, когда у вас есть четкое представление о контексте выполнения, давайте обсудим, как «этот» объект играет в нем свою роль.
Мы уже знаем, что javascript выполняется как один поток, а это значит, что в браузере будет выполняться только один оператор. Другие действия будут храниться в стеке, известном как контекст выполнения.
Контекст выполнения изменяется в зависимости от элемента, который находится на вершине этого стека. Объект, на который ссылается this, изменяется каждый раз, когда изменяется контекст выполнения.
«этот» объект относится к глобальному объекту. Всякий раз, когда код запускается как часть вызова функции, «это» относится к глобальному объекту.
Например, когда мы запускаем javascript в браузере, объект окна считается глобальным объектом. В среде Node Js уникальный объект «global» будет значением «this».
Что это означает в Javascript
Ключевое слово имеет разные значения, и они зависят от того, где именно используется «это» ключевое слово.
- Он относится к глобальному объекту, который является глобальным, если вызывается в среде Node Js, и принадлежит объекту окна, если он выполняется в среде браузера.
- В то время, когда функция выполняется как свойство объекта, «это» относится к родительскому объекту.
- Когда функция вызывается с оператором «новый», то «это» относится к вновь созданному экземпляру.
- Когда функция выполняется с методом применения и вызова, тогда «это» относится к значению, переданному в качестве первого параметра метода применения или вызова.
Давайте обсудим эти варианты использования один за другим.
Javascript Варианты использования этого объекта
В IIFE (выражение немедленно вызванной функции):
Если вы не знаете, что такое IIFE, вы можете узнать больше об этом здесь. Если включена опция использовать строго, то значение это будет неопределенным. Кроме того, глобальный объект относится к undefined в случае объекта окна.
Относится к текущему экземпляру
Когда мы определяем класс в javascript и определяем там конструктор, то этот конструктор вернет новый экземпляр этого класса. В этом сценарии ключевое слово this будет относиться к текущему экземпляру только что созданного класса.
Относится к родительскому объекту
В javascript свойство объекта может быть значением или простым методом. В то время, когда вызывается метод, принадлежащий объекту, «это» относится к объекту, содержащему метод, который будет выполнен.
В приведенном выше фрагменте кода, когда вызывается метод экземпляра пользователя user.showMessge(), ключевое слово this относится к объекту пользователя, а не к глобальному объекту. Вот почему он отображал «false» в качестве вывода.
Но когда вызывается только метод showMessage(), ключевое слово this относится к глобальному объекту. Таким образом, отображается время «истинное». Во время вызова fun1() она отображала значение «true», поскольку считалась обычной функцией.
Использование с методами call() и apply()
Известно, что функция Javascript имеет 3 уникальные функции: call(), apply() и bind(). С помощью этих функций мы можем явно указать, на что должно ссылаться ключевое слово «this» в вызывающей функции.
Основное различие между методом call и apply заключается в том, что функция call() ожидает, что параметры будут передаваться индивидуально, тогда как функция apply() ожидает, что они будут переданы в виде массива параметров.
Заключительные слова
Я надеюсь, что смогу развеять все ваши сомнения относительно javascript «этого» объекта. Если эта статья окажется для вас полезной, поделитесь ею с другими.
