diff options
Diffstat (limited to 'files/pl/conflicting/web/javascript/reference/operators')
| -rw-r--r-- | files/pl/conflicting/web/javascript/reference/operators/index.html | 560 | ||||
| -rw-r--r-- | files/pl/conflicting/web/javascript/reference/operators/spread_syntax/index.html | 231 |
2 files changed, 791 insertions, 0 deletions
diff --git a/files/pl/conflicting/web/javascript/reference/operators/index.html b/files/pl/conflicting/web/javascript/reference/operators/index.html new file mode 100644 index 0000000000..06c78ff69e --- /dev/null +++ b/files/pl/conflicting/web/javascript/reference/operators/index.html @@ -0,0 +1,560 @@ +--- +title: Operatory bitowe +slug: conflicting/Web/JavaScript/Reference/Operators +tags: + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators +translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators +original_slug: Web/JavaScript/Referencje/Operatory/Bitwise_Operators +--- +<div>{{jsSidebar("Operators")}}</div> + +<p><strong>Operatory bitowe</strong> traktuję swoje operandy jako sekwencje 32 bitów (zer i jedynek), bardziej niż jako dziesiętne, szesnastkowe czy ósemkowe <a href="pl/docs/Web/JavaScript/Referencje/Obiekty/Number">wartości liczbowe</a>. Przykładowo, reprezentacją binarną dziesiętnej liczby 9 jest 1001. Operatory bitowe dokonują operacji na takich właśnie reprezentacjach bitowych, zwracają jednak standardowe JavaScriptowe wartości liczbowe.</p> + +<div>{{EmbedInteractiveExample("pages/js/expressions-bitwiseoperators.html")}}</div> + + + +<p>Poniższa tabela zawiera podsumowanie operatorów bitowych w języku JavaScript:</p> + +<table class="standard-table"> + <tbody> + <tr> + <th>Operator</th> + <th>Użycie</th> + <th>Opis</th> + </tr> + <tr> + <td><a href="#Bitowe_AND">Bitowe AND</a></td> + <td><code>a & b</code></td> + <td>Zwraca <code>1</code> na każdej pozycji bitowej, dla której odpowiadające jej bity obydwu operandów mają wartość <code>1</code>.</td> + </tr> + <tr> + <td><a href="#Bitowe_OR">Bitowe OR</a></td> + <td><code>a | b</code></td> + <td>Zwraca <code>1</code> na każdej pozycji bitowej, dla której jeden lub oba odpowiadające jej bity operandów mają wartość <code>1</code>.</td> + </tr> + <tr> + <td><a href="#Bitowe_XOR">Bitowe XOR</a></td> + <td><code>a ^ b</code></td> + <td>Zwraca <code>1</code> na każdej pozycji bitowej, dla której dokładnie jeden bit spośród odpowiadających jej bitów operandów ma wartość jeden.</td> + </tr> + <tr> + <td><a href="#Bitowe_NOT">Bitowe NOT</a></td> + <td><code>~ a</code></td> + <td>Neguje bity swojego operandu.</td> + </tr> + <tr> + <td><a href="#Przesuniecie_w_lewo">Przesunięcie w lewo</a></td> + <td><code>a << b</code></td> + <td>Przesuwa <code>a</code> w binarnej reprezentacji o <code>b</code> bitów w lewo (gdzie <code>b</code> < 32), dodając zera z prawej strony.</td> + </tr> + <tr> + <td><a href="#Przesuniecie_w_prawo_z_propagacja_znaku">Przesunięcie w prawo z propagacją znaku</a></td> + <td><code>a >> b</code></td> + <td>Przesuwa <code>a</code> w binarnej reprezentacji o <code>b</code> bitów w prawo (gdzie <code>b</code> < 32), odrzucając <code>b</code> bitów z prawej strony.</td> + </tr> + <tr> + <td><a href="#Przesuniecie_w_prawo_z_dopelnieniem_zerami">Przesunięcie w prawo z dopełnieniem zerami</a></td> + <td><code>a >>> b</code> </td> + <td>Przesuwa <code>a</code> w binarnej reprezentacji o <code>b</code> bitów w prawo (gdzie <code>b</code> < 32), odrzucając <code>b</code> bitów z prawej strony i uzupełniając sekwencję zerami z lewej strony.</td> + </tr> + </tbody> +</table> + +<h2 id="32-bitowe_wartości_całkowite_ze_znakiem">32-bitowe wartości całkowite ze znakiem</h2> + +<p>Operandy wszystkich operatorów bitowych są konwertowane do 32-bitowych wartości całkowitych w dwójkowym <a href="https://en.wikipedia.org/wiki/Method_of_complements">kodzie uzupełnieniowym</a>, z wyjątkiem przesunięcia w prawo z dopełnieniem zerami, które zwraca 32-bitową wartość całkowitą bez znaku. Dwójkowy kod uzupełnieniowy oznacza, że liczba przeciwna danej wartości (na przykład 5 i -5) ma wszystkie bity zanegowane w stosunku do tejże wartości (bitowe NOT liczby, znane również jako jedynkowe dopełnienie liczby) plus jeden. Przykładowo, dziesiętna liczba 314 ma następującą postać dwójkową:</p> + +<pre class="brush: js">00000000000000000000000100111010 +</pre> + +<p>Reprezentacja binarna <code>~314</code>, czyli jedynkowe dopełnienie <code>314</code>:</p> + +<pre class="brush: js">11111111111111111111111011000101 +</pre> + +<p><code>-314</code> ma ostatecznie następującą postać, będącą dwójkowym dopełnieniem <code>314</code>:</p> + +<pre class="brush: js">11111111111111111111111011000110 +</pre> + +<p>Dopełnienie dwójkowe gwarantuje, że skrajny lewy bit będzie zerem dla liczby dodatniej i jedynką dla liczby ujemnej – bit ten zwany jest stąd <em>bitem znaku</em>.</p> + +<p>Liczba <code>0</code> jest wartością całkowitą, złożoną w całości z bitów o wartości <code>0</code>.</p> + +<pre class="brush: js">0 (base 10) = 00000000000000000000000000000000 (base 2) +</pre> + +<p>Liczba <code>-1</code> jest wartością całkowitą, złożoną z samych bitów o wartości <code>1</code>.</p> + +<pre class="brush: js">-1 (base 10) = 11111111111111111111111111111111 (base 2) +</pre> + +<p>Liczba <code>-2147483648</code> (reprezentacja szesnastkowa: <code>-0x80000000</code>) jest wartością całkowitą, złożoną z samych bitów o wartości <code>0</code>, z wyjątkiem pierwszego (znajdującego się najbardziej z lewej strony) bitu.</p> + +<pre class="brush: js">-2147483648 (base 10) = 10000000000000000000000000000000 (base 2) +</pre> + +<p>Liczba <code>2147483647</code> (rprezentacja szesnastkowa: <code>0x7fffffff</code>) jest wartością całkowitą, złożoną jedynie z bitów o wartości 1, z wyjątkiem pierwszego (skrajnie lewego) bitu.</p> + +<pre class="brush: js">2147483647 (base 10) = 01111111111111111111111111111111 (base 2) +</pre> + +<p>Liczby <code>-2147483648</code> i <code>2147483647</code> stanowią odpowiednio minimalną i maksymalną wartość całkowitą, którą można zapisać przy użyciu 32-bitowej liczby ze znakiem.</p> + +<h2 id="Bitowe_operatory_logiczne">Bitowe operatory logiczne</h2> + +<p>Idea działania bitowych operatorów logicznych jest następująca:</p> + +<ul> + <li>Operandy są konwertowane do 32-bitowych wartości całkowitych, wyrażanych jako sekwencja bitów (zer i jedynek). Dla liczb o więcej niż 32 bitach odrzuca się najbardziej znaczące bity. Przykładowo, następująca wartość całkowita zajmująca więcej niż 32 bity będzie przekonwertowana do 32-bitowej wartości w następujący sposób: + <pre class="brush: js">Przed: 11100110111110100000000000000110000000000001 +Po: 10100000000000000110000000000001</pre> + </li> + <li>Każdy z bitów pierwszego operandu parowany jest z odpowiadającym mu bitem drugiego operandu: pierwszy z pierwszym, drugi z drugim i tak dalej (idąc od prawej strony).</li> + <li>Operator jest stosowany na każdej parze bitów, a wynik jest tworzony bitowo.</li> +</ul> + +<h3 id="Bitowe_AND_2"><a id="Bitowe_AND" name="Bitowe_AND">& (Bitowe AND)</a></h3> + +<p>Stosuje operację AND (koniunkcję) na każdej parze bitów. <code>a</code> AND <code>b</code> daje <code>1</code> wtedy i tylko wtedy, gdy zarówno <code>a</code>, jak i <code>b</code> będą miały wartość <code>1</code>. Tablica prawdy dla operacji AND przedstawiona jest poniżej:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">a</td> + <td class="header">b</td> + <td class="header">a AND b</td> + </tr> + <tr> + <td>0</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + <td>0</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>1</td> + </tr> + </tbody> +</table> + +<pre class="brush: js">. 9 (base 10) = 00000000000000000000000000001001 (base 2) + 14 (base 10) = 00000000000000000000000000001110 (base 2) + -------------------------------- +14 & 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10) +</pre> + +<p>Bitowa koniunkcja (AND) dowolnej wartości <code>x</code> i <code>0</code> zawsze daje <code>0</code>.</p> + +<h3 id="Bitowe_OR_2"><a id="Bitowe_OR" name="Bitowe_OR">| (Bitowe OR)</a></h3> + +<p>Stosuje operację OR (alternatywę) na każdej parze bitów. <code>a</code> OR <code>b</code> daje <code>1</code> wtedy i tylko wtedy, gdy <code>a</code> lub <code>b</code> ma wartość <code>1</code>. Tablica prawdy dla operacji OR przedstawina jest poniżej:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">a</td> + <td class="header">b</td> + <td class="header">a OR b</td> + </tr> + <tr> + <td>0</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>1</td> + </tr> + </tbody> +</table> + +<pre class="brush: js">. 9 (base 10) = 00000000000000000000000000001001 (base 2) + 14 (base 10) = 00000000000000000000000000001110 (base 2) + -------------------------------- +14 | 9 (base 10) = 00000000000000000000000000001111 (base 2) = 15 (base 10) +</pre> + +<p>Zastosowanie alternatywy bitowej (OR) dowlonej wartości <code>x</code> i <code>0</code> zawsze daje <code>x</code>.</p> + +<h3 id="Bitowe_XOR_2"><a id="Bitowe_XOR" name="Bitowe_XOR">^ (Bitowe XOR)</a></h3> + +<p>Stosuje bitowe XOR (alternatywę wykluczającą) na każdej parze bitów. <code>a</code> XOR <code>b</code> daje <code>1</code> wtedy i tylko wtedy, gdy <code>a</code> i<strong> </strong><code>b</code> mają różne wartości. Tablica prawdy dla operacji XOR przedstawiona jest poniżej:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">a</td> + <td class="header">b</td> + <td class="header">a XOR b</td> + </tr> + <tr> + <td>0</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>0</td> + </tr> + </tbody> +</table> + +<pre class="brush: js">. 9 (base 10) = 00000000000000000000000000001001 (base 2) + 14 (base 10) = 00000000000000000000000000001110 (base 2) + -------------------------------- +14 ^ 9 (base 10) = 00000000000000000000000000000111 (base 2) = 7 (base 10) +</pre> + +<p>Zastosowanie bitowej alternatywy wykluczającej (XOR) dowolnej wartości <code>x</code> i <code>0</code> daje <code>x</code>.</p> + +<h3 id="Bitowe_NOT_2"><a id="Bitowe_NOT" name="Bitowe_NOT">~ (Bitowe NOT)</a></h3> + +<p>Stosuje operator NOT (negację) na każdym bicie. NOT <code>a</code> zwraca odwróconą wartość (inaczej zwaną dopełnieniem jedynkowym) <code>a</code>. Tablica prawdy operacji NOT przedstawiona jest poniżej:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">a</td> + <td class="header">NOT a</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + </tr> + </tbody> +</table> + +<pre class="brush: js"> 9 (base 10) = 00000000000000000000000000001001 (base 2) + -------------------------------- +~9 (base 10) = 11111111111111111111111111110110 (base 2) = -10 (base 10) +</pre> + +<p>Bitowa negacja (NOT) dowolnej wartości <code>x</code> daje <code>-(x + 1)</code>. Przykładowo, <code>~-5</code> daje <code>4</code>.</p> + +<p>Zauważmy, że z powodu używania 32-bitowej reprezentacji liczb, zarówno <code>~-1</code>, jak i <code>~4294967295</code> (2<sup>32</sup>-1) daje wynik <code>0</code>.</p> + +<h2 id="Bitowe_operatory_przesunięcia">Bitowe operatory przesunięcia</h2> + +<p>Bitowe operatory przesunięcia przyjmują dwa operandy: pierwszy jest wartością do przesunięcia, a drugi wskazuje liczbę pozycji bitowych, o którą pierszy operand ma być przesunięty. Kierunek operacji przesunięcia jest zdefiniowany przez użycie danego operatora.</p> + +<p>Operatory przesunięcia konwertują swoje operandy do 32-bitowych wartości całkowitych w porządku big-endian (znanym też pod nazwą <em>grubokońcowość</em>) i zwraca wynik tego samego typu, co lewy operand. Użytych będzie przy tym jedynie pięć najniższych bitów prawego operandu.</p> + +<h3 id="<<_Przesunięcie_w_lewo"><a id="Przesuniecie_w_lewo" name="Przesuniecie_w_lewo"><< (Przesunięcie w lewo)</a></h3> + +<p>Operator ten przesuwa pierwszy operand o określoną liczbę bitów w lewo. Nadmiarowe bity przesunięte poza zakres z lewej strony są odrzucane. Z prawej strony sekwencja uzupełniana jest zerami.</p> + +<p>Przykładowo, <code>9 << 2</code> daje 36:</p> + +<pre class="brush: js">. 9 (base 10): 00000000000000000000000000001001 (base 2) + -------------------------------- +9 << 2 (base 10): 00000000000000000000000000100100 (base 2) = 36 (base 10) +</pre> + +<p>Bitowe przesuwanie dowolnej wartości <code>x</code> w lewo o <code>y</code> bitów daje <code>x * 2 ** y</code>.<br> + Tak więc, przykładowo: <code>9 << 3</code> można przetłumaczyć jako: <code>9 * (2 ** 3) = 9 * (8) =</code><code> 72</code>.</p> + +<h3 id=">>_Przesunięcie_w_prawo_z_propagacją_znaku"><a id="Przesuniecie_w_prawo_z_propagacja_znaku" name="Przesuniecie_w_prawo_z_propagacja_znaku">>> (Przesunięcie w prawo z propagacją znaku)</a></h3> + +<p>Operator ten przesuwa pierwszy operand o określoną liczbę bitów w prawo. Nadmiarowe bity przesunięte z prawej strony poza zakres są odrzucane. Sekwencja jest uzupełniana z lewej strony wartościami skrajnie lewego bitu. Kiedy skrajnie lewy bit ma taką samą wartość, jak poprzedni skrajnie lewy bit, znak się nie zmienia – stąd nazwa „z propagacją znaku”.</p> + +<p>Przykładowo, <code>9 >> 2</code> daje 2:</p> + +<pre class="brush: js">. 9 (base 10): 00000000000000000000000000001001 (base 2) + -------------------------------- +9 >> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10) +</pre> + +<p>Podobnie, <code>-9 >> 2</code> daje <code>-3</code>, ponieważ zachowywany jest znak:</p> + +<pre class="brush: js">. -9 (base 10): 11111111111111111111111111110111 (base 2) + -------------------------------- +-9 >> 2 (base 10): 11111111111111111111111111111101 (base 2) = -3 (base 10) +</pre> + +<h3 id=">>>_Przesunięcie_w_prawo_z_dopełnieniem_zerami"><a id="Przesuniecie_w_prawo_z_dopelnieniem_zerami" name="Przesuniecie_w_prawo_z_dopelnieniem_zerami">>>> (Przesunięcie w prawo z dopełnieniem zerami)</a></h3> + +<p>Operator ten przesuwa pierwszy operand o określoną liczbę bitów w prawo. Nadmiarowe bity przesunięte poza zakres z prawej strony są odrzucane. Sekwencja jest uzupełniana z lewej strony zerami. Bit znaku staje się zerem, dlatego też wynik jest zawsze nieujemny. W przeciwieństwie do pozostałych operatorów bitowych, przesunięcie w prawo z dopełnieniem zerami zwraca 32-bitową wartość całkowitą bez znaku.</p> + +<p>Dla liczb nieujemnych, przesunięcie w prawo z zerami i z zachowaniem znaku dają taki sam wynik. Przykładowo, <code>9 >>> 2</code> daje 2, tak samo jak <code>9 >> 2</code>:</p> + +<pre class="brush: js">. 9 (base 10): 00000000000000000000000000001001 (base 2) + -------------------------------- +9 >>> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10) +</pre> + +<p>Inaczej wygląda to jednak w przypadku liczb ujemnych. Przykładowo, <code>-9 >>> 2</code> daje 1073741821, co jest różne od <code>-9 >> 2</code> (które daje <code>-3</code>):</p> + +<pre class="brush: js">. -9 (base 10): 11111111111111111111111111110111 (base 2) + -------------------------------- +-9 >>> 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741821 (base 10) +</pre> + +<h2 id="Przykłady">Przykłady</h2> + +<h3 id="Flagi_i_maski_bitowe">Flagi i maski bitowe</h3> + +<p>Bitowe operatory logiczne są często używane do tworzenia, manipulowania i odczytywania sekwencji <em>flag</em>, które działają jak zmienne binarne. Zmienne mogą być używane zamiast tych sekwencji, ale flagi zajmują znacznie mniej pamięci (32-krotnie).</p> + +<p>Załóżmy, że mamy następujące 4 flagi:</p> + +<ul> + <li>flaga A: mamy problem z mrówkami,</li> + <li>flaga B: mamy nietoperza,</li> + <li>flaga C: mamy kota,</li> + <li>flaga D: mamy kaczkę.</li> +</ul> + +<p>Flagi te są reprezentowane przez sekwencję bitów: DCBA. Kiedy flaga jest <em>ustawiona</em>, odpowiedni bit ma wartość 1. Kiedy flaga jest <em>wyczyszczona</em>, właściwy bit ma wartość 0. Załóżmy, że zmienna <code>flagi</code> ma binarną wartość 0101:</p> + +<pre class="brush: js">var flagi = 5; // binarnie 0101 +</pre> + +<p>Wartość ta wskazuje, że:</p> + +<ul> + <li>flaga A ma wartość „prawda” (mamy problem z mrówkami);</li> + <li>flaga B ma wartość „fałsz” (nie mamy nietoperza);</li> + <li>flaga C ma wartość „prawda” (mamy kota);</li> + <li>flaga D ma wartość „fałsz” (nie mamy kaczki);</li> +</ul> + +<p>Ponieważ operatory bitowe są 32-bitowe, 0101 to faktycznie 00000000000000000000000000000101, ale zera wiodące mogą być pominięte, gdyż nie zawierają żadnej znaczącej informacji.</p> + +<p><em>Maska bitowa</em> jest sekwencją bitów pozwalającą na manipulowanie flagami lub odczytywanie ich wartości. Zazwyczaj „podstawowe” maski bitowe dla każdej flagi będą zdefiniowane w następujący sposób:</p> + +<pre class="brush: js">var FLAGA_A = 1; // 0001 +var FLAGA_B = 2; // 0010 +var FLAGA_C = 4; // 0100 +var FLAGA_D = 8; // 1000 +</pre> + +<p>Nowe maski bitowe mogą być stworzone przy użyciu operatorów bitowych na tychże podstawowych maskach. Przykładowo, maska 1011 może być stworzona przy użyciu operatora OR na zmiennych FLAGA_A, FLAGA_B i FLAGA_D.</p> + +<pre class="brush: js">var maska = FLAGA_A | FLAGA_B | FLAGA_D; // 0001 | 0010 | 1000 => 1011 +</pre> + +<p>Pojedyncze wartości flag mogą być wyekstrahowane przez użycie operatora AND na fladze i właściwej masce – bit z wartością 1 „ekstrahuje” odpowiednią flagę. Maska bitowa <em>maskuje</em> wszystkie nieistotne flagi przez koniunkcję ich bitów z zerami maski (stąd nazwa „maska”). Przykładowo, maska 0100 może być użyta do sprawdzenia, czy flaga C jest ustawiona:</p> + +<pre class="brush: js">// czy mamy kota +if (flagi & FLAGA_C) { // 0101 & 0100 => 0100 => true + // coś zrób +} +</pre> + +<p>Maska z ustawionymi wieloma flagami działa jak alternatywa logiczna. Przykładowo, poniższe dwie wersje są równoważne:</p> + +<pre class="brush: js">// czy mamy nietoperza lub czy mamy kota +// (0101 & 0010) || (0101 & 0100) => 0000 || 0100 => true +if ((flagi & FLAGA_B) || (flagi & FLAGA_C)) { + // coś zrób +} +</pre> + +<pre class="brush: js">// czy mamy nietoperza lub kota +var maska = FLAGA_B | FLAGA_C; // 0010 | 0100 => 0110 +if (flagi & maska) { // 0101 & 0110 => 0100 => true + // coś zrób +} +</pre> + +<p>Flagi mogą być ustawione przez użycie na nich i masce operacji OR, gdzie każdy z bitów z wartością 1 będzie ustawiał odpowiednią flagę, jeśli nie jest już ustawiona. Przykładowo, maska 1100 może być użyta do ustawienia flag C i D:</p> + +<pre class="brush: js">// tak, możemy mieć kota i kaczkę +var maska = FLAGA_C | FLAGA_D; // 0100 | 1000 => 1100 +flagi |= maska; // 0101 | 1100 => 1101 +</pre> + +<p>Flagi mogą być czyszczone przez użycie operatora AND z maską, gdzie każdy z bitów z wartością 0 będzie czyścił odpowiednią flagę, jeśli nie jest już wyczyszczona. Maska może być stworzona przez użycie operatora NOT na maskach podstawowych. Przykładowo, maska 1010 może być użyta do wyczyszczenia flag A i C:</p> + +<pre class="brush: js">// nieprawdą jest, że mamy problem z mrówkami lub posiadamy kota +var maska = ~(FLAG_A | FLAG_C); // ~0101 => 1010 +flagi &= maska; // 1101 & 1010 => 1000 +</pre> + +<p>Maska może być również stworzona przez wyrażenie <code>~FLAG_A & ~FLAG_C</code> (z praw De Morgana):</p> + +<pre class="brush: js">// nie, nie mamy problemu z mrówkami i nie posiadamy kota +var maska = ~FLAGA_A & ~FLAGA_C; +flagi &= maska; // 1101 & 1010 => 1000 +</pre> + +<p>Flagi mogą być przełączane przez użycie operatora XOR z maską bitową, gdzie każðy bit będzie przełączał odpowiednią flagę. Przykładowo, maska 0110 może być użyta do przełączenia flag B i C:</p> + +<pre class="brush: js">// jeśli nie mieliśmy nietoperza, teraz go mamy, +// a jeśli go mieliśmy – pa, pa, nietoperku! +// tak samo z kotami +var maska = FLAGA_B | FLAGA_C; +flagi = flagi ^ maska; // 1100 ^ 0110 => 1010 +</pre> + +<p>Flagi mogą być odwracane przez operator NOT:</p> + +<pre class="brush: js">// przechodzimy do równoległego wszechświata... +flagi = ~flagi; // ~1010 => 0101 +</pre> + +<h3 id="Conversion_snippets">Conversion snippets</h3> + +<p>Konwersja binarnej zmiennej typu <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">String</a></code> do liczby dziesiętnej typu <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number">Number</a></code>:</p> + +<pre class="brush: js">var sBinString = '1011'; +var nMojaLiczba = parseInt(sBinString, 2); +alert(nMojaLiczba); // wypisuje 11, tzn. binarnie 1011 +</pre> + +<p>Konwersja dziesiętnej liczby do binarnego Stringa:</p> + +<pre class="brush: js">var nMojaLiczba = 11; +var sBinString = nMojaLiczba.toString(2); +alert(sBinString); // wypisuje 1011, tzn. dziesiętnie 11 +</pre> + +<h3 id="Automatyczne_tworzenie_masek">Automatyczne tworzenie masek</h3> + +<p>Możesz stworzyć wiele masek ze zbioru wartości typu <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean" title="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean">Boolean</a></code> values, na przykład:</p> + +<pre class="brush: js">function createMask() { + var nMask = 0, nFlag = 0, nLen = arguments.length > 32 ? 32 : arguments.length; + for (nFlag; nFlag < nLen; nMask |= arguments[nFlag] << nFlag++); + return nMask; +} +var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011 +var mask2 = createMask(false, false, true); // 4, i.e.: 0100 +var mask3 = createMask(true); // 1, i.e.: 0001 +// itd. + +alert(mask1); // wypisuje 11, czyli binarnie: 1011 +</pre> + +<h3 id="Algorytm_odwrotny_tablica_zmiennych_boolowskich_z_maski">Algorytm odwrotny: tablica zmiennych boolowskich z maski</h3> + +<p>Jeśli chcesz stworzyć tablicę złożoną ze zmiennych boolowskich, możesz użyć następującego kodu:</p> + +<pre class="brush: js">function arrayFromMask(nMask) { + // nMask musi być pomiędzy -2147483648 a 2147483647 + if (nMask > 0x7fffffff || nMask < -0x80000000) { + throw new TypeError('arrayFromMask - out of range'); + } + for (var nShifted = nMask, aFromMask = []; nShifted; + aFromMask.push(Boolean(nShifted & 1)), nShifted >>>= 1); + return aFromMask; +} + +var array1 = arrayFromMask(11); +var array2 = arrayFromMask(4); +var array3 = arrayFromMask(1); + +alert('[' + array1.join(', ') + ']'); +// wypisuje "[true, true, false, true]", tzn.: 11, tzn.: 1011 +</pre> + +<p>Możesz przetestować obydwa algorytmy naraz:</p> + +<pre class="brush: js">var nTest = 19; // nasza maska +var nResult = createMask.apply(this, arrayFromMask(nTest)); + +alert(nResult); // 19 +</pre> + +<p>Jedynie dla celów dydaktycznych (jako że istnieje metoda <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toString" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number/toString">Number.toString(2)</a></code>), pokażemy jak można zmodyfikować algorytm <code>arrayFromMask</code> tak, by tworzył zmienną <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">String</a></code> zawierającą binarną reprezentację danej liczby, zamiast tablicy zmiennych typu <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean" title="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean">Boolean</a></code>:</p> + +<pre class="brush: js">function createBinaryString(nMask) { + // nMask musi być pomiędzy -2147483648 a 2147483647 + for (var nFlag = 0, nShifted = nMask, sMask = ''; nFlag < 32; + nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1); + return sMask; +} + +var string1 = createBinaryString(11); +var string2 = createBinaryString(4); +var string3 = createBinaryString(1); + +alert(string1); +// wypisuje 00000000000000000000000000001011, i.e. 11 +</pre> + +<h2 id="Specyfikacje">Specyfikacje</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specyfikacja</th> + <th scope="col">Status</th> + <th scope="col">Komentarz</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Definicja początkowa.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-11.7')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Zdefiniowane w kilku sekcjach specyfikacji: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4.8">Bitwise NOT operator</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.7">Bitwise shift operators</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.10">Binary bitwise operators</a></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-bitwise-shift-operators')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Zdefiniowane w kilku sekcjach specyfikacji: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-bitwise-not-operator">Bitwise NOT operator</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-bitwise-shift-operators">Bitwise shift operators</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-binary-bitwise-operators">Binary bitwise operators</a></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-bitwise-shift-operators')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Zdefiniowane w kilku sekcjach specyfikacji: <a href="http://tc39.github.io/ecma262/#sec-bitwise-not-operator">Bitwise NOT operator</a>, <a href="http://tc39.github.io/ecma262/#sec-bitwise-shift-operators">Bitwise shift operators</a>, <a href="http://tc39.github.io/ecma262/#sec-binary-bitwise-operators">Binary bitwise operators</a></td> + </tr> + </tbody> +</table> + +<h2 id="Wsparcie_przeglądarek">Wsparcie przeglądarek</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.operators.bitwise")}}</p> + +<h2 id="Zobacz_też">Zobacz też</h2> + +<ul> + <li><a href="/pl/docs/Web/JavaScript/Referencje/Operatory/Logical_Operators">Operatory logiczne</a></li> +</ul> diff --git a/files/pl/conflicting/web/javascript/reference/operators/spread_syntax/index.html b/files/pl/conflicting/web/javascript/reference/operators/spread_syntax/index.html new file mode 100644 index 0000000000..99eb2d84ce --- /dev/null +++ b/files/pl/conflicting/web/javascript/reference/operators/spread_syntax/index.html @@ -0,0 +1,231 @@ +--- +title: Spread syntax +slug: conflicting/Web/JavaScript/Reference/Operators/Spread_syntax +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Operator Rozwinięcia +translation_of: Web/JavaScript/Reference/Operators/Spread_syntax +translation_of_original: Web/JavaScript/Reference/Operators/Spread_operator +original_slug: Web/JavaScript/Referencje/Operatory/Spread_operator +--- +<div>{{jsSidebar("Operators")}}</div> + +<p>Operator spread umożliwia rozwinięcie wyrażenia. <strong>Składnia rozwinięcia</strong> pozwala na rozwinięcie wyrażenia w miejscach, w których potrzebne jest wiele argumentów (do wywołań funkcji), wiele elementów (do literałów tablicowych) lub wiele zmiennych ().</p> + +<h2 id="Składnia">Składnia</h2> + +<p>Do wywołań funkcji:</p> + +<pre class="brush: js">mojaFunkcja(...iterowalnyObiekt); +</pre> + +<p>Do literałów tablicowych:</p> + +<pre class="brush: js">[...iterowalnyObiekt, 4, 5, 6]</pre> + +<p> </p> + +<p>Do przypisań destrukturyzujących:</p> + +<pre class="brush: js">var [glowa, ...ogon] = [1, 2, 3, 4]</pre> + +<h2 id="Przykłady">Przykłady</h2> + +<h3 id="Lepsze_zastosowanie">Lepsze zastosowanie</h3> + +<p><strong>Przykład:</strong> powszechne jest użycie {{jsxref( "Function.prototype.apply")}} w przypadkach, gdy chcesz użyć tablic jako argumentów funkcji.</p> + +<pre class="brush: js">function mojaFunkcja(x, y, z) { } +var args = [0, 1, 2]; +mojaFunkcja.apply(null, args);</pre> + +<p>Ze składnią rozwinięcia (spread) ES2015 powyższy kod można zapisać jako:</p> + +<pre class="brush: js">function mojaFunkcja(x, y, z) { } +var args = [0, 1, 2]; +mojaFunkcja(...args);</pre> + +<p>Dowolny argument w liście argumentów może użyć składni rozwinięcia i może być użyty wiele razy.</p> + +<pre class="brush: js">function myFunction(v, w, x, y, z) { } +var args = [0, 1]; +myFunction(-1, ...args, 2, ...[3]);</pre> + +<h3 id="Potężniejszy_literał_tablicowy">Potężniejszy literał tablicowy</h3> + +<p><strong>Przykład:</strong> Jeżeli masz tablicę i chcesz utworzyć nową tablicę z tą tablicą jako jej częścią, składnia literału tablicowego nie jest już wystarczająca i należy cofnąć się do programowania imperatywnego, użyć kombinacji <code>push</code>, <code>splice</code>, <code>concat</code>, itp. Z użyciem składni rozwinięcia wygląda to dużo prościej:</p> + +<pre class="brush: js">var czesci = ['ramiona', 'kolana']; +var rymowanka = ['glowa', ...czesci, 'i', 'palce']; // <span class="objectBox objectBox-array"><a class="objectLink "><span class="arrayLeftBracket">[</span></a><span class="objectBox objectBox-string">"glowa"</span><span class="arrayComma">, </span><span class="objectBox objectBox-string">"</span></span>ramiona<span class="objectBox objectBox-array"><span class="objectBox objectBox-string">"</span><span class="arrayComma">, </span><span class="objectBox objectBox-string">"kolana"</span><span class="arrayComma">, </span><span class="objectBox objectBox-string">"i"</span><span class="arrayComma">, </span><span class="objectBox objectBox-string">"palce"</span></span>] +</pre> + +<p>Tak samo jak rozwinięcie może być użyte do list argumentów, <code>...</code> mogą być użyte wszędzie w literale tablicowym, także wiele razy.</p> + +<h3 id="Zastosowanie_z_new">Zastosowanie z new</h3> + +<p><strong>Przykład:</strong> W ES5 nie jest możliwa kompozycja <code>new</code> z <code>apply.</code> (W ES5, <code>apply</code> wykonuje <code>[[Call]]<font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">, a nie </span></font></code><code>[[Construct]].</code>) W ES2015 składnia rozwinięcia wygląda następująco:</p> + +<pre class="brush: js">var daty = czytajDaty(bazaDanych); +var d = new Date(...daty);</pre> + +<h3 id="Kopiowanie_tablicy">Kopiowanie tablicy</h3> + +<pre class="brush: js">var tablica = [1,2,3]; +var tablica2 = [...tablica]; // jak tablica.slice() +tablica2.push(4); // tablica2 staje się [1,2,3,4], tablica pozostaje niezmieniona + +</pre> + +<h3 id="Ulepszone_push">Ulepszone push</h3> + +<p><strong>Przykład:</strong> {{jsxref("Global_Objects/Array/push", "push")}} jest często używany, by dodać tablicę na koniec innej tablicy. W ES5 jest to często osiągane przez:</p> + +<pre class="brush: js">var tablica1 = [0, 1, 2]; +var tablica2 = [3, 4, 5]; +// Dodaj wszystkie elementy z tablica2 do tablica1 +Array.prototype.push.apply(tablica1, tablica2);</pre> + +<p>W ES2015 z rozwinięciem wygląda to następująco:</p> + +<pre class="brush: js">var tablica1 = [0, 1, 2]; +var tablica2 = [3, 4, 5]; +tablica1.push(...tablica2);</pre> + +<h3 id="Użycie_jedynie_dla_obiektów_iterowalnych">Użycie jedynie dla obiektów iterowalnych</h3> + +<pre class="brush: js">var obiekt = {"klucz1":"wartosc1"}; +function mojaFunkcja(x) { + /* ... */ +} +// proba rozwinięcia nieiterowalnego elementu +// spowoduje błąd +mojaFunkcja(...obiekt); +var args = [...obiekt]; +// TypeError: obiekt is not iterable</pre> + +<h2 id="Operator_reszty">Operator reszty</h2> + +<p>Operator reszty, który wygląda dokładnie jak składnia rozwinięcia (spread), jest używany do destrukturyzacji obiektów i tablic. W pewnym stopniu, elementy reszty są przeciwieństwem elementów rozwinięcia: rozwinięcie 'rozbija' tablicę na elementy, natomiast reszta zbiera wiele elementów i 'zwija' je w jeden element.</p> + +<h2 id="Specyfikacje">Specyfikacje</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specyfikacja</th> + <th scope="col">Stan</th> + <th scope="col">Komentasz</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES2015', '#sec-array-initializer')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Zdefiniowany w kilku sekcjach specyfikacji: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-array-initializer">Array Initializer</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-argument-lists">Argument Lists</a></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array-initializer')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Kompatybilność_przeglądarek">Kompatybilność przeglądarek</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Funkcja</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Operacja rozwinięcia w literałach tablicowych</td> + <td>{{CompatChrome("46")}}</td> + <td>{{ CompatGeckoDesktop("16") }}</td> + <td>{{CompatIE("Edge")}}</td> + <td>{{CompatNo}}</td> + <td>7.1</td> + </tr> + <tr> + <td>Operacja rozwinięcia w wywołaniach funkcji</td> + <td>{{CompatChrome("46")}}</td> + <td>{{ CompatGeckoDesktop("27") }}</td> + <td>{{CompatIE("Edge")}}</td> + <td>{{CompatNo}}</td> + <td>7.1</td> + </tr> + <tr> + <td>Operacja rozwinięcia w destrukturyzacji</td> + <td>{{CompatChrome("49")}}</td> + <td>{{ CompatGeckoDesktop("34") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Funkcja</th> + <th>Android</th> + <th>Android Webview</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Operacja rozwinięcia w literałach tablicowych</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome("46")}}</td> + <td>{{ CompatGeckoMobile("16") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + <td>{{CompatChrome("46")}}</td> + </tr> + <tr> + <td>Operacja rozwinięcia w wywołaniach funkcji</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome("46")}}</td> + <td>{{ CompatGeckoMobile("27") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + <td>{{CompatChrome("46")}}</td> + </tr> + <tr> + <td>Operacja rozwinięcia w destrukturyzacji</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{ CompatGeckoDesktop("34") }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Zobacz_też">Zobacz też</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">Parametry reszty</a></li> + <li><a href="http://exploringjs.com/es6/ch_destructuring.html#sec_rest-operator">Operator reszty</a></li> +</ul> |