Emanuel Mares

Tech - Fotografie - Timp liber

Parcursul FEND – Saptamana 7

Desi am mai facut o pauza, raman la numaratoare si deci urmeaza saptamana 7.

Dupa ce am finalizat proiectul trecut, memory-game, am patrus in accesibilitate, peste care am trecut destul de repede, cu cateva exemple si modele.

Apoi am urmat capitolele legate de functii, obiecte, clase si built-ins. Functiile sunt cele mai utilizate obiecte in Javascript. Chiar si clasele sunt functii pana la urma, in spate. Am descoperit in capitolul despre functii, noua metoda in ES6 de a defini functii, prin „arrow functions”:

let fun = (a,b) => return a+b;
let fun = (a,b) => {
  let c = a+b;
  return c
};

let fun = () => "This is an arrow function";

Am intrat in detaliile keywordului „this” si ce forma ia in fiecare parte a unei declaratii.Inca o chestie am aflat ce permite a defini artgumente implicite functiilor cand nu este dat niciunul.

Cum am spus ca, clasele sunt de asemenea functii, vedem cum sa definim o clasa:

function Obj(param){
  this.param = param;
  this.color = #eee;
}

In esenta declaratia unei clase este ca si o functie care nu returneaza nimic si are declaratii de parametrii cu this, care reprezinta in cazul acesta functia clasa Obj. Mai apoi declaram un obiect apartinand clasei Obj cu o simpla invocare a functiei Obj (ex: let object = Obj(param); ). La fel cum am vazut si pana acum, se pot declara si metode pentru o clasa, cu aceeasi tip de functie, care modifica parametrii clasei sau returneaza ceva.

Intram pe urma mai adanc in oop, si aflam cum mostenim metode si proprietati de la alte clase cu prototype. Avem urmatoarele:

const bear = {
  claws: true,
  diet: 'carnivore'
};

Putem face deci o sublcasa ce mosteneste parametrii acesteia:

function PolarBear() { 
  // ...
}
PolarBear.prototype = bear;

Am definit deci o alta functie/clasa derivata din ‘bear’ si am imprumutat prototype-ul sau, parametrii sai, si eventuale metode ce le avea.

Au urmat apoi bult-ins, care mi s-a parut un pic grabite. Simboluri care sunt unice, seturi, maps, promise, proxi-uri si generatoare.

Proiectul?

Pe urma am trecut la urmatorul proiect, ce insemna un mic joc, cu amintire la vechiul frogger, unde un personaj traverseaza niste drumuri pe care circula inamici ce il pot incaleca. Totul a trebuit facut cu oop, cu clase si metode apartinatoare. Ceea ce am facut eu a fost sa adaug in afara jucatorului si a inamicilor, elemente ce se pot colecta pentru mai multe puncte, si obstacole ce ingreuneaza traseului catre victorie.

Ceea ce puteam face mai bine ste sa folosesc mostenirea si sa creez metode comune care sa fie transmise mai apoi. Momentan am realizat cate o clasa separata cu metode separate pentru fiecare entitate. Engine-ul, codul in spatele jocului, care incarca si afisa srite-urile era deja furnizat de ei, trebuia doar sa intelegi cum functioneaza si cum il putem modifica in cazurile noastre.

Ca si bonusuri am adaugat posibilitatea jucatorului sa isi aleaga sprite-ul, cu unul furnizat de udacity.

Gasiti varianta mea de Arcade-Game clone la linkul urmator: https://www.emares.ro/projects/arcade-game/. Gasiti proiectul si pe github de asemenea.

Share