Kuidas luua JavaScripti objekte

Programmeerimiskeeles koodi kirjutades tegeleme kõik objektidega ühel või teisel viisil. JavaScripti objektid pakuvad meile viisi, kuidas andmeid võrgus salvestada, manipuleerida ja saata.

On mitmeid viise, kuidas JavaScripti objektid erinevad teiste peavoolu programmeerimiskeelte (näiteks Java) objektidest. Püüan seda käsitleda mõnes teises teemas. Siinkohal keskendugem vaid erinevatele viisidele, kuidas JavaScript võimaldab meil objekte luua.

Mõelge JavaScriptis objektidest kui „key: value” paaride kogumist. See toob meile esimese ja kõige populaarsema viisi, kuidas me JavaScriptis objekte loome.

Alustame sellega.

1. Objektide loomine objekti sõnasõnalise süntaksiga

See on tõesti lihtne. Kõik, mida peate tegema, on visata võtmeväärtuste paarid, mis on eraldatud ':' -ga lokkis trakside komplekti ({}) sisse ja teie objekt on valmis serveerimiseks (või tarbimiseks), nagu allpool:

const person = { firstName: 'testFirstName', lastName: 'testLastName' };

See on lihtsaim ja populaarseim viis JavaScripti objektide loomiseks.

2. Objektide loomine 'uue' märksõna abil

See objektide loomise meetod sarnaneb objektide loomisega klassipõhistes keeltes, nagu Java. Muide, alates ES6-st on klassid ka JavaScripti algupärased ja vaatame objektide loomist, määratledes klassid selle artikli lõpus. Niisiis, "uue" märksõna abil objekti loomiseks peab teil olema konstruktori funktsioon.

Siin on kaks viisi, kuidas saate kasutada uut märksõnamustrit -

a) "Uue" märksõna koos "sisseehitatud objekti konstruktori funktsiooni kasutamine

Objekti loomiseks kasutage Object()konstruktoriga uut märksõna :

const person = new Object();

Selle objekti omaduste lisamiseks peame tegema midagi sellist:

person.firstName = 'testFirstName'; person.lastName = 'testLastName';

Olete arvanud, et selle meetodi sisestamine on veidi pikem. Samuti pole seda tava soovitatav kasutada, kuna kulisside taga toimub ulatuse eraldusvõime, et leida, kas konstruktori funktsioon on sisseehitatud või kasutaja määratletud.

b) „new” kasutamine koos kasutaja määratud konstruktori funktsiooniga

Konstruktori funktsiooni „Objekt” kasutamise lähenemisviisi teine ​​probleem tuleneb asjaolust, et iga kord, kui loome objekti, peame lisatud objektid käsitsi lisama.

Mis oleks, kui peaksime looma sadu isikuobjekte? Võite seda valu nüüd ette kujutada. Niisiis, et vabaneda objektidele atribuutide käsitsi lisamisest, loome kohandatud (või kasutaja määratud) funktsioonid. Kõigepealt loome konstruktori funktsiooni ja seejärel kasutame objektide saamiseks märksõna "uus":

function Person(fname, lname) { this.firstName = fname; this.lastName = lname; }

Nüüd, kui soovite objekti "Isik", tehke seda lihtsalt:

const personOne = new Person('testFirstNameOne', 'testLastNameOne'); const personTwo = new Person('testFirstNameTwo', 'testLastNameTwo');

3. Uute objektide loomiseks kasutage objekti Object.create ()

See muster on väga mugav, kui meil palutakse luua objekte teistest olemasolevatest objektidest ja mitte otseselt kasutada "uue" märksõna süntaksit. Vaatame, kuidas seda mustrit kasutada. Nagu MDN-is öeldud:

Object.create()Meetod loob uue objekti, kasutades olemasolevat objekti prototüüp vastloodud objekti.

Object.createMeetodi mõistmiseks pidage meeles, et selleks on vaja kahte parameetrit. Esimene parameeter on kohustuslik objekt, mis toimib uue loodava objekti prototüübina. Teine parameeter on valikuline objekt, mis sisaldab uuele objektile lisatavaid omadusi.

Me ei süvene nüüd prototüüpidesse ja pärandiahelatesse, et keskenduda teemale. Kiire punktina võite mõelda prototüüpidest kui objektidest, kust teised objektid saavad vajalikke omadusi / meetodeid laenata.

Kujutage ette, et teil on organisatsioon, mida esindab orgObject

const orgObject = { company: 'ABC Corp' };

Ja soovite luua selle organisatsiooni jaoks töötajaid. On selge, et soovite kõiki töötaja objekte.

const employee = Object.create(orgObject, { name: { value: 'EmployeeOne' } }); console.log(employee); // { company: "ABC Corp" } console.log(employee.name); // "EmployeeOne"

4. Uute objektide loomiseks kasutage objekti Object.assign ()

Mis siis, kui me tahame luua objekti, millel peavad olema omadused rohkem kui ühest objektist? Object.assign()tuleb meile appi.

Nagu MDN-is öeldud:

Meetodit kasutatakse kopeerida väärtused kõigi loetletavat enda omadused ühest või mitmest allikast objektide sihtobjekti. See tagastab sihtobjekti. Object.assign()

Object.assignmeetod võib parameetriteks võtta suvalise arvu objekte. Esimene parameeter on objekt, mille see loob ja tagastab. Ülejäänud talle edastatud objekte kasutatakse omaduste kopeerimiseks uude objekti. Saame sellest aru, laiendades eelmist näidet, mida nägime.

Oletame, et teil on kaks allpool olevat objekti:

const orgObject = { company: 'ABC Corp' } const carObject = { carName: 'Ford' }

Nüüd soovite töötajalt objekti „ABC Corp”, kes juhiks „Fordi” autot. Seda saate teha Object.assignallpool toodud abiga:

const employee = Object.assign({}, orgObject, carObject);

Nüüd saate employeeobjekti, millel on companyja mis carNameon selle vara.

console.log(employee); // { carName: "Ford", company: "ABC Corp" }

5. ES6 klasside kasutamine objektide loomiseks

Märkate, et see meetod sarnaneb kasutaja määratud konstruktori funktsiooniga 'uue' kasutamisega. Konstruktori funktsioonid asendatakse nüüd klassidega, kuna neid toetatakse ES6 spetsifikatsioonide kaudu. Vaatame koodi nüüd.

class Person { constructor(fname, lname) { this.firstName = fname; this.lastName = lname; } } const person = new Person('testFirstName', 'testLastName'); console.log(person.firstName); // testFirstName console.log(person.lastName); // testLastName 

Need on kõik viisid, mida tean JavaScripti objektide loomiseks. Loodan, et teile meeldis see postitus ja nüüd saate aru, kuidas objekte luua.

Täname, et lugesite seda artiklit. Kui teile meeldis see postitus ja see oli teile kasulik, klõpsake palun plaksutamist? oma toetuse näitamiseks. Õppige edasi!