Джаваскрипт часть 16

Сегодня мы поговорим об этом ключевом слове ура!

Будет немного запутанно, мы все видели это в нашем коде. Я постараюсь объяснить, как правильно его использовать.

когда мы используем this не в функции или объекте, а само по себе, оно возвращает окно браузера. Он присоединен к глобальному объекту.

Это потому, что это что-то вроде «липкого клея». Он привязывается к своему месту в программе. «Это» находится в окне, поэтому оно прилипает к этому и становится им.

когда мы используем this внутри функции, «this» будет присоединен к объекту, которому принадлежит функция.

В этом примере мы используем ключевое слово this для привязки любой информации, которую пользователь передает в аргументы. «this» в приведенном выше примере — буквально просто замена «Car».

Если по какой-то причине вы не поместили внутрь функции ничего, кроме оператора «this», и он не устанавливается вызовом функции. Его значением по умолчанию будет глобальный объект.

Итак, вы видите, что если мы вызовем функцию «f1» и сравним ее с окном, она вернет true.

Давайте погрузимся еще глубже, используя некоторые методы.

метод call() =всякий раз, когда мы используем это ключевое слово в теле функции, мы можем использовать метод call. Затем значение можно привязать к конкретному объекту при использовании метода вызова.

Выше мы создаем функцию «добавить», которая принимает аргументы c и d. мы возвращаем «это. а» и «это. б » плюс в и г.

мы создаем объект с ключами a и b с некоторыми значениями.

затем, когда мы используем метод «вызов» для функции «добавить». который принимает переменную obj и некоторые числа по нашему выбору, которые становятся c и d. но поскольку мы передаем переменную obj, которая является объектом. Это ключевое слово привязывается к тому объекту, который мы передаем с помощью ключей a и b.

Наконец, мы получаем 16 назад.

Метод apply() =метод применения аналогичен методу вызова, но не принимает список аргументов. apply принимает массив аргументов.

здесь мы используем ту же функцию, только она принимает два аргумента, которые будут установлены при вызове функции. так что в нашем случае будет 10 и 20.

затем obj привязывается к этому ключевому слову и извлекает значение, связанное с a и b, из переменной obj.

возвращение 34!

метод bind() = когда вы используете привязку к функции, она создает новую функцию с тем же телом и областью действия, что и у исходной функции, но она постоянно устанавливается на первый аргумент, который настроен на привязку .

Здесь мы создаем функцию для «тестирования», а затем она возвращает «this. а”.

мы создаем переменную для g, затем вызываем функцию test с помощью bind. который принимает аргумент объекта с ключом и значением «мы сейчас в функции». Наконец, вызовите функцию g(), вот и все, мы создали новую функцию, которая выводит «мы сейчас в функции».

Функция стрелки теперь!

если вы не знаете, какие стрелочные функции читайте сюда!

здесь мы создали переменную с именем newObj, и у нее есть два ключа с прикрепленными к ним функциями. «tradFunc» вернется, чтобы увидеть, связано ли «this» с «newObj», который мы создаем. «arrowFunc» имеет два теста (console.logs), один из которых проверяет, связано ли «this» с «newObj». затем мы видим, привязано ли «это» к окну.

мы вызываем объекты и обе функции. tradFunc() возвращает «true», да, «это» привязано к newObj

С другой стороны, arrowFunc() возвращает false для newObj, но true для окна. Это связано с тем, что arrowFunc() была создана в пределах окна, но выполнялась в «newObj». поэтому функция стрелки навсегда привязана к области окна, в котором она была создана.

Хорошо, последнее для нашего "этого" приключения...

здесь мы создали переменную с именем lastObj, у которой есть prop key и fun key. prop установлен на число 3000, а fun имеет значение функции. который тело имеет this.prop.

когда мы используем console.log(), lasObj.fun(), он вернет 3000. this.prop, он увидит его как lastObj.prop со значением 3000, поэтому функция fun() вернет 3000.

В любом случае, надеюсь, что прояснил некоторые вещи для вас!

посмотрите еще кое-что от меня ниже

посмотрите еще...

Javascript 1 (ссылка на: переменные и типы данных)

Javascript 2 (ссылка на: числа и строки)

Javascript 3 (ссылка на: запись в квадратных скобках и 20 методов сравнения строк)

Javascript 4 (ссылка на: функции и как они работают)

Javascript 5 (ссылка на: подъем, операторы сравнения и операторы if-else)

Javascript 6 (ссылка на: diff. Знаки равенства, null и undefined)

Javascript 7 (ссылка на: логический оператор, &&, || и тернарные операторы)

Javascript 8 (ссылка на: операторы переключения и массивы)

Javascript 9 (ссылка на: часто используемые массивы в javascript)