WASM ve DOM
- Go kursu
- Uzman
- Ders 27/34
- 4 dk
js paketiyle DOM'a erişmeyi öğrenirsin.
WASM ve DOM
syscall/js paketi Go'dan JavaScript nesnelerine erişir. js.Global() tarayıcının window nesnesidir:
doc := js.Global().Get("document")
el := doc.Call("getElementById", "sonuc")
el.Set("textContent", "Go'dan merhaba")Go fonksiyonunu JS'ten çağrılabilir yapmak için js.FuncOf kullanılır; program bitmesin diye main sonunda select {} ile beklenir.
js.FuncOf ile olay
Bir butona tıklandığında Go kodu çalıştırmak:
topla := js.FuncOf(func(this js.Value, args []js.Value) any {
return args[0].Int() + args[1].Int()
})
js.Global().Set("goTopla", topla)
// JavaScript: goTopla(2, 3) → 5js.Func artık gerekmediğinde Release() çağrılmalıdır; aksi halde bellekte kalır. Go ile JS arasında her çağrı maliyetlidir; sık geçişlerden kaçınmak gerekir.
Uygulama Geri çağrı imzası
syscall/js yalnızca WASM'da derlendiği için imzayı taklit et: type Deger struct{ n int } ve func topla(args []Deger) any yaz; ilk iki argümanın n değerlerini toplasın. topla([]Deger{{2}, {3}}) sonucunu yazdır.
Başlangıç kodu
package main
import "fmt"
func main() {
// buraya yaz
}Örnek çözüm
package main
import "fmt"
type Deger struct{ n int }
func topla(args []Deger) any {
return args[0].n + args[1].n
}
func main() {
fmt.Println(topla([]Deger{{2}, {3}}))
}Beklenen çıktı
5
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Go WASM programı neden <code>select {}</code> ile biter?
- DOM'u yüklemek için
- main dönerse program biter ve JS'e verilen Go fonksiyonları çalışmaz Doğru cevap
- Performansı artırmak için
- Hata yakalamak için
Açıklama: select {} sonsuza kadar bekler; böylece çalışma zamanı ayakta kalır ve olay geri çağrıları işlenir.
2 JS metodunu çağır
el := js.Global().Get("document").____("getElementById", "kutu")el := js.Global().Get("document").Call("getElementById", "kutu")Açıklama: Call bir JS nesnesinin metodunu verilen argümanlarla çağırır.
3 syscall/js
| Kavram | Anlamı |
|---|---|
js.Global() |
window nesnesi |
Get |
Özellik okur |
Set |
Özellik yazar |
js.FuncOf |
Go fonksiyonunu JS'e açar |