Sündmustepõhine programmeerimine: täielik juhend näidetega

Informatec Digital » Programmeerimine » Sündmuspõhine programmeerimine: täielik juhend näidetega

Sündmuspõhine programmeerimine on arendusstiil, kus rakendus reageerib ümbritsevale, mitte jäigale sammude loendile. Järjepideva punktist A punkti B täitmise asemel ootab tarkvara sündmusi ja reageerib, kui keegi klõpsab, saabub andmeid või süsteemi olek muutub.

Kui sul on järjestikuse programmeerimise taust, avab see lähenemisviis sulle uute võimaluste maailma rikkalike liideste, suure koormusega teenuste ja reaalajas töövooge töötlevate süsteemide jaoks. Pakun põhjalikku ülevaadet kontseptsioonidest, arhitektuurist, sündmuste tüüpidest, praktilisest koodist (JavaScript, Node.js ja Python/tkinter) ja parimatest tavadest, mis aitavad sul seda hõlpsalt omandada.

Mis on sündmuspõhine programmeerimine?

Selles paradigmas aktiveeritakse loogika siis, kui midagi olulist juhtub: kasutaja interaktsioon, võrgusõnumid, andurid, taimerid või mis tahes programmeerija määratletud signaal. Seda "midagi" nimetatakse sündmuseks ja see käivitab ühe või mitu käitlejat , mis sisaldavad vastust, mida soovite käivitada.

Peamine on see, et sündmused saavad toimuda asünkroonselt, isegi paralleelselt. Programm jälgib sündmuste tsüklit, mis kogub, järjekorda paneb ja jaotab sündmusi vastuvõtjatele , hoides rakenduse reageerimisvõimelisena ja avades blokeeringuid.

Olulised mõisted: sündmused, emitterid, vastuvõtjad ja silmus

Sündmus on millegi toimumise ilming: klõps, topeltklõps, klahvivajutus, allalaadimise lõpp, võrgupaketi saabumine, akna avamine jne. Tavaliselt kannab see endas andmeid (kasulikku koormust) ja konteksti, mis kirjeldab toimunut , võimaldades käitlejas otsuseid langetada.

Sündmusi genereerivaid komponente nimetatakse emitteriteks; neid, mis nendega tegelevad, nimetatakse vastuvõtjateks või kuulajateks. Nende vaheline seos luuakse tellimismehhanismide (kuulajate) või sidumise abil , mis näitavad, millist funktsiooni tuleks iga sündmuse tüübi puhul täita.

Süsteemi südameks on sündmuste tsükkel. See tsükkel kogub ootel sündmusi, sorteerib need ja edastab vastavatele käitlejatele. Tänu sellele mustrile saab rakendus reageerida mitmele stiimulile ilma liidest blokeerimata või ressursse raiskamata.

Visuaalses ja mobiilses keskkonnas eristate ka kasutaja algatatud sündmusi (klõpsamine, lohistamine, koputamine, seadme kallutamine) ja automaatseid sündmusi (ekraani avamine, taimeri käivitamine, fookuse muutmine). Nende kahe rühma eraldamine aitab teil kujundada ennustatavaid interaktsioonivooge.

Kuidas sündmuse elutsükkel toimib

Dünaamika saab kokku võtta kolmes omavahel seotud etapis. Esiteks genereeritakse sündmus (inimese, süsteemi, võrgu või riistvara poolt) ; see sündmus siseneb ühisesse kanalisse (järjekorda), samal ajal kui sündmuste tsükkel jälgib.

Teiseks toimub kuulamine. Seda tüüpi sündmusele registreerunud vastuvõtjad tuvastavad selle (näiteks klõpsu kuulaja või sokli andmekäitleja) ja on tegutsemiseks valmis.

Lõpuks toimub käitlemine. Kontroller töötleb sündmuseobjekti, kontrollib selle omadusi (tüüp, sihtmärk, väärtused) ja otsustab, mida teha : värskendada kasutajaliidest, valideerida, levitada, tühistada või emiteerida uusi kaskaadseid sündmusi.

Kõige sagedasemad sündmuste tüübid

Praktikas puutute kokku tuntud perekondadega. Nende nüansside mõistmine säästab teid paljudest peavaludest nende täiustamisel ja rakendamisel.

• Hiir või kursor: klõps, dblklõps, hiire alla, hiirülestõstmine, hiirega üleviimine, hiire eemaldamine, hiire liigutamine, kontekstimenüü.
• Klaviatuur: klahvi alla, klahvi üles, klahvivajutus (tähemärkide klahvide jaoks).
• Aken ja dokumentlaadimine, viga (ressursside laadimisel), suuruse muutmine, kerimine, lehe peitmine/kuvamine.
• vormidsisend, muutus, esita, fookus sisse/fookus välja.
• Ratas/kerimine: horisontaalse ja vertikaalse kerimise andmetega ratas.

Lisaks sündmuse nimele pakub sündmuseobjekt lisateavet. Positsioonide puhul leiate clientX/pageX ja clientY/pageY; klaviatuuride puhul kontrollige klahvi, koodi või modifikaatoreid (shiftKey, altKey, ctrlKey) ; rattaandmete puhul leiate ühiku määramiseks deltaX, deltaY ja deltaMode.

Kuulamine ja ürituste korraldamine praktikas

Veebis on kaks tüüpilist lähenemisviisi. Üks on HTML-is endas käitlejate (atribuudid nagu onclick) defineerimine , mis on kasulik prototüüpide või lihtsate juhtumite puhul:

<!-- myClickHandler es la función JS que manejará el evento -->
<button onclick='myClickHandler()'>Púlsame</button>
<script>
  function myClickHandler(){
    alert('Hola');
  }
</script>

Teine, puhtam ja skaleeritavam variant on kuulajate registreerimine JavaScriptist. `addEventListener` võimaldab teil tellida kuulajaid käitusajal ja lahutada vaate loogikast.

const btn = document.querySelector('button');
const onClick = (e) => {
  console.log('Destino:', e.target);
};
btn.addEventListener('click', onClick);
// Más tarde, si ya no lo necesitas:
// btn.removeEventListener('click', onClick);

Iga käitleja saab sündmuseobjekti. Sealt leiad meetodid e.type, e.target, e.cancelable ja key, näiteks e.preventDefault() või e.stopPropagation(), et tühistada vaikekäitumine või peatada mull.

Tüüpiline juhtum on sisendi väärtuse jäädvustamine ilma lehte värskendamata: loe muudatuste või sisendi käitleja seest `e.target.value` ja tekst kuvatakse.

Koodinäited Node.js-is ja Pythonis

Node.js rakendab EventEmitter klassi abil võimsat avaldamis-/tellimismustrit. See võimaldab teil määratleda oma ärisündmusi ja neile reageerida.

// Node.js (JavaScript)
const EventEmitter = require('events');
class MiBusEventos extends EventEmitter {}
const bus = new MiBusEventos();

bus.on('saludo', (nombre) => {
  console.log(`¡Hola, ${nombre}!`);
});

// Emitimos el evento con un dato asociado
bus.emit('saludo', 'mundo');

Pythonis, kui töötate töölaua liidestega, muudab tkinter vidinate sündmustega sidumise lihtsaks. Nupu, raami või akna saab seostada hiire ja klaviatuuri toimingutega.

# Python + tkinter
from tkinter import *

def on_key(event):
    print('Tecla:', repr(event.char))

def on_click(event):
    marco.focus_set()
    print('Click en:', event.x, event.y)

root = Tk()
marco = Frame(root, width=120, height=120)
marco.bind('<Key>', on_key)
marco.bind('<Button-1>', on_click)
marco.pack()
root.mainloop()

Kui eelistate Pythoni kohandatud väljastaja põhinäidet (ilma graafilise kasutajaliideseta), saate tellimusi ja teavitusi simuleerida funktsioonide loendite abil :

class Emisor:
    def __init__(self):
        self._subs = {}
    def on(self, evento, fn):
        self._subs.setdefault(evento, []).append(fn)
    def emit(self, evento, *args, **kwargs):
        for fn in self._subs.get(evento, []):
            fn(*args, **kwargs)

emisor = Emisor()
emisor.on('saludo', lambda: print('¡Hola, mundo!'))
emisor.emit('saludo')

Omadused ja meetodid visuaalsetes keskkondades (MIT App Inventor ja sarnased)

Plokipõhised arendustööriistad, näiteks MIT App Inventor, on suurepärane näide sündmuspõhisest paradigmast. Igal komponendil (nupp, silt, pilt) on omadused, sündmused ja meetodid , mida saate visuaalselt manipuleerida.

Omadused kirjeldavad, kuidas komponent "välja näeb" või "käitub": fondi suurus, joondus, värv, nähtavus või tekst. Neid saab määrata disainimisel või muuta käitusajal, et kohandada liidest interaktsioonide või sissetulevate andmete põhjal.

Meetodid on eelnevalt määratletud toimingud, mida komponent oskab teha, näiteks akna liigutamine, väljale fokuseerimine, loendisse üksuse lisamine või teksti kustutamine. Neid ei programmeerita nullist: keskkond pakub need käivitamiseks valmis kujul.

Sellistel platvormidel eristatakse ka automaatseid sündmusi (nt ekraani käivitumine) ja kasutaja käivitatavaid sündmusi (nupu vajutamine, lohistamine, puudutamine, telefoni kallutamine). See eraldamine on kasulik navigeerimise ja oleku korrapäraseks korraldamiseks.

GUI, CLI ja operatsioonisüsteemi roll

Operatsioonisüsteemid saadavad sündmusi rakendusele, millel on sisendfookus. Graafilises kasutajaliideses saab iga aken või vidin oma sündmusi vastu võtta ja hallata rakenduse sündmuste tsükli kaudu.

Isegi käsureaprogrammides on sarnaseid signaale: protsess võib oodata, kuni kasutaja sisestab teksti ja vajutab sisestusklahvi (Enter), et sündmus "sisestus valmis" oleks toimunuks. Peamine erinevus seisneb selles, et CLI-s tajutakse voogu lineaarsena, kuid sündmuste ootamine toimub ikkagi.

Sündmuspõhise programmeerimise tähtrakendused

Interaktiivsed kasutajaliidesed : veebisaidid, lauaarvutid ja mobiilseadmed reageerivad igale žestile koheselt. Kogemus tundub loomulik, sest loogika toimib täpselt siis, kui kasutaja seda nõuab.

Asünkroonne kommunikatsioon : HTTP-serverid, WebSocketid, sõnumijärjekorrad ja mikroteenused kasutavad mudelit sissetulevate päringute töötlemiseks ilma teisi töid blokeerimata.

Reaalajas töötlemine – telemeetria, asjade internet, kauplemine, infrastruktuuri jälgimine ja tööstusjuhtimine – käivitab andurite tuvastatud muutustele kohesed meetmed. Sündmus ise on ideaalne käivitaja reaalsusele reageerimiseks millisekundites.

Eelised ja väljakutsed, mida arvestada

Positiivse poole pealt saavutate interaktiivsuse, tõhususe ja skaleeritavuse : kood töötab ainult vajadusel, põhilõim ei jää kinni ja saate tööd jagada mitme spetsialiseeritud käitleja vahel.

Seevastu keerukus suureneb koos sündmuste, kuulajate ja asünkroonsete voogude arvuga . Ilma selge disainita kannatab hooldatavus ja tekivad probleemid, näiteks korrastamata aheldamine või raskesti testitavad käitlejad.

Head tavad sündmustega töötamiseks

Käitlejate (onSubmit, handleClickCancel) järjepidev nimetamine väldib HTML-i sisemist loogikat ja tsentraliseerib tellimuse addEventListeneri või teie raamistiku sündmuste süsteemi abil.

Lekete vältimine : eemalda kuulajad, kui komponent hävib või DOM-element kaob. Kasuta veebis `removeEventListener` funktsiooni või samaväärseid mehhanisme raamistikes ja natiivsetes graafilistes kasutajaliidestes.

Validate ja limit : Kasuta vormidel funktsiooni e.preventDefault(), kui valideerimine pole veel läbitud, ja funktsiooni e.stopPropagation(), kui sa ei soovi, et sündmus käivituks ka esivanemate puhul.

Eralda sidumine , avaldades domeenisündmused (nt 'order.created') ja lubades teistel moodulitel tellida. See vähendab otseseid sõltuvusi ja lihtsustab rakenduse arendamist.

Esirindest kaugemal: arhitektuur ja mustrid

Sündmustepõhine andmetöötlus ei piirdu ainult esiotsaga. Tagaosas saab kasutada järjekordi (RabbitMQ, Kafka), vahendajaid, sisemisi siine ja pilveteenuseid nagu AWS, et võimaldada mikroteenuste vahelist blokeerimatut ja vastupidavat suhtlust.

Kasulike mustrite hulka kuuluvad sündmuste hankimine (sündmused on tõe allikas), sündmuste kaudu edastatav oleku ülekanne (oleku edastamine sündmuste kaudu) ja väljuv kaust (andmebaasist usaldusväärse avaldamise tagamine). Need kõik tuginevad samale põhimõttele: sündmustele reageerimine.

Sündmuse objekti omadused, mida peaksite meeles pidama

Lisaks väljadele e.type ja e.target on veel mõned väga kasulikud väljad. Hiire sisendiks : clientX/clientY (akna suhtes) ja pageX/pageY (dokumendi suhtes) ning which (vajutatud nupp). Klaviatuuri sisendiks : klahv, kood ja modifikaatorid, näiteks shiftKey, altKey ja ctrlKey.

Ratta puhul defineerivad deltaX ja deltaY nihke ning deltaMode näitab, kas ühikuteks on pikslid, read või lehed. Tõhusalt kombineerituna võimaldavad need luua täpseid ja ligipääsetavaid interaktsioone.

Sündmused, omadused ja meetodid kontekstis

Visuaalse lähenemise kokkuvõtteks: komponendil on omadused (konfiguratsioon), sündmused (mis sellega juhtub) ja meetodid (mida see oskab teha) . See triaad esineb App Inventoris, veebiraamistikes ja natiivsetes SDK-des.

Selle mudeli puhul on loomulik muuta käitusajal omadusi, näiteks fondi suurust või nupu värvi pärast valideerimist. Seo need muudatused sündmustega ja saavutad hõlpsalt reaktiivsed kasutajaliidesed.

HTML ja sündmuste delegeerimine

Kui liides on dünaamiliselt üles ehitatud, võib iga uue elemendi tellimine olla kulukas. Sündmuste delegeerimine kuulab ühist konteinerit ja filtreerib `e.target` järgi , mis lihtsustab oluliselt loendeid või tabeleid, mille read ilmuvad ja kaovad.

document.querySelector('#lista').addEventListener('click', (e) => {
  if (e.target.matches('li.removible')) {
    e.target.remove();
  }
});

Nii haldab üks kuulaja kõiki #list konteineri praeguseid ja tulevasi elemente. Vähem tellimusi, vähem mälu ja väiksem lekete oht.

Kuidas see integreerub võrkude ja reaalajas toimuvaga?

Node.js-is töötavad soklid ja vood juba sündmuste põhjal: „data”, „end”, „error”, „close”... Peate lihtsalt lisama käitlejad ja laskma käituskeskkonnal ülejäänu teha . Brauserites järgivad WebSocket ja EventSource sama põhimõtet.

Asjade interneti puhul on anduritelt saadud mõõtmiste saabumine loomulik päästik. Sündmuste kanal saab normaliseerida, valideerida ja avaldada uuendatud teateid või armatuurlaudu ilma käsitsi sekkumiseta.

Juhendatud õpe ja harjutamine

Kui soovid asja sammu võrra edasi viia, on hea mõte harjutada väikeste projektidega: kuuma valideerimisega vorm, WebSocketsiga vestlus, voogu tarbiv armatuurlaud või sidumistega töölauarakendus. Kordamine erinevates kontekstides tugevdab reflekse ja mustreid.

Teine võimalus on läbida intensiivsed koolitusprogrammid, mis ühendavad põhitõed, arhitektuuri ja juurutamise. Hea mobiilirakenduste või kaasaegse veebiarenduse alglaager annab sulle kurssi sündmuste, asünkroonsuse ja tootmisvalmis liideste loomisega.

Sündmuspõhine tarkvara võimaldab teil luua tarkvara, mis reageerib nii, nagu inimesed ootavad: ilma blokeerimiseta ja õigel hetkel. Teil on nüüd olemas kontseptsioonid (sündmused, saatjad, vastuvõtjad, tsüklid), kõige levinumad tüübid, kuidas sündmusobjekti kasutada, näited Node.js-is ja Python/tkinteris, omaduste ja meetodite roll visuaalses keskkonnas, reaalsed rakendused ja parimad tavad . Selle aluse abil on klõpsust tulemuseni jõudmine hoolika kuulamise, parema haldamise ning süsteemi puhta ja lahtiseotuna hoidmise küsimus.