В этой статье мы разберемся, что это за ключевое слово в 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
Удачного кодирования!!!