Overføre komplekse datastrukturer
Lær strategier for effektiv overføring av strenger, matriser og egendefinerte objekter mellom WASM og JavaScript.
Overføre komplekse datastrukturer er en gratis leksjon i WebAssembly (WASM) for applikasjoner med høy ytelse på CoddyKit. Dette er leksjon 1 av 4. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i WebAssembly (WASM) for applikasjoner med høy ytelse, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i WebAssembly (WASM) for applikasjoner med høy ytelse inneholder totalt 4 leksjoner.
Komplekse data i WASM
Når du bygger høyytelsesapplikasjoner med WebAssembly (WASM), trenger du ofte å utveksle mer enn bare enkle tall mellom WASM-modulen og JavaScript.
- Hvordan sender du en streng?
- Hva med en tallmatrise?
- Eller kanskje en egendefinert objektstruktur?
Denne leksjonen utforsker strategier for effektiv håndtering av disse komplekse datatypene.
WASM sitt lineære minne
Nøkkelen til å sende komplekse data er å forstå WASM sitt lineære minne. Dette er en sammenhengende minneblokk (som en stor byte-matrise) som deles mellom WASM-modulen og JavaScript-miljøet.
WASM-funksjoner kan bare returnere tall. I stedet for å sende hele dataene sender vi derfor en peker (en minneadresse, som bare er et tall!) til stedet der dataene ligger i dette delte minnet.
Strenger: peker og lengde
Strenger er sekvenser av tegn. Når en streng skal sendes fra WASM til JavaScript, vil WASM-modulen:
- Skrive strengens byteverdier til det lineære minnet.
- Returnere to opplysninger til JavaScript:
- Strengens startadresse i minnet (peker).
- Strengens lengde (hvor mange byte den opptar).
JavaScript bruker deretter disse opplysningene til å lese byteverdiene fra det delte minnet og dekode dem til en JavaScript-streng.
Eksempel på C-streng til JS
Her er en C-funksjon som returnerer en peker til en streng. Når den kompileres med Emscripten, kan JavaScript kalle funksjonen og deretter lese strengen fra WASM-minnet.
EMSCRIPTEN_KEEPALIVE gjør funksjonen kallbar fra JavaScript.
#include <emscripten/emscripten.h>
#include <string.h>
// A static string for demonstration
const char* myString = "Hello WASM!";
EMSCRIPTEN_KEEPALIVE
const char* getGreetingPtr() {
return myString;
}
EMSCRIPTEN_KEEPALIVE
int getGreetingLength() {
return strlen(myString);
}
int main() {
// Required for a complete C program
return 0;
}Matriser: sammenhengende data
Numeriske matriser (som int[] eller float[]) ligner på strenger. De lagres som en sammenhengende blokk med verdier i WASM sitt lineære minne.
For å sende en matrise returnerer WASM:
- En peker til det første elementet i matrisen.
- Antallet elementer i matrisen.
JavaScript leser deretter råbyteverdiene fra det delte minnet, med kjennskap til typen og størrelsen på hvert element (for eksempel 4 byte for et heltall).
Eksempel på C-matrise til JS
Denne C-koden oppretter en matrise, fyller den med verdier og tilbyr funksjoner for å hente pekeren og lengden. JavaScript bruker deretter Module.HEAP32 (for 32-biters heltall) for å få tilgang til elementene.
#include <emscripten/emscripten.h>
#include <stdlib.h> // For malloc
int* dynamicArray = NULL;
int currentArrayLength = 0;
EMSCRIPTEN_KEEPALIVE
int* createAndGetArray(int size) {
if (dynamicArray) {
free(dynamicArray);
}
dynamicArray = (int*)malloc(size * sizeof(int));
currentArrayLength = size;
for (int i = 0; i < size; ++i) {
dynamicArray[i] = i * 10 + 5;
}
return dynamicArray;
}
EMSCRIPTEN_KEEPALIVE
int getArrayLength() {
return currentArrayLength;
}
int main() {
// Required for a complete C program
return 0;
}Egendefinerte objekter (structs)
Det er mer omfattende å sende egendefinerte objekter (som structs i C/C++). Disse objektene er samlinger av ulike datatyper (for eksempel et heltall, et desimaltall og en streng).
Strategien er å plassere objektets felt manuelt i WASM sitt lineære minne. WASM returnerer deretter en peker til starten av denne minneblokken. JavaScript må kjenne det nøyaktige minneoppsettet (forskyvninger og typer for hvert felt) for å kunne lese dataene riktig.
Eksempel på C-struct til JS
Dette C-eksempelet definerer en Person-struct og en funksjon som oppretter en. JavaScript mottar en peker og leser deretter verdier fra bestemte forskyvninger i WASM-minnet, basert på struct-ens oppsett.
id(int) ved forskyvning 0age(int) ved forskyvning 4height(float) ved forskyvning 8
#include <emscripten/emscripten.h>
#include <stdlib.h> // For malloc
#include <string.h> // For strcpy
typedef struct {
int id;
int age;
float height; // assuming 4 bytes after age
char name[16]; // Fixed-size string buffer
} Person;
EMSCRIPTEN_KEEPALIVE
Person* createPerson(int id, int age, float height, const char* name) {
Person* p = (Person*)malloc(sizeof(Person));
p->id = id;
p->age = age;
p->height = height;
strncpy(p->name, name, sizeof(p->name) - 1);
p->name[sizeof(p->name) - 1] = '\0'; // Ensure null termination
return p;
}
int main() {
// Required for a complete C program
return 0;
}JS allokerer WASM-minne
Hva om JavaScript må sende komplekse data inn i WASM? Det kan for eksempel være en stor bildematrise som WASM skal behandle.
JavaScript kan kalle WASM sine eksponerte minneallokeringsfunksjoner (som Emscriptens _malloc) for å reservere plass i WASM sitt lineære minne. Deretter skriver JavaScript dataene til den allokerte plassen og sender pekeren til en WASM-funksjon for behandling.
Rask sjekk
Du har lært hvordan WASM håndterer komplekse data. La oss teste forståelsen din!
Oppsummering: Komplekse data
Gratulerer! De har lært de grunnleggende teknikkene for å overføre komplekse data mellom WebAssembly og JavaScript.
- WASM og JavaScript kommuniserer via et felles lineært minne.
- Komplekse data (strenger, tabeller, strukturer) overføres ved hjelp av pekeren (minneadressen) og ofte lengden eller størrelsen.
- JavaScript leser deretter råbyteverdiene fra det felles minnet og tolker dem basert på den kjente datastrukturen.
- For egendefinerte objekter er det avgjørende å forstå den nøyaktige minneoppsettet.
Disse teknikkene muliggjør effektiv datautveksling med høy ytelse!
Lær deg WebAssembly (WASM) for applikasjoner med høy ytelse med en AI-veileder – gratis
Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.
- Kurs
- 12
- Leksjoner
- 48
Ofte stilte spørsmål
Er leksjonen «Overføre komplekse datastrukturer» gratis?
Ja – hele teksten i «Overføre komplekse datastrukturer» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av WebAssembly (WASM) for applikasjoner med høy ytelse-kurset, kan du oppgradere til CoddyKit PRO. Kurset i WebAssembly (WASM) for applikasjoner med høy ytelse inneholder totalt 4 leksjoner.
Hva lærer jeg i «Overføre komplekse datastrukturer»?
Lær strategier for effektiv overføring av strenger, matriser og egendefinerte objekter mellom WASM og JavaScript. Du øver på WebAssembly (WASM) for applikasjoner med høy ytelse med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.
Trenger jeg erfaring for å begynne med WebAssembly (WASM) for applikasjoner med høy ytelse?
Ingen tidligere erfaring er nødvendig. WebAssembly (WASM) for applikasjoner med høy ytelse på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 1 av 4.
Hvor lang tid tar leksjonen «Overføre komplekse datastrukturer»?
De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.
Kan jeg skrive og kjøre kode i denne WebAssembly (WASM) for applikasjoner med høy ytelse-leksjonen?
Ja. Alle WebAssembly (WASM) for applikasjoner med høy ytelse-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.
Alle leksjonene i dette kurset
- Overføre komplekse datastrukturer
- WASM-minnemodell og -håndtering
- Delt minne og atomiske operasjoner
- Utvikle og håndtere lineært minne