Event-Driven Programming: En komplet guide med eksempler

Informatic Digital » programmering » Event-Driven Programming: En komplet guide med eksempler

Hændelsesdrevet programmering er en udviklingsstil, hvor en applikation reagerer på, hvad der sker omkring den, i stedet for en fast liste af trin. I stedet for at køre direkte fra punkt A til punkt B, venter softwaren på hændelser og reagerer Når nogen klikker, ankommer data, eller systemets tilstand ændrer sig.

Hvis du har en mere sekventiel programmeringsbaggrund, åbner denne tilgang op for en helt ny række muligheder for omfattende grænseflader, tjenester med høj belastning og systemer, der behandler livestreams. Jeg foreslår en komplet gennemgang af koncepter, arkitektur, eventtyper, praktisk kode (JavaScript, Node.js og Python/tkinter) og god praksis. at mestre det med lethed.

Hvad er eventdrevet programmering?

I dette paradigme udløses logik, når "noget" relevant sker: brugerinteraktion, netværksbeskeder, sensorer, timere eller ethvert programmørdefineret signal. Det "noget" kaldes en begivenhed og udløser en eller flere handlere. som indeholder det svar, du vil udføre.

Nøglen er, at begivenheder kan forekomme asynkront, selv parallelt. Programmet lytter via en hændelsesløkke, der indsamler, sætter hændelser i kø og distribuerer dem til sine modtagere., hvilket holder appen responsiv uden at blokere.

Væsentlige begreber: hændelser, sendere, modtagere og loop

En begivenhed er manifestationen af, at noget er sket: klik, dobbeltklik, tastetryk, fuldførelse af en download, ankomst af en netværkspakke, åbning af et vindue osv. Den indeholder normalt data (nyttelast) og en kontekst, der beskriver, hvad der skete, hvilket gør det muligt at træffe beslutninger i handleren.

De komponenter, der genererer hændelser, kaldes emittere; dem, der håndterer dem, kaldes modtagere eller lyttere. Forbindelsen mellem de to etableres via abonnementsmekanismer (lyttere) eller binding som angiver, hvilken funktion der skal udføres for hver type hændelse.

Systemets hjerte er event-loopet. Dette loop indsamler ventende hændelser, sorterer dem og leverer dem til de tilsvarende controllere. Takket være dette mønster kan applikationen reagere på flere stimuli uden at blokere grænsefladen eller spilde ressourcer..

I visuelle og mobile miljøer vil du også skelne mellem brugerinitierede hændelser (klik, træk, tryk, vipning af en enhed) og automatiske hændelser (åbning af en skærm, udløsning af en timer, ændring af fokus). At adskille de to grupper hjælper dig med at designe forudsigelige interaktionsflows..

Sådan fungerer begivenhedens livscyklus

Vi kan opsummere dynamikken i tre sammenhængende trin. Først genereres hændelsen (af person, system, netværk eller hardware); den pågældende begivenhed går ind i en fælles kanal (kø), mens begivenhedsløkken ser på.

For det andet sker der lytning. Modtagere, der abonnerer på den specifikke type begivenhed, registrerer den. (for eksempel en 'klik'-lytter eller en 'data'-handler på en socket) og er klar til at handle.

Endelig udføres håndteringen. En handler behandler eventobjektet, forespørger dets egenskaber (type, destination, værdier) og beslutter, hvad der skal gøres.Opdater brugergrænsefladen, valider, udbred, annuller eller udsend nye kaskaderende begivenheder.

De hyppigste typer af begivenheder

I praksis finder du kendte familier. At kende dens nuancer sparer dig for en masse hovedpine, når det kommer til fejlfinding og instrumentering.:

• Mus eller markør: klik, dblclick, mousedown, mouseup, mouseover, mouseout, mousemove, contextmenu.
• tastatur: tastetryk, tastetryk op, tastetryk (for tegntaster).
• Vindue og dokument: indlæsning, fejl (ved indlæsning af ressourcer), ændring af størrelse, rulning, skjul side/vis side.
• formularer: input, ændring, indsend, fokus ind/fokus ud.
• Hjul/rul: hjul med vandrette og lodrette scrolldata.

Ud over begivenhedsnavnet giver begivenhedsobjektet yderligere oplysninger. I markøren vil du have clientX/pageX og clientY/pageY; på tastaturet vil du markere taster, kode eller modifikatorer (shiftKey, altKey, ctrlKey); i hjul, deltaX, deltaY og deltaMode for at kende enheden.

Lytning og eventhåndtering i praksis

Der er to typiske stier på nettet. Den ene er at definere handlers i selve HTML'en (attributter som onclick), nyttig til prototyper eller simple tilfælde:

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

Den anden, renere og mere skalerbar, er at registrere lyttere fra JavaScript. addEventListener giver dig mulighed for at abonnere under kørsel og afkoble visningen fra logikken.:

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);

Hver handler modtager hændelsesobjektet. Der finder du e.type, e.target, e.cancelable og nøglemetoder som e.preventDefault() eller e.stopPropagation() for at annullere standardadfærden eller stoppe boblen.

Et typisk tilfælde er at registrere værdien af ​​et input uden at opdatere siden: læser e.target.value inde i ændrings- eller inputhåndtereren og du vil have liveteksten.

Kodeeksempler i Node.js og Python

Node.js implementerer et meget kraftfuldt publicer/abonner-mønster med EventEmitter-klassen. På denne måde kan du definere dine egne forretningshændelser og reagere på dem.:

// 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');

I Python, hvis du arbejder med desktop-grænseflader, gør tkinter det nemt at binde widgets til begivenheder. En knap, en ramme eller et vindue kan knyttes til mus- og tastaturhandlinger:

# 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()

Hvis du foretrækker et grundlæggende eksempel på din egen emitter i Python (uden GUI), Du kan simulere abonnement og notifikationer med funktionslister:

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')

Egenskaber og metoder i visuelle miljøer (MIT App Inventor og lignende)

Værktøjer til udvikling af byggesten som MIT App Inventor er et perfekt eksempel på det eventdrevne paradigme. Hver komponent (knap, etiket, billede) har egenskaber, hændelser og metoder som du manipulerer visuelt.

Egenskaber beskriver, hvordan en komponent "ser ud" eller "opfører sig": skriftstørrelse, justering, farve, synlighed eller tekst. De kan have et fast design eller ændres i udførelsen for at tilpasse brugerfladen. baseret på indgående interaktioner eller data.

Metoder er foruddefinerede handlinger, som en komponent ved, hvordan den skal udføre, f.eks. at flytte et vindue, fokusere et felt, tilføje et element til en liste eller rydde tekst. Du programmerer dem ikke fra bunden: miljøet tilbyder dem til dig, klar til at blive aktiveret..

I disse typer platforme vil man også skelne mellem automatiske hændelser (f.eks. når en skærm starter) og dem, der udløses af brugeren (tryk på en knap, træk, tapping, vipning af telefonen). Denne adskillelse er nyttig til at orkestrere navigation og tilstand. på en ordnet måde.

GUI, CLI og operativsystemets rolle

Operativsystemer sender hændelser til den applikation, der har inputfokus. I en GUI kan hvert vindue eller hver widget modtage og håndtere sine egne hændelser. gennem appens hændelsesløkke.

Selv i kommandolinjeprogrammer er der lignende signaler: processen kan vente på, at brugeren skriver og trykker på Enter for at betragte hændelsen "input complete" som værende indtruffet. Hovedforskellen er, at i CLI opfattes flowet som lineært, men der er stadig ventende begivenheder..

Stjerneapplikationer til eventdrevet programmering

Interaktive brugergrænsefladerWeb-, desktop- og mobilenheder reagerer øjeblikkeligt på enhver bevægelse. Oplevelsen er naturlig, fordi logikken udføres præcis, når brugeren anmoder om den.

Asynkron kommunikationHTTP-servere, WebSockets, beskedkøer og mikrotjenester udnytter modellen til at behandle indgående anmodninger uden at blokere andet arbejde.

RealtidsbehandlingTelemetri, IoT, handel, infrastrukturovervågning eller industriel kontrol iværksætter øjeblikkelige handlinger, når ændringer registreres af sensorer. Begivenheden er den perfekte udløser til at reagere på virkeligheden på millisekunder.

Fordele og udfordringer at tage højde for

På den positive side, Du opnår interaktivitet, effektivitet og skalerbarhedKoden kører kun når det er nødvendigt, hovedtråden sidder ikke fast, og du kan fordele arbejdet mellem flere specialiserede handlere.

Til gengæld, Kompleksiteten vokser med antallet af hændelser, lyttere og asynkrone flowsUden et klart design lider vedligeholdelsesvenligheden, og der opstår problemer som uordnet kædedannelse eller vanskelige håndterere.

Gode ​​fremgangsmåder for arbejde med events

Konsekvent navngivet For handlere (onSubmit, handleClickCancel) skal du undgå inline-logik i HTML'en og centralisere abonnementet med addEventListener eller dit frameworks eventsystem.

Forhindrer lækagerFjerner lyttere, når komponenten ødelægges, eller DOM-elementet forsvinder. removeEventListener på nettet eller tilsvarende mekanismer i native frameworks og GUI'er.

Validerer og begrænserBrug e.preventDefault() på formularer, hvis de endnu ikke er blevet valideret, og e.stopPropagation(), når du ikke ønsker, at en hændelse også skal udløses på forfædre.

Afkoble publicering af domænehændelser (f.eks. 'order.created') og lad andre moduler abonnere på dem. Dette reducerer direkte afhængigheder og gør det nemmere at udvikle din app.

Bag fronten: arkitektur og mønstre

Begivenhedsorientering stopper ikke ved grænsefladen. I backend kan du bruge køer (RabbitMQ, Kafka), brokers eller interne busser og cloud-tjenester som AWS at kommunikere mikrotjenester ikke-blokerende og med robusthed.

Nyttige mønstre inkluderer Event sourcing (sandhedens kilde er begivenheder), Overførsel af begivenhedsoverført tilstand (overfør tilstand gennem begivenheder) eller Udbakke (sikre pålidelig publicering fra databasen). De er alle baseret på det samme princip: at reagere på fakta..

Egenskaber for begivenhedsobjekter, du bør huske

Ud over e.type og e.target er der nogle meget nyttige felter. I mus: klientX/klientY (i forhold til vinduet) og sideX/sideY (i forhold til dokumentet), som (knappen trykkes ned). På tastaturet: nøgle, kode og modifikatorer såsom shiftKey, altKey og ctrlKey.

Til hjulet, deltaX og deltaY markerer forskydningen og deltaMode angiver, om enhederne er pixels, linjer eller sider. Når de kombineres godt, giver de dig mulighed for at skabe præcise og tilgængelige interaktioner.

Begivenheder, egenskaber og metoder i kontekst

For at opsummere den visuelle tilgang: en komponent har egenskaber (konfiguration), begivenheder (hvad der sker med den) og metoder (hvad den ved, hvordan den skal gøre)Denne triade vises i App Inventor, webframeworks og native SDK'er.

Ændring af egenskaber under kørsel, for eksempel skriftstørrelsen eller farven på en knap efter validering, er naturligt i denne model. Bind ændringer til begivenheder, så får du nemt reaktive brugergrænseflader..

HTML og begivenhedsdelegering

Når brugergrænsefladen er dynamisk bygget, kan det være dyrt at abonnere på hvert nyt element. Hændelsesdelegering lytter på en fælles container og filtrerer efter e.target, hvilket i høj grad forenkler lister eller tabeller med rækker, der vises og forsvinder.

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

Således administrerer en enkelt lytter alle nuværende og fremtidige elementer i #list-containeren. Færre abonnementer, mindre hukommelse og mindre risiko for lækager.

Hvordan integreres det med netværk og realtid?

I Node.js fungerer sockets og streams allerede baseret på hændelser: 'data', 'end', 'error', 'close'… Bare tilslut handlers, og lad runtime-systemet klare resten.I browsere følger WebSocket og EventSource det samme princip.

For IoT er ankomsten af ​​målinger fra sensorer den naturlige udløser. En hændelsespipeline kan normalisere, validere og udgive opdaterede advarsler eller dashboards. uden manuel indgriben.

Guidet læring og øvelse

Hvis du vil tage tingene et skridt videre, er det en god idé at øve sig med små projekter: en formular med hot validation, en chat med WebSocket, et dashboard, der bruger en stream, eller en desktop-app med bindinger. Gentagelse i forskellige sammenhænge konsoliderer reflekser og mønstre.

En anden mulighed er at træne med intensive programmer, der kombinerer grundlæggende elementer, arkitekturer og implementering. En god bootcamp til mobilapps eller moderne webudvikling vil give dig et indblik i events, asynkroni og grænsefladekomposition. klar til produktion.

Hændelsesdrevet adfærd giver dig mulighed for at bygge software, der reagerer, som folk forventer: ikke-blokerende og præcis til tiden. Nu har du koncepterne (events, emittere, receivere, loop), de mest almindelige typer, brugen af ​​event-objektet, eksempler i Node.js og Python/tkinter, egenskabers og metoders rolle i visuelle miljøer, virkelige applikationer og god praksis.Med disse fundamenter vil det at gå fra klik til resultat handle om at lytte godt, styre bedre og holde systemet rent og afkoblet.