Анонимные функции - это просто

 Дорогие друзья!

Мы начинаем скринкаст про анонимные функции. Давайте мы с Вами разберемся для чего они нужны, что они собой представляют и как их можно использовать. Давайте посмотрим, что они нам дают. Анонимные функции нам нужны для безопасности. С помощью их мы можем более безопасно обращаться к нашим событиям, ведь язык Javascript – это язык событий. Мы можем обратиться к какому-то элементу или чего-то запустить очень незаметно благодаря этой функции. Как же их создавать? Мы можем начать с того, что создадим конкретный button. Пусть у него будет айди mybutton, дальше тут будет какой-то Сlick Me.                                              

<div id=”mybutton”>Click Me</div>

С чего начнем?  Сделаем так, чтобы по клику на кнопку мы могли обращаться к содержимому кнопки. Это первое.

Второе. Нам нужно, что бы мы могли вывести на экран это содержимое с помощью, естественно, анонимной функции. Итак, приступаем. Первое действие, что нам необходимо. Как я сказал, нам надо обратиться к кнопке по ее клику. Давайте посмотрим какой айдишник у нашей кнопки, наверное mybutton. Ну  вот и вперед. Пишем mybutton, точка естественно, пишем онклик потому, что нам нужно по клику обратиться к нему. После этого мы ставим равно и делаем запуск самой уже функции. У нас любая функция называется function и всегда после круглых скобок у нас стоят фигурные, обозначая действие.

mybutton.onclick = function() { alert(‘hello’ };

Что нужно сделать? По клику по кнопке мы могли обратиться к содержимому кнопки. Ну давайте обратимся хотя бы к чему-нибудь. Пусть у нас будет alert не ноль, просто напишем hello. Сохраняем и давайте посмотрим. Кнопка у нас есть. Что будет, если мы нажмем на нее. По  моему работает. Правда! Итак, мы увидели, что есть у нас вывод hello, который происходит по нажатию на копку Click Me и это выполняет у нас определенная анонимная функция. Т.е. у нас нет запуска onclick, нет вызова функции, которая где-то уже там определена, нет. Т.е. вот здесь злоумышленник, или  тому подобное, ничего не увидит, он видит здесь просто button и видит его айдишник , точка. Как бы здесь ниже, или где мы можем все это изобразить у нас уже запускается событие по клику на эту кнопку. Это раз. Первое действие мы выполнили, но частично. Мы должны обратиться к содержимому кнопки. Внимание! Как же мы можем обратиться к содержимому кнопки? Кто-то знает, кто-то может быть не знает. Посмотреть, или узнать на что мы нажали, или к чему мы прикоснулись в Javascript, в момент события, помогает указатель сделать this. Что делает? Он при нажатии на конкретную кнопку, он уже создается, т. е уже формируется. Стоит мне нажать на Click Me, уже создался указатель this, который  прекрасно видит и который воспринимает нормально наша анонимная функция. Опять-таки, именные функции объявленные, не понимают this по дефолту и по умолчанию. А анонимная функция все это воспринимает легко. Мы можем обратиться через this. И мы можем узнать, что? Наверно, содержимое нашей кнопки. Обращение к содержимому, или его перезапись, это у нас innerHTML.

// Создаем анонимную функцию по нажатию на кнопку
mybutton.onclick = function(){
	// this - это указатель элемента, на который нажимали
	alert(this.innerHTML);
}

Обращение у нас сделано. Но обратиться мало,  - нам надо как-то это взять и вывести на экран. И посмотреть, что же у нас будет на экране. Давайте попробуем сделать тот же alert и туда просто вывести это содержимое. Так, лишний alert уже убираем.  Давайте сохраним все это дело и проверяем. Кликаем, по моему работает. Итак, у нас получилось обратиться к элементу. У на получилось вывести данные по его нажатию. И у нас получилось все это сделать.

Якщо у вас виникли питання, вбо ви бажаєте записатися на індивідуальний урок, замовити статтю (інструкцію) або придбати відеоурок, пишіть нам на:
скайп: olegg.pann
telegram, viber - +380937663911
додавайтесь у телеграм-канал: t.me/webyk
email: oleggpann@gmail.com
ми у fb: www.facebook.com/webprograming24
Обов`язково оперативно відповімо на усі запитіння

Javascript / Jquery

Узнать подробнее