<MyRusakov.ru />

JavaScript, jQuery и Ajax с Нуля до Гуру

JavaScript, jQuery и Ajax с Нуля до Гуру

Видеокурс "JavaScript, jQuery и Ajax с Нуля до Гуру" научит Вас "вдыхать жизнь" в страницы, делая их с потрясающими эффектами и максимальным удобством для пользователя.

Курс научит Вас писать скрипты на JavaScript, а также обучит использованию библиотеки jQuery и технологии Ajax.

Практически любой красивый сайт (с красивыми галереями изображений, слайдерами, плавными переходами и так далее) использует jQuery. А практически на любом серьёзном сайте вовсю используется технология Ajax, которая делает работу с сайтом максимальной удобной.

Поэтому курс "JavaScript, jQuery и Ajax с Нуля до Гуру" Вам просто необходим, если Вы хотите создавать по-настоящему достойные сайты.

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

Использование call(), apply() и bind() в JavaScript

Использование call(), apply() и bind() в JavaScript

JavaScript - очень динамичный язык, что является одновременно его плюсом и минусом. Минусом, потому, что далеко не сразу становится очевидно, что действительно стоит за тем или иным аспектом языка, т.е. за кажущейся простотой стоит достаточно сложная концепция. В частности, это касается ключевого слова this в JavaScript. Работать с this в JavaScript не так просто как может показаться на первый взгляд. Это может привести к тому, что "программа работает, но неизвестно как" или того хуже "программа не работает и неизвестно почему.".

Сегодня мы рассмотрим неотъемлемых спутников this, методы сall(), apply() and bind().

Правила JavaScript this

  1. this всегда ссылается на объект
  2. this ссылается на объект, вызывающий функцию
  3. в глобальном контексте this содержит ссылку на объект окна (window), либо содержит undefined в строгом режиме (strict mode)
var pad = {
        regNumber: "AE8345FEDAS",
        brand:     "HUAWEI",
        
        showInfo: function() {
            console.log(this.regNumber + " " + this.brand);
        }
    
}

Все будет работать прекрасно при использовании в следующем виде:

pad.showInfo(); // AE8345FEDAS HUAWEI

Но что произойдет, если мы захотим одолжить метод?

var padDetails = pad.showInfo;
padDetails();

В данном случае ничего работать не будет, так как this ссылается на глобальный контекст (глобальный объект), который не содержит переменных regNumber и brand.

Метод bind

Для похожих случаев, как в примере выше, мы можем использовать метод bind, являющийся свойством Function.prototype. Основная его задача - вернуть функцию, которая будет вызвана для нужного вам контекста.

var padDetails = pad.showInfo.bind(pad)
padDetails();

Теперь пример заработает, так как метод bind привязывает новый контекст, где this ссылается на переданный bind параметр. Таким образом, с помощью метода bind можно вызвать функцию, передавая ей определенный контекст.

Но, что, если нам необходимо передать параметры в функцию showInfo. Тогда наш пример приобретет следующий вид:

var pad = {
    regNumber: "AE8345FEDAS",
    brand:     "HUAWEI",
    
    showInfo: function(country) {
        console.log(country + " " + this.regNumber + " " + this.brand);
    }
    
}

var padDetails = pad.showInfo.bind(pad, "China")
padDetails();

Методы call() и apply()

Эти методы также доступны через свойство Function.prototype, т.е. могут вызываться у любой функции.

Вот как они применяются:

var pad = {
    regNumber: "AE8345FEDAS",
    brand:     "HUAWEI"
}


function showInfo(country) {
    console.log(country + " " + this.regNumber + " " + this.brand);
}

// передаем контекст функции showInfo через метод apply
showInfo.apply(pad, ["Taiwan"]);

// а здесь через метод call
showInfo.call(pad, "China");

Обратите внимание здесь на одну деталь: при использовании функции apply() параметры передаваемые в вызываемую функцию должны иметь вид массива, тогда как call() просто отдельные значения.

Таким образом, методы bind(), apply() и call() используются при установке контекста вызываемой функции и поэтому часто они становятся незаменимым инструментом в JavaScript.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (0):

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