В этой статье мы разберемся, что это за ключевое слово в javascript,

Хорошее понимание ключевого слова «this» действительно важно для каждого разработчика javascript, но оно немного сбивает с толку, я попытался объяснить его очень просто и легко.

Что такое ключевое слово this в javascript?

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

Возьмите приведенный ниже фрагмент в качестве примера, чтобы понять,

  • мы вызываем функцию printName, которая присутствует внутри объекта Person, внутри этой функции мы печатаем this.name. Как мы обсуждали ранее, this внутри функции будет указывать на объект, для которого она выполняется,
  • здесь thisуказывает на объект Person , поэтому this.name печатает «питер»

Проще говоря, thisвнутри функции будет указывать на объект, который присутствует перед оператором . [точка] во время его выполнения,

В случае функций, присутствующих в объекте window / global, мы обычно вызываем их без оператора точки, это означает, что thisвнутри глобальных функций указывает на объект global. Например,

В приведенном выше коде у нас есть функция с именем foo в объекте global/window, и мы выполняем ее в глобальном объекте, поэтому this внутри foo указывает на global/window.

Давайте немного покрутим два приведенных выше примера,

Рассмотрим приведенный ниже код, чтобы узнать больше о this

  • здесь, в строке № 10, мы вызываем функцию printName() для объекта Person, внутри объекта Person у нас есть свойство myName со значением peter, поэтому this.myName выводит peter
  • В строке № 12 мы назначаем функцию printName объекта Person переменной с именем anotherPrintName и выполняем ее в глобальном объекте, так что теперь this внутри функции будет указывать на объект global. , так как у нас есть переменная с именем myName в глобальном объекте, она печатает john

« это внутри функции определяется на основе того, где и как мы ее вызываем, а не на том, где функция фактически присутствует »

«это» в стрелочных функциях

В отличие от обычных функций, this внутри стрелочной функции ведет себя по-другому, и причина в том,

  • Стрелочные функции не имеют собственного thisконтекста.

В приведенном выше примере printName1 — это обычная функция, а this внутри нее будет указывать на объект Person, поэтому this.myName выводит peter

Но printName2 — это стрелочная функция, поскольку у стрелочных функций нет собственного контекста this, она не указывает на объект Person.

На что «это» указывает внутри стрелочных функций?

  • this внутри стрелочной функции указывает на — thisнормальную функцию, в которую она заключена.

в приведенном выше примере printName2 является стрелочной функцией, которая присутствует внутри обычной функции printName1, поскольку printName2 является стрелочной функцией, this внутри нее будет указывать на включающую ее функцию, которая равна printName1 , следовательно, this.name в printName2 печатает peter .

Я объяснил основы ключевого слова this в js, надеюсь, эта статья вам чем-то поможет.

Вы все еще можете изучить здесь, чтобы лучше понять это ключевое слово в js.

Свяжитесь со мной на Linkedin Github

Удачного кодирования!!!