I-JavaScript: dweba ichashazi

Ake sifunde indlela yokudweba iphuzu ku-JavaScript esipheqululini.. akunzima ngokobuchwepheshe, kodwa kuphela kulabo abaphuthazayo, nalabo abangakulungele ukudweba iphuzu ku-intanethi - lokhu kuyimpumelelo yonke.

Ziningi izindlela zokudweba iphuzu, ake sizibheke

Abakhi begeyimu



Kusetshenziswa i-Unity/Godot/microStudio nanoma yiziphi izinkulungwane zabakhi begeyimu.. bonke bazodala ikhodi ethile ngendlela eyodwa noma enye ezoba yi-JavaScript noma i-Webassembly, futhi basasibonise iphuzu.Asinayo intshisekelo kule ndlela.ngeke siqonde ngempela ukuthi kwenzekani, ukulawula ikhodi kuzoba kuncane futhi kungafundeki kukhodi yomthombo, ngaphandle kwalokho kukhulu.

I-JavaScript Frameworks

Le ndlela yeJedi iseduze ngangokunokwenzeka kithi, ngoba.ikhodi yethu ngeke ibe nkulu futhi icace njengosuku, ngeke sikhiphe okuningi, ngeke sikhulise kakhulu ikhodi yethu ngemitapo yolwazi.Ukulawulwa kwekhodi kungaba kuhle nakho

I-JavaScript ehlanzekile

Lokhu kuyindlela yeJedi.Ikhodi iyinkimbinkimbi ngangokunokwenzeka, ukulawula okuphezulu kwezinto, njengokungathi, akudingi ukulawulwa.Amakhodi omthombo mancane kakhulu futhi ngolwazi lwe-JavaScript ye-golimy, singahamba ngokuphepha ukuze sithole umsebenzi, ngoba.siyabadinga abantu abanjalo.

Kodwa umsebenzi wethu awukona ukuthola umsebenzi, kodwa ukudweba ichashazi ngendlela elula nelula.I-vector yethu ijubane nokuvumelana nezimo.

Ngikhethe umtapo wolwazi

p5js ukudweba ichashazi.Akukhona nje ukuthi, yebo, uma umsebenzi bekuwukudweba iphuzu futhi yilokho, vele, yonke into kufanele yenziwe ngeJavaScript engenalutho, kodwa ngikwenza lokhu ngombono, .k.khona-ke mina nawe sizokwenza ezinye izinto ezizobukeka zimangalisa, futhi ngenxa yalokhu sidinga ithuluzi elihle.Enye yazo i-p5js.

Ku-Golim JavaScript, sidinga ukudala ikhanvasi ukuze sichaze imisebenzi yokuqalisa nokudweba kabusha, ku-p5 lokhu kuyenziwa nakho, kodwa kafushane kakhulu.

Kodwa kuqala..

Ukusethwa Kwendawo Okuncane Kokuthuthukiswa kwe-JavaScript

Landa

p5.min.js futhi uyigcine eceleni.

kanje

index.html

    <html>
    <head>
        <script src="p5.min.js"></script>
        <script src="sketch.js"></script>
    </head>
    <body style="margin: 0px;">
        <main>
        </main>
    </body>
    </html>

sketch.js

    function setup() {
    createCanvas(window.innerWidth, window.innerHeight);
    }

    function draw() {
    background(0);
    stroke('white');
    strokeWeight(10);
    point(window.innerWidth/2,window.innerHeight/2);
    }

Njengomphumela, isiphequluli sakho sizovuleka kanje

Yebo, i-HTML iyaqondakala, kodwa hlobo luni lwekhodi ye-JavaScript lena?

umsebenzi wokusetha uwukuqala, wenziwa kanye, kuwo sakha i-canvas, i.e.indawo lapho sizokhipha khona iphuzu.iwindi.innerWidth, iwindi.innerHeight

ububanzi nokuphakama kwesikrini, i.e.sichaza ikhanvasi enesikrini esigcwele futhi yebo, i-HTML inesitayela esibaluleke kakhulu salokhu futhi

<body style="margin: 0px;">

Asidingi ukuqalisa noma yini enye, sidinga nje ukudweba ichashazi.Bheka isimiso lapha. yona, kodwa ngokuzayo izoba yisisekelo sazo zonke izithombe ezinyakazayo.

Ngokuvamile, ikhodi yokudweba iphuzu ilula kakhulu:

point(10,10)

futhi bonke!

Nokho, ikhodi yethu inkulu kancane

  background(0);
  stroke('white');
  strokeWeight(10);
  point(window.innerWidth/2,window.innerHeight/2);

ingemuva elimnyama

inkanyezi emhlophe

ubukhulu bechashazi 10

futhi siyidweba phakathi nendawo eqondile nevundlile.

Hhayi-ke.. sidwebe ichashazi kukhanvasi, yonke into injengoba kufanele ibe njalo, kodwa singayidweba ngisho ku-HTML ehlanzekile ngaphandle kwe-JavaScript.. Kungabukeka kanjani?

Kwenza kube okuyisisekelo futhi kube lula nakakhulu, kodwa izimiso zihluke ngokuphelele, nansi ikhodi yokugcina yokudweba isikwele phakathi nendawo yesikrini.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="background-color: black;">
    <div style="position: fixed; top: 50%; left: 50%; background-color: white; width: 10px; height: 10px;"></div>
</body>
</html>

Umphumela ucishe ufane

Yebo, kulula kakhulu ukudweba okuthile phakathi nendawo ku-HTML, kodwa ukuze ungeze izithombe, futhi ngisho nangokwengeziwe ukuxhumana okuhlakaniphile, kuzodingeka ucabange ngokuvumelana nezimiso ze-CSS.Nakuba kuwumsebenzi othokozisayo impela.Into eyodwa kuphela eyisisekelo ebulala konke lokhu, azikho izinombolo ezingahleliwe ku-CSS, lokhu kuzobulala yonke imizamo yethu esikhathini esizayo, yingakho ngizonikeza ukukhetha okuncane kulokhu.

Uma ngicabanga ukuthi ngifuna ukwenza isibhakabhaka esinezinkanyezi ku-CSS engenalutho, khona-ke konke ngeke kungisebenzele, ngobaizinkanyezi kufanele zivele ezikhundleni ezingahleliwe, futhi uma zinezixhumanisi ezidalwe ngaphambilini, ngeke zibe zinhle kakhulu futhi zingabi lula, ngoba ungabhala i-generator yenombolo engahleliwe ku-CSS, kodwa ikhodi enjalo izobukeka imbi ngokuphelele, ingafundeki futhi inzima qonda!





bg bs ca ceb co cs cy da de el en eo es et fa fi fr fy ga gd gl gu ha haw hi hmn hr ht hu id ig is it iw ja jw ka kk km kn ko ku ky la lb lo lt lv mg mi mk ml mn mr ms mt my ne nl no ny or pa pl ps pt ro ru rw sd si sk sl sm sn so sr st su sv sw ta te tg th tk tl tr tt ug uk ur uz vi xh yi yo zh zu
Text to speech
QR-Code generator
Parsedown cheatsheet. Markdown
Filter data by column with regular expressions
Engines for creating games on LUA ?
JavaScript: draw a point
JavaScript: Speaking text in Chinese