Събития в браузъра: как интерфейсът реагира на действие

Полезно е да знаеш

Натискане на бутон, изпращане на формуляр и промяна на размера на прозореца са примери за събития в браузъра. Те позволяват програмата да реагира, когато се случи определено действие. Вместо постоянно да проверява дали посетителят е натиснал бутон, кодът регистрира слушател за подходящото събитие. Когато то бъде доставено до целта, се изпълнява свързаната функция. Методът addEventListener предоставя обичайния начин за такова регистриране върху обекти, които поддържат събития. [1]

В тази организация има три различими части: цел, тип събитие и обработваща функция. Целта може да бъде конкретен елемент, документът или прозорецът. Типът указва какво се наблюдава, а функцията определя реакцията. [1] Това разделение помага при диагностика. Ако надписът не се променя, можем последователно да проверим дали е намерен правилният бутон, дали е избрано правилното събитие и дали самата функция дава очаквания резултат. Така проблемът не остава общо твърдение, че JavaScript не работи.

Представете си измислен списък с разяснения, при който бутон показва допълнителен абзац. Преди програмирането е полезно да се опише поведението с обикновени думи: какво се вижда първоначално, какво се променя след действие и какво става при повторно действие. Това създава проверим сценарий. Слушателят е техническата връзка между събитието и реакцията, но сам по себе си не решава какъв трябва да бъде удобният интерфейс за човека, който чете страницата.

Не всяка реакция изисква отмяна на стандартното действие на браузъра. Методът preventDefault заявява, че стандартното действие на отменимо събитие не трябва да бъде изпълнено. Това е различно от спиране на разпространението на събитието. [2] Например решението как да бъде обработена една връзка трябва да се разглежда отделно от решението кои слушатели я наблюдават. Иначе в един кратък обработчик могат да се смесят няколко независими намерения, което затруднява проверката.

При добавяне на слушатели има значение и какви функции се регистрират. Две отделно създадени анонимни функции не стават една и съща функция само защото текстът им изглежда еднакъв. Повторното им регистриране може да добави отделни слушатели. [1] В практическа задача е полезно да се провери дали едно действие причинява точно една очаквана промяна. Ако резултатът се удвоява след повторно отваряне на компонент, това е конкретен повод да се разгледа жизненият цикъл на регистрацията.

Добрата проверка включва първо действие, повторно действие и връщане към началното състояние. За всеки случай записваме какъв видим резултат очакваме. Това прави малкия интерактивен компонент разбираем и за човек, който не е писал кода. Събитията дават механизма за реакция, а ясният сценарий определя дали тази реакция е правилна, предвидима и достатъчна за задачата на посетителя.