Tworzenie obiektów w JS

W przerwie między nauką AngularJS (wreszcie zaczęłam, powolutku; ale już widzę, że różnica względem jQuery jest wprost miażdżąca; szok i niedowierzanie ;)), ćwiczeniami w czytaniu cudzego kodu i dokumentacji (trudna sztuka dla początkujących), rozwijaniem BUKI oraz oglądaniem filmów - krótka powtórka z tworzenia obiektów w JavaScripcie. Na tym etapie nigdy dość "wałkowania" podstaw.

Zatem (podaję sposób, przykład oraz informację, co jest prototypem dla nowo tworzonego obiektu) - w JS obiekty można tworzyć przez:

• LITERAŁ

{
  firstName: "Jack",
  lastName: "Nicholson"
}

Tak utworzony obiekt dziedziczy po Object.prototype.

• ZWYKŁĄ FUNKCJĘ (zwracającą literał)

Jest to tzw. funkcja fabrykująca i jednocześnie specjalna odmiana sposobu nr 1.

function getPerson(firstName, lastName) {
  return {
    firstName: firstName,
    lastName: lastName  
  };
}

getPerson("Jack", "Nicholson");

Prototypem tak utworzonego obiektu także jest Object.prototype.

• KONSTRUKTOR

Czyli specjalną funkcję, której nazwę zapisujemy wielką literą (taka konwencja, dla odróżnienia jej od zwykłych funkcji) i w której "przypinamy" właściwości i metody obiektu, używając this, (o którym można by napisać osobny post; tutaj ograniczę się do stwierdzenia, że this to dość specjalny twór w JS, powiązany z kontekstem funkcji).

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

new Person("Jack", "Nicholson");

W tym przypadku prototypem jest - uwaga zmiana - Person.prototype, czyli prototyp konstruktora.

• METODĘ Object.create();

var person = {
  firstName: "Jack",
  lastName: "Nicholson"
}

var myPerson = Object.create(person);

Tutaj prototypem nowo tworzonego obiektu jest person; obiekt myPerson w chwili stworzenia jest pustym obiektem, który dziedziczy po obiekcie person.

Na koniec warto może jeszcze wspomnieć, że w narzędziach developerskich przeglądarki można łatwo sprawdzić prototyp danego obiektu (używając atrybutu __proto__). Przykład poniżej: