From de5c456ebded0e038adbf23db34cc290c8829180 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:49:24 +0100 Subject: unslug pl: move --- .../operators/object_initializer/index.html | 387 +++++++++++++++++++++ 1 file changed, 387 insertions(+) create mode 100644 files/pl/web/javascript/reference/operators/object_initializer/index.html (limited to 'files/pl/web/javascript/reference/operators/object_initializer') diff --git a/files/pl/web/javascript/reference/operators/object_initializer/index.html b/files/pl/web/javascript/reference/operators/object_initializer/index.html new file mode 100644 index 0000000000..4148cc07d1 --- /dev/null +++ b/files/pl/web/javascript/reference/operators/object_initializer/index.html @@ -0,0 +1,387 @@ +--- +title: Inicjalizator obiektu +slug: Web/JavaScript/Referencje/Operatory/Object_initializer +translation_of: Web/JavaScript/Reference/Operators/Object_initializer +--- +
{{JsSidebar("Operators")}}
+ +

Obiekty można tworzyć używając new Object(), Object.create(), bądź wykorzystując notację literałową (notację inicializacyjną). Inicjalizator obiektu to lista zera lub więcej par - nazw właściwości oraz ich wartości - otoczonych nawiasami klamrowymi ({}).

+ +

Składnia

+ +
var o = {};
+var o = { a: "foo", b: 42, c: {} };
+
+var a = "foo", b = 42, c = {};
+var o = { a: a, b: b, c: c };
+
+var o =
+{
+  wlasciwosc: function ([parametry]) {},
+  get wlasciwosc() {},
+  set wlasciwosc(wartosc) {},
+};
+
+ +

Nowe notacje w ECMAScript 2015

+ +

Pamiętaj aby zapoznać się z tabelą kompatybilności. Środowiska nie obsługujące tych notacji będą wyrzucać błędy składni.

+ +
// Skrótowe nazwy właściwości (ES6)
+var a = "foo", b = 42, c = {};
+var o = { a, b, c };
+
+// Skrótowe nazwy metod (ES6)
+var o = {
+  wlasciwosc([parametry]) {},
+  get wlasciwosc() {},
+  set wlasciwosc(wartosc) {},
+  * generator() {}
+};
+
+// Obliczone nazwy właściwości (ES6)
+var nazwa = "foo";
+var o = {
+  [nazwa]: "dzien",
+  ["b" + "ar"]: "dobry",
+};
+ +

Opis

+ +

Inicjalizator obiektu to wyrażenie opisujące inicjalizację obiektu {{jsxref("Object")}}. Obiekty składają się z właściwości używanych do opisywania obiektu. Wartości tych właściwości mogą zawierać {{Glossary("primitive")}} typy danych albo inne obiekty.

+ +

Tworzenie obiektów

+ +

Pusty obiekt możemy stworzyć w taki sposób:

+ +
var obiekt = {};
+ +

Jednak prawdziwą przewagą notacji literałowej jest możliwość tworzenia w szybki sposób obiektów ze zdefiniowanymi od razu właściwościami. Wystarczy wypisać listę kluczy: wartości odzdzielonych dwukropkiem. Poniższy przykład tworzy obiekt osoba z trzema właściwościami: "imie", "wiek" i "wyglad". Ich wartościami jest string "Adam", numer 42 oraz inny obiekt.

+ +
var osoba =
+{
+  imie: "Adam",
+  wiek: 42,
+  wyglad: { wzrost: 179 },
+}
+ +

Dostęp do właściwości

+ +

Kiedy już stworzyłeś obiekt, możesz chcieć zobaczyć lub zmienić jego właściwości. Można zrobić to używając zapisu z kropką lub nawiasami. Zajrzyj do operatorów pamięci po więcej informacji.

+ +
object.imie; // "Adam"
+object["wiek"]; // 42
+
+object.imie = "Ewa";
+
+ +

Definiowanie właściwości

+ +

Nauczyliśmy się już jak zapisywać właściwości używając notacji literałowej. Czasami jednak mamy w kodzie zmienne, które chcielibyśmy dodać do naszego obiektu. Możemy to zrobić w taki sposób:

+ +
var a = "foo",
+    b = 42,
+    c = {};
+
+var o =
+{
+  a: a,
+  b: b,
+  c: c
+};
+ +

Ale ECMAScript 2015 oddaje nam do dyspozycji krótszy zapis, pozwalający uzyskać ten sam efekt:

+ +
var a = "foo",
+    b = 42,
+    c = {};
+
+// Skrótowe nazwy właściwości (ES6)
+var o = { a, b, c };
+ +

Duplikowanie nazw właściwości

+ +

W momencie, gdy użyjemy już istniejącej nazwy właściwości jej wartość nadpisze tę poprzednią.

+ +
var a = {x: 1, x: 2};
+console.log(a); // { x: 2}
+
+ +

W ECMAScript 5 strict mode, duplikowanie nazw właściwości było postrzegane jako {{jsxref("SyntaxError")}}. Zmieniono to jednak po wprowadzeniu obliczanych nazw właściwości. Duplikacja stała się wówczas możliwa podczas wykonywania kodu, dlatego też w ECMAScript 2015 usunięto tę rystrykcję.

+ +
function czyES6UmozliwiaDuplikowanieWlasciwosci()
+{
+  "use strict";
+  try
+  {
+    ({ prop: 1, prop: 2 });
+
+    // Nie wyrzucono błędu, duplikacja dozwolona w strict mode.
+    return true;
+  }
+  catch (e)
+  {
+    // Wyrzucono błąd, duplikacja w strict mode zabroniona.
+    return false;
+  }
+}
+ +

Definicje metod

+ +

Właściwość obiektu może również odnosić się do funkcji albo metody getter lub setter.

+ +
var o = {
+  wlasciwos: function ([parametry]) {},
+  get wlasciwos() {},
+  set wlasciwos(wartosc) {},
+};
+ +

w ECMAScript 2015, mamy dostęp do skróconego zapisu, takiego w którym słowo kluczowe "function" nie jest nam już potrzebne.

+ +
// Shorthand method names (ES6)
+var o = {
+  property([parameters]) {},
+  get property() {},
+  set property(value) {},
+  * generator() {}
+};
+ +

W ECMAScript 2015 możemy również w prostszy sposób zapisać właściwość będącą funkcją generatora:

+ +
var o = {
+  * generator() {
+    ...........
+  }
+};
+ +

W ECMAScript 5 musielibyśmy zapisać to tak (aczkolwiek pamiętaj że w ES5 nie ma generatorów):

+ +
var o = {
+  generator: function *() {
+    ...........
+  }
+};
+ +

Po więcej informacji zajrzyj do definicji metod.

+ +

Obliczone nazwy właściwości

+ +

Od ECMAScript 2015, składnia inicjalizatora obiektu wspiera także obliczone nazwy właściwości. Umożliwia to umieszczenie wyrażenia w nawiasach [], które potem zostanie przeliczone na nazwę właściwości. Działa to na tej samej zasadzie co zapis klamrowy w operatorach pamięci, z którymi zapewne miałeś już styczność. Teraz możemy użwać tej samej składni w notacji literałowej:

+ +
// Obliczone nazwy właściwości (ES6)
+var i = 0;
+var a = {
+  ["foo" + ++i]: i,
+  ["foo" + ++i]: i,
+  ["foo" + ++i]: i
+};
+
+console.log(a.foo1); // 1
+console.log(a.foo2); // 2
+console.log(a.foo3); // 3
+
+var param = 'typ';
+var info = {
+  [param]: 'strona',
+  ["pod" + param.charAt(0).toUpperCase() + param.slice(1)]: 'forum'
+};
+
+console.log(info); // { typ: 'strona', 'podTyp': 'forum' }
+ +

Zmiana prototypu

+ +

Definicja właściwości w formie __proto__: wartosc albo "__proto__": wartosc nie stworzy właściwości z nazwą __proto__. Zamiast tego, jeżeli podana wartość jest obiektem lub typem null, zamieni ona [[Prototype]] tworzonego obiektu na podaną wartość. (Jeżeli wartość nie jest ani obiektem ani typem null prototyp nie zostanie zmieniony.)

+ +
var obj1 = {};
+console.log(Object.getPrototypeOf(obj1) === Object.prototype); // true
+
+var obj2 = { __proto__: null };
+console.log(Object.getPrototypeOf(obj2) === null); // true
+
+var protoObj = {};
+var obj3 = { "__proto__": protoObj };
+console.log(Object.getPrototypeOf(obj3) === protoObj); // true
+
+var obj4 = { __proto__: "not an object or null" };
+console.log(Object.getPrototypeOf(obj4) === Object.prototype); // true
+console.log(!obj4.hasOwnProperty("__proto__")); // true
+
+ +

Podczas notacji literałowej możemy zmienić prototyp tylko raz, kolejne próby będą skutkować błędami składni.

+ +

Jeżeli użyjemy w defninicji nazwy __proto__ bez używania składni z dwukropkiem, nazwa ta będzie się zachowywać jak kazda inna.

+ +
var __proto__ = "wartosc";
+
+var obj1 = { __proto__ };
+console.log(Object.getPrototypeOf(obj1) === Object.prototype); // true
+console.log(obj1.hasOwnProperty("__proto__")); // true
+console.log(obj1.__proto__ === "wartosc"); // true
+
+var obj2 = { __proto__() { return "witaj"; } };
+console.log(obj2.__proto__() === "witaj"); // true
+
+var obj3 = { ["__prot" + "o__"]: 17 };
+console.log(obj3.__proto__ === 17); // true
+
+ +

Notacja literałowa vs JSON

+ +

Notacja literałowa to nie to samo co JavaScript Object Notation (JSON). Pomimo, że wyglądają podobnie, są miedzy nimi poważne różnice:

+ + + +

Specyfikacje

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Początkowa definicja.
{{SpecName('ES5.1', '#sec-11.1.5', 'Object Initializer')}}{{Spec2('ES5.1')}}Dodano metody getter oraz setter.
{{SpecName('ES6', '#sec-object-initializer', 'Object Initializer')}}{{Spec2('ES6')}}Skrócone nazwy właściwości/metod oraz obliczone nazwy właściwości.
{{SpecName('ESDraft', '#sec-object-initializer', 'Object Initializer')}}{{Spec2('ESDraft')}} 
+ +

Kompatybilność z przeglądarkami

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(1.0)}}{{CompatGeckoDesktop("1.0")}}111
Computed property names{{CompatVersionUnknown}}{{CompatGeckoDesktop("34")}}{{CompatNo}}{{CompatNo}}7.1
Shorthand property names{{CompatVersionUnknown}}{{CompatGeckoDesktop("33")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Shorthand method names{{CompatChrome(42.0)}}{{CompatGeckoDesktop("34")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile("1.0")}}111{{CompatChrome(1.0)}}
Computed property names{{CompatNo}}{{CompatVersionUnknown}}{{CompatGeckoMobile("34")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Shorthand property names{{CompatNo}}{{CompatVersionUnknown}}{{CompatGeckoMobile("33")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Shorthand method names{{CompatNo}}{{CompatChrome(42.0)}}{{CompatGeckoMobile("34")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatChrome(42.0)}}
+
+ +

Zobacz również

+ + -- cgit v1.2.3-54-g00ecf