Przejdź do treści

JS / Object - Kurs JavaScript (JS)

W tym rozdziale dowiesz się...

Object

Jak przekształcić wartość prostą (logiczną, liczbę, tekst) na obiekt?

Object()
Object(value)
Parametry:
value - wartość do konwersji
Wartość:
Boolean - skonwertowany obiekt logiczny
Number - skonwertowany obiekt liczbowy
String - skonwertowany obiekt tekstowy
Object - nowa instancja obiektu ogólnego

Jeżeli wartość value wynosi null, undefined albo nie została podana, zwracana jest nowa instancja obiektu ogólnego - czyli to samo, co w przypadku: new Object(). W pozostałych przypadkach następuje konwersja podanej wartości na odpowiedni typ obiektowy.

Przykład:

Object(true);      // new Boolean(true)
Object(1);         // new Number(1)
Object("test");    // new String("test")
Object();          // new Object()
Object(null);      // new Object()
Object(undefined); // new Object()

new Object

Jak utworzyć nowy obiekt?

new Object()
new Object(value)
Parametry:
value - wartość na podstawie której zostanie utworzony obiekt
Wartość:
Boolean - skonwertowany obiekt logiczny
Number - skonwertowany obiekt liczbowy
String - skonwertowany obiekt tekstowy
value - przekazana instancja obiektu wbudowanego

Jeżeli wartość value wynosi null, undefined albo nie została podana, zwracana jest nowa instancja obiektu ogólnego. W przypadku podania wartości logicznej, liczby albo tekstu, nastąpi konwersja podanej wartości na odpowiedni typ obiektowy. Natomiast jeżeli jako wartość value zostanie podany inny obiekt wbudowany, powinien on zostać zwrócony bez tworzenia nowej instancji.

Przykład:

new Object(true);        // new Boolean(true)
new Object(1);           // new Number(1)
new Object("test");      // new String("test")
new Object();            // {}
new Object(null);        // {}
new Object(undefined);   // {}
 
var obj = {};
new Object(obj) === obj; // true
new Object(obj) === {};  // false

getPrototypeOf

W jaki sposób pobrać prototyp podanej instancji obiektu?

(interpretuje: Internet Explorer 9, Firefox 3.5, Opera 12, Chrome)

Object.getPrototypeOf(O)
Parametry:
O - obiekt, którego prototyp ma zostać zwrócony
Wartość:
Object - prototyp obiektu
Wyjątki:
TypeError - wartość O nie jest obiektem

Zwraca prototyp podanego obiektu.

Przykład:

Object.getPrototypeOf({});
Object.getPrototypeOf(true);   // TypeError
Object.getPrototypeOf(1);      // TypeError
Object.getPrototypeOf("test"); // TypeError
Object.getPrototypeOf(null);   // TypeError

getOwnPropertyDescriptor

Jak pobrać deskryptor właściwości podanej instancji obiektu?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome oraz częściowo Internet Explorer 8)

Object.getOwnPropertyDescriptor(O, P)
Parametry:
O - obiekt, którego deskryptor właściwości ma zostać pobrany
String P - nazwa właściwości obiektu O
Wartość:
Object - deskryptor właściwości
Undefined - obiekt nie posiada podanej właściwości
Wyjątki:
TypeError - wartość O nie jest obiektem

Zwraca tzw. deskryptor właściwości, który pozwala sterować dostępem do podanej właściwości obiektu [zobacz: Object.defineProperty]. Nie uwzględnia właściwości przejętych z prototypu, a jedynie bezpośrednio przypisane do obiektu.

Internet Explorer 8 poza trybem Quirks częściowo obsługuję tę funkcję - tylko w przypadku modelu DOM, czyli nie można jej używać dla obiektów stworzonych przez użytkownika. Ponadto nie działają atrybuty deskryptora: enumerable ani configurable.

Przykład:

Object.getOwnPropertyDescriptor({p: 1}, "p"); // {value: 1, writable: true, enumerable: true, configurable: true}
Object.getOwnPropertyDescriptor({}, "p");     // undefined
 
var Cls = function () {
    this.p = 1;
};
Cls.prototype.m = function () {};
var obj = new Cls();
Object.getOwnPropertyDescriptor(obj, "p");    // {value: 1, writable: true, enumerable: true, configurable: true}
Object.getOwnPropertyDescriptor(obj, "m");    // undefined
 
Object.getOwnPropertyDescriptor(true, "p");   // TypeError
Object.getOwnPropertyDescriptor(1, "p");      // TypeError
Object.getOwnPropertyDescriptor("test", "p"); // TypeError
Object.getOwnPropertyDescriptor(null, "p");   // TypeError

getOwnPropertyNames

Jak pobrać listę nazw wszystkich właściwości, które posiada obiekt?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome)

Object.getOwnPropertyNames(O)
Parametry:
O - obiekt, którego właściwości mają zostać pobrane
Wartość:
Array - lista nazw wszystkich właściwości obiektu
Wyjątki:
TypeError - wartość O nie jest obiektem

Zwraca listę nazw wszystkich właściwości obiektu - w tym normalnie niedostępnych w pętli for-in [zobacz: Object.defineProperty - enumerable]. Nie uwzględnia właściwości przejętych z prototypu, a jedynie bezpośrednio przypisane do obiektu.

Przykład:

Object.getOwnPropertyNames({p: 1}); // ["p"]
Object.getOwnPropertyNames({});     // []
 
var obj = {};
Object.defineProperty(obj, "p", {enumerable: false});
Object.getOwnPropertyNames(obj);    // ["p"]
 
var Cls = function () {
    this.p = 1;
};
Cls.prototype.m = function () {};
obj = new Cls();
Object.getOwnPropertyNames(obj);    // ["p"]
 
Object.getOwnPropertyNames(true);   // TypeError
Object.getOwnPropertyNames(1);      // TypeError
Object.getOwnPropertyNames("test"); // TypeError
Object.getOwnPropertyNames(null);   // TypeError

create

Jak utworzyć obiekt bazujący na podanym wzorcu, ale bez wywoływania konstruktora?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome)

Object.create(O)
Object.create(O, Properties)
Parametry:
Object O - wzorcowy prototyp obiektu
Object Properties - obiekt zawierający deskryptory dodatkowych właściwości tworzonego obiektu [zobacz: Object.defineProperty]
Wartość:
Object - prototyp nowego obiektu
Wyjątki:
TypeError - wartość O nie jest obiektem ani null

Pozwala utworzyć prototyp nowego obiektu na bazie wzorca. Inaczej niż w przypadku użycia operatora new użycie funkcji Object.create nie wywołuje konstruktora obiektu.

Przykład:

Object.getPrototypeOf(Object.create(null)) === null;      // true
var obj = Object.create(Object.prototype);
Object.getPrototypeOf(obj) === Object.getPrototypeOf({}); // true
Object.create({}, {p: {value: 1}}).p;                     // 1
Object.create(true);                                      // TypeError
Object.create(1);                                         // TypeError
Object.create("test");                                    // TypeError

defineProperty

Jak w języku JavaScript utworzyć zmienną tylko do odczytu?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome oraz częściowo Internet Explorer 8)

Object.defineProperty(O, P, Attributes)
Parametry:
Object O - obiekt
String P - nazwa właściwości
Object Attributes - atrybuty deskryptora właściwości:
  • value - aktualna wartość właściwości (domyślnie: undefined)
  • Boolean writable - czy wartość może zostać zmieniona (domyślnie: false)
  • Function|Undefined get - funkcja która zostanie wywołana w celu pobrania wartości właściwości (domyślnie: undefined)
  • Function|Undefined set - funkcja która zostanie wywołana w celu ustawienia wartości właściwości (domyślnie: undefined)
  • Boolean enumerable - czy właściwość będzie dostępna w pętli for-in (domyślnie: false)
  • Boolean configurable - czy wartość albo deskryptor właściwości mogą zostać zmienione (domyślnie: false)
Wartość:
O - przekazany obiekt
Wyjątki:
TypeError - wartość O nie jest obiektem

Definiuje tzw. deskryptor właściwości, który pozwala sterować dostępem do podanej właściwości obiektu. Dzięki niemu możemy określić, np. aby podana właściwość obiektu nigdy nie mogła zostać zmieniona. Możemy również zdefiniować funkcje, które pozwolą przekształcić wartość właściwości przed jej zapisem lub zwróceniem do/z obiektu.

Zwróć uwagę, że wartość writable, enumerable i configurable domyślnie wynosi false. Dlatego jeśli ich nie podasz przy definiowaniu deskryptora, zostanie utworzona właściwość, której nie będzie można już później zmienić ani odczytać wewnątrz pętli for-in.

Internet Explorer 8 poza trybem Quirks częściowo obsługuję tę funkcję - tylko w przypadku modelu DOM, czyli nie można jej używać dla obiektów stworzonych przez użytkownika. Ponadto nie działają atrybuty deskryptora: enumerable ani configurable.

Przykład:

var obj = {test: 3};
Object.defineProperty(obj, "p", {value: 1});
obj.p = 2;
obj.p;                                             // 1
for (var key in obj) key;                          // "test"
 
Object.defineProperty(obj, "dynamic", {
    get: function () {
        return obj.test * 2;
    },
    set: function (value) {
        obj.test = value < 0 ? NaN : value / 2;
    }
});
obj.dynamic;                                       // 6
obj.dynamic = 4;
obj.test                                           // 2
obj.dynamic = -1;
obj.test;                                          // NaN
 
Object.defineProperty(obj, "p", {writable: true}); // TypeError
Object.defineProperty(true, "p", {});              // TypeError
Object.defineProperty(1, "p", {});                 // TypeError
Object.defineProperty("test", "p", {});            // TypeError
Object.defineProperty(null, "p", {});              // TypeError

defineProperties

Jak za jednym razem skonfigurować właściwości obiektu (np. tylko do odczytu)?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome)

Object.defineProperties(O, Properties)
Parametry:
Object O - obiekt
Object Properties - deskryptory właściwości [zobacz: Object.defineProperty]
Wartość:
O - przekazany obiekt
Wyjątki:
TypeError - wartość O nie jest obiektem

Pozwala zdefiniować z jednym razem wiele deskryptorów właściwości.

Przykład:

var obj = Object.defineProperties({}, {
    test: {value: 3, writable: true, enumerable: true, configurable: true},
    p: {value: 1}
});
obj.p = 2;
obj.p;                                               // 1
for (var key in obj) key;                            // "test"
 
Object.defineProperties(obj, {p: {writable: true}}); // TypeError
Object.defineProperties(true, {});                   // TypeError
Object.defineProperties(1, {});                      // TypeError
Object.defineProperties("test", {});                 // TypeError
Object.defineProperties(null, {});                   // TypeError

seal

Co zrobić, aby opieczętować obiekt w taki sposób, aby jego struktura pozostała niezmienna w programie?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome 6)

Object.seal(O)
Parametry:
Object O - obiekt
Wartość:
O - przekazany obiekt
Wyjątki:
TypeError - wartość O nie jest obiektem

Wywołanie tej funkcji na podanym obiekcie sprawia, że nie będzie można dla niego definiować więcej żadnych deskryptorów właściwości, dodawać żadnych nowych właściwości ani usuwać istniejących. Natomiast będzie można normalnie zmieniać wartości właściwości, które obiekt posiadał już wcześniej. Mówimy, że obiekt został opieczętowany (ang. seal), tzn. jego struktura pozostanie niezmienna.

Przykład:

var obj = Object.defineProperty({p: 1}, "x", {configurable: true});
delete obj.p;
obj.p;                                                 // undefined
obj.test = 3;
 
Object.seal(obj);
obj.test;                                              // 3
obj.test = 2;
obj.test;                                              // 2
delete obj.test;
obj.test;                                              // 2
obj.p = 1;
obj.p;                                                 // undefined
 
Object.defineProperty(obj, "x", {configurable: true}); // TypeError
Object.defineProperty(obj, "p", {});                   // TypeError
Object.seal(true);                                     // TypeError
Object.seal(1);                                        // TypeError
Object.seal("test");                                   // TypeError
Object.seal(null);                                     // TypeError

freeze

Co zrobić, aby zamrozić obiekt w taki sposób, aby nie można go było już zmieniać?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome 6)

Object.freeze(O)
Parametry:
Object O - obiekt
Wartość:
O - przekazany obiekt
Wyjątki:
TypeError - wartość O nie jest obiektem

Wywołanie tej funkcji na podanym obiekcie sprawia, że nie będzie można dla niego definiować więcej żadnych deskryptorów właściwości, dodawać żadnych nowych właściwości, usuwać istniejących właściwości ani zmieniać im wartości. Mówimy, że obiekt został zamrożony (ang. freeze), tzn. jego struktura i dane pozostaną niezmienne.

Przykład:

var obj = Object.defineProperty({p: 1}, "x", {configurable: true});
delete obj.p;
obj.p;                                                 // undefined
obj.test = 3;
 
Object.freeze(obj);
obj.test;                                              // 3
obj.test = 2;
obj.test;                                              // 3
delete obj.test;
obj.test;                                              // 3
obj.p = 1;
obj.p;                                                 // undefined
 
Object.defineProperty(obj, "x", {configurable: true}); // TypeError
Object.defineProperty(obj, "p", {});                   // TypeError
Object.freeze(true);                                   // TypeError
Object.freeze(1);                                      // TypeError
Object.freeze("test");                                 // TypeError
Object.freeze(null);                                   // TypeError

preventExtensions

Co zrobić, aby zablokować możliwość rozszerzania struktury obiektu?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome 6)

Object.freeze(O)
Parametry:
Object O - obiekt
Wartość:
O - przekazany obiekt
Wyjątki:
TypeError - wartość O nie jest obiektem

Wywołanie tej funkcji na podanym obiekcie sprawia, że nie będzie można dla niego definiować więcej żadnych nowych deskryptorów właściwości ani dodawać żadnych nowych właściwości. Natomiast będzie można normalnie zmieniać wartości i deskryptory oraz usuwać właściwości, które obiekt posiadał już wcześniej. Mówimy, że obiekt przestał być rozszerzalny (ang. extensible), tzn. jego struktura nie może się rozszerzyć.

Przykład:

var obj = Object.defineProperty({p: 1}, "x", {value: 2, writable: false, configurable: true});
delete obj.p;
obj.test;                            // undefined
obj.test = 3;
 
Object.preventExtensions(obj);
obj.test;                            // 3
obj.test = 2;
obj.test;                            // 2
delete obj.test;
obj.test;                            // undefined
obj.p = 1;
obj.p;                               // undefined
obj.x = 1;
obj.x;                               // 2
Object.defineProperty(obj, "x", {writable: true});
obj.x = 1;
obj.x;                               // 1
 
Object.defineProperty(obj, "p", {}); // TypeError
Object.preventExtensions(true);      // TypeError
Object.preventExtensions(1);         // TypeError
Object.preventExtensions("test");    // TypeError
Object.preventExtensions(null);      // TypeError

isSealed

Jak sprawdzić, czy obiekt jest opieczętowany, tzn. nierozszerzalny i niekonfigurowalny?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome 6)

Object.isSealed(O)
Parametry:
Object O - obiekt
Wartość:
Boolean - czy obiekt został opieczętowany
Wyjątki:
TypeError - wartość O nie jest obiektem

Sprawdza, czy podany obiekt został opieczętowany, tzn. jest nierozszerzalny, a wszystkie jego właściwości są niekonfigurowalne [zobacz: Object.definePropert - configurable].

Przykład:

Object.isSealed({});                           // false
Object.isSealed(Object.seal({}));              // true
Object.isSealed(Object.freeze({}));            // true
Object.isSealed(Object.preventExtensions({})); // true
var obj = Object.preventExtensions(Object.defineProperty({}, "x", {writable: false, configurable: false}));
Object.isSealed(obj);                          // true
obj = Object.preventExtensions(Object.defineProperty({}, "x", {writable: true, configurable: false}));
Object.isSealed(obj);                          // true
obj = Object.defineProperty({}, "x", {configurable: false});
Object.isSealed(obj);                          // false
obj = Object.preventExtensions(Object.defineProperty({}, "x", {configurable: true}));
Object.isSealed(obj);                          // false
 
Object.isSealed(true);                         // TypeError
Object.isSealed(1);                            // TypeError
Object.isSealed("test");                       // TypeError
Object.isSealed(null);                         // TypeError

isFrozen

Jak sprawdzić, czy obiekt jest zamrożony, tzn. nierozszerzalny, niekonfigurowalny i niezmienny?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome 6)

Object.isFrozen(O)
Parametry:
Object O - obiekt
Wartość:
Boolean - czy obiekt został zamrożony
Wyjątki:
TypeError - wartość O nie jest obiektem

Sprawdza, czy podany obiekt został zamrożony, tzn. jest nierozszerzalny, a wszystkie jego właściwości są niekonfigurowalne i zablokowane przed zapisem [zobacz: Object.definePropert - configurable, writable].

Przykład:

Object.isFrozen({});                           // false
Object.isFrozen(Object.seal({}));              // true
Object.isFrozen(Object.freeze({}));            // true
Object.isFrozen(Object.preventExtensions({})); // true
var obj = Object.preventExtensions(Object.defineProperty({}, "x", {writable: false, configurable: false}));
Object.isFrozen(obj);                          // true
obj = Object.preventExtensions(Object.defineProperty({}, "x", {writable: true, configurable: false}));
Object.isFrozen(obj);                          // false
obj = Object.defineProperty({}, "x", {configurable: false});
Object.isFrozen(obj);                          // false
obj = Object.preventExtensions(Object.defineProperty({}, "x", {configurable: true}));
Object.isFrozen(obj);                          // false
 
Object.isFrozen(true);                         // TypeError
Object.isFrozen(1);                            // TypeError
Object.isFrozen("test");                       // TypeError
Object.isFrozen(null);                         // TypeError

isExtensible

Jak sprawdzić, czy obiekt jest rozszerzalny, tzn. nie można nic nowego do niego dodawać?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome 6)

Object.isExtensible(O)
Parametry:
Object O - obiekt
Wartość:
Boolean - czy obiekt jest rozszerzalny
Wyjątki:
TypeError - wartość O nie jest obiektem

Sprawdza, czy podany obiekt nie został zablokowany przed rozszerzaniem.

Przykład:

Object.isExtensible({});                           // true
Object.isExtensible(Object.seal({}));              // false
Object.isExtensible(Object.freeze({}));            // false
Object.isExtensible(Object.preventExtensions({})); // false
var obj = Object.defineProperty({}, "x", {configurable: false});
Object.isExtensible(obj);                          // true
 
Object.isExtensible(true);                         // TypeError
Object.isExtensible(1);                            // TypeError
Object.isExtensible("test");                       // TypeError
Object.isExtensible(null);                         // TypeError

keys

W jaki sposób pobrać listę nazw wszystkich widocznych właściwości obiektu?

(interpretuje: Internet Explorer 9, Firefox 4, Opera 12, Chrome)

Object.keys(O)
Parametry:
Object O - obiekt
Wartość:
Array - lista nazw właściwości obiektu dostępnych w pętli for-in
Wyjątki:
TypeError - wartość O nie jest obiektem

Zwraca listę nazw właściwości obiektu, które są dostępne w pętli for-in [zobacz: Object.defineProperty - enumerable].

Przykład:

Object.keys({p: 1}); // ["p"]
Object.keys({});     // []
 
var obj = {};
Object.defineProperty(obj, "p", {enumerable: false});
Object.keys(obj);    // []
 
Object.keys(true);   // TypeError
Object.keys(1);      // TypeError
Object.keys("test"); // TypeError
Object.keys(null);   // TypeError
Facebook