You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/01-getting-started/1-intro/article.md
+79Lines changed: 79 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,10 +1,18 @@
1
1
# Wprowadzenie do JavaScriptu
2
2
3
+
<<<<<<< HEAD
3
4
Sprawdźmy, czym jest JavaScript, co możemy osiągnąć z jego pomocą i z jakimi innymi technologiami dobrze współpracuje.
5
+
=======
6
+
Let's see what's so special about JavaScript, what we can achieve with it, and what other technologies play well with it.
7
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
4
8
5
9
## Czym jest JavaScript?
6
10
11
+
<<<<<<< HEAD
7
12
*JavaScript* pierwotnie został stworzony z myślą o *"ożywieniu stron internetowych"*.
13
+
=======
14
+
*JavaScript* was initially created to "make web pages alive".
15
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
8
16
9
17
Programy napisane w tym języku nazywamy *skryptami*. Możemy je pisać bezpośrednio w kodzie HTML strony i uruchamiać podczas wczytywania strony.
10
18
@@ -24,26 +32,44 @@ Przeglądarka posiada wbudowany silnik, potocznie nazywany "wirtualną maszyną
24
32
25
33
Poszczególne silniki różnią się "nazwami kodowymi", na przykład:
26
34
35
+
<<<<<<< HEAD
27
36
-[V8](https://pl.wikipedia.org/wiki/V8_(silnik_JavaScript)) -- w Chromie i Operze.
28
37
-[SpiderMonkey](https://pl.wikipedia.org/wiki/SpiderMonkey) -- w Firefoksie.
29
38
- ... istnieją inne nazwy, jak "Trident" lub "Chakra" dla różnych wersji IE, "ChakraCore" dla Microsoft Edge, "Nitro" i "SquirrelFish" dla Safari itd.
30
39
31
40
Warto zapamiętać powyższe nazwy, ponieważ często przewijają się w artykułach programistycznych w Internecie. W tym także będą się pojawiać. Będziemy pisać, na przykład, że "funkcjonalność X jest wspierana przez silnik V8", co oznacza, że najprawdopodobniej zadziała w Chromie i Operze.
41
+
=======
42
+
-[V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome, Opera and Edge.
43
+
-[SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox.
44
+
- ...There are other codenames like "Chakra" for IE, "JavaScriptCore", "Nitro" and "SquirrelFish" for Safari, etc.
45
+
46
+
The terms above are good to remember because they are used in developer articles on the internet. We'll use them too. For instance, if "a feature X is supported by V8", then it probably works in Chrome, Opera and Edge.
47
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
32
48
33
49
```smart header="Jak działają silniki?"
34
50
35
51
Silniki są skomplikowane. Ale ich podstawy są proste.
36
52
53
+
<<<<<<< HEAD
37
54
1. Silnik (wbudowany, jeśli mowa o przeglądarce) odczytuje ("parsuje") kod skryptu.
38
55
2. Następnie konwertuje ("kompiluje") skrypt do kodu maszynowego.
39
56
3. Na koniec kod maszynowy jest uruchamiany i działa dość szybko.
57
+
=======
58
+
1. The engine (embedded if it's a browser) reads ("parses") the script.
59
+
2. Then it converts ("compiles") the script to machine code.
60
+
3. And then the machine code runs, pretty fast.
61
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
40
62
41
63
Silnik stosuje różne optymalizacje na każdym z kroków tego procesu. Co więcej, obserwuje on skompilowany kod podczas działania, analizuje przepływ danych i optymalizuje kod maszynowy, bazując na tej wiedzy.
42
64
```
43
65
44
66
## Co potrafi JavaScript w przeglądarce?
45
67
68
+
<<<<<<< HEAD
46
69
Współczesny JavaScript jest "bezpiecznym" językiem programowania. Nie umożliwia on, na przykład, niskopoziomowego dostępu do pamięci czy procesora, ponieważ został pierwotnie stworzony dla przeglądarek, które tego nie potrzebują.
70
+
=======
71
+
Modern JavaScript is a "safe" programming language. It does not provide low-level access to memory or the CPU, because it was initially created for browsers which do not require it.
72
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
47
73
48
74
Możliwości JavaScriptu w dużej mierze zależą od środowiska, w którym jest uruchamiany. Przykładowo, [Node.js](https://pl.wikipedia.org/wiki/Node.js) dostarcza mechanizmy umożliwiające odczyt/zapis plików, wykonywanie zapytań sieciowych itp.
49
75
@@ -59,14 +85,23 @@ Przeglądarkowy JavaScript może więc:
59
85
60
86
## Czego NIE potrafi Javascript w przeglądarce?
61
87
88
+
<<<<<<< HEAD
62
89
Możliwości przeglądarkowego JavaScriptu są ograniczone ze względu na bezpieczeństwo użytkownika. Celem jest zapobieganie dostępu do prywatnych danych użytkownika przez złośliwe strony.
90
+
=======
91
+
JavaScript's abilities in the browser are limited to protect the user's safety. The aim is to prevent an evil webpage from accessing private information or harming the user's data.
92
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
63
93
64
94
Przykładami takich restrykcji są:
65
95
96
+
<<<<<<< HEAD
66
97
- JavaScript zawarty na stronie nie może odczytywać/zapisywać plików na dysku twardym, kopiować ich ani uruchamiać programów. Nie ma bezpośredniego dostępu do funkcji systemu operacyjnego.
98
+
=======
99
+
- JavaScript on a webpage may not read/write arbitrary files on the hard disk, copy them or execute programs. It has no direct access to OS functions.
100
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
67
101
68
102
Współczesne przeglądarki pozwalają na przetwarzanie plików, jednak dostęp jest ograniczony do sytuacji, w których użytkownik wykona odpowiednie akcje, np. "przeciągnie" plik do okna przeglądarki lub wybierze go poprzez element `<input>`.
69
103
104
+
<<<<<<< HEAD
70
105
Istnieją również sposoby na interakcję z kamerą/mikrofonem lub podobnymi urządzeniami, jednak wymagają one wyraźnego pozwolenia ze strony użytkownika. Tak więc strona z włączonym JavaScriptem nie włączy cichaczem kamerki internetowej, nie zeskanuje otoczenia i nie wyśle nagrania do [CBŚ](https://pl.wikipedia.org/wiki/Centralne_Biuro_%C5%9Aledcze_Policji).
71
106
- Poszczególne zakładki/okna przeglądarki zazwyczaj niczego nie wiedzą o sobie nawzajem. Czasem jednak mają do siebie dostęp, np. jeśli jedno okno otworzy drugie przy pomocy skryptu. Jednak nawet wtedy skrypt z jednej strony nie będzie miał dostępu do innego, jeśli pochodzi on z innej strony (ma inną domenę, protokół czy port).
72
107
@@ -78,43 +113,87 @@ Przykładami takich restrykcji są:
78
113

79
114
80
115
Powyższe ograniczenia nie istnieją dla kodu JavaScript uruchamianego poza przeglądarką, na przykład na serwerze. Ponadto, współczesne przeglądarki umożliwiają wtyczkom uzyskiwanie rozszerzonych uprawnień.
116
+
=======
117
+
There are ways to interact with the camera/microphone and other devices, but they require a user's explicit permission. So a JavaScript-enabled page may not sneakily enable a web-camera, observe the surroundings and send the information to the [NSA](https://en.wikipedia.org/wiki/National_Security_Agency).
118
+
- Different tabs/windows generally do not know about each other. Sometimes they do, for example when one window uses JavaScript to open the other one. But even in this case, JavaScript from one page may not access the other page if they come from different sites (from a different domain, protocol or port).
119
+
120
+
This is called the "Same Origin Policy". To work around that, *both pages* must agree for data exchange and must contain special JavaScript code that handles it. We'll cover that in the tutorial.
121
+
122
+
This limitation is, again, for the user's safety. A page from `http://anysite.com` which a user has opened must not be able to access another browser tab with the URL `http://gmail.com`, for example, and steal information from there.
123
+
- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is severely limited. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation.
124
+
125
+

126
+
127
+
Such limitations do not exist if JavaScript is used outside of the browser, for example on a server. Modern browsers also allow plugins/extensions which may ask for extended permissions.
128
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
81
129
82
130
## Dlaczego JavaScript jest wyjątkowy?
83
131
84
132
Istnieją co najmniej *trzy* powody świetności JavaScriptu:
85
133
86
134
```compare
135
+
<<<<<<< HEAD
87
136
+ Pełna integracja z HTML-em i CSS-em.
88
137
+ Proste rzeczy można zrobić w prosty sposób.
89
138
+ Jest wspierany przez większość przeglądarek oraz domyślnie w nich włączony.
139
+
=======
140
+
+ Full integration with HTML/CSS.
141
+
+ Simple things are done simply.
142
+
+ Supported by all major browsers and enabled by default.
143
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
90
144
```
91
145
JavaScript jest jedyną technologią przeglądarkową, która posiada te trzy cechy.
92
146
93
147
To właśnie sprawia, że jest taki unikatowy. To dzięki temu jest najczęstszym narzędziem używanym do tworzenia interfejsów przeglądarkowych.
94
148
149
+
<<<<<<< HEAD
95
150
Nie można jednak zapominać, że JavaScript doskonale nadaje się do tworzenia serwerów czy aplikacji mobilnych.
151
+
=======
152
+
That said, JavaScript can be used to create servers, mobile applications, etc.
153
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
96
154
97
155
## Języki oparte o JavaScript
98
156
99
157
Składnia JavaScriptu nie spełnia wymagań wszystkich osób. Różni ludzie potrzebują różnych funkcjonalności.
100
158
101
159
Nie ma w tym nic dziwnego, w końcu projekty i ich wymagania bywają bardzo różne.
102
160
161
+
<<<<<<< HEAD
103
162
Z tego powodu w ostatnim czasie powstały niezliczone ilości nowych języków, które są *transpilowane* (konwertowane) do JavaScriptu przed uruchomieniem.
163
+
=======
164
+
So, recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser.
165
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
104
166
105
167
Współczesne narzędzia pozwalają na szybką i przejrzystą transpilację, umożliwiając deweloperom na pisanie kodu w innym języku i automatycznie go konwertując do JavaScriptu.
106
168
107
169
Przykłady takich języków:
108
170
171
+
<<<<<<< HEAD
109
172
-[CoffeeScript](http://coffeescript.org/) jest "lukrem składniowym" (ang. *syntactic sugar*) dla JavaScriptu. Wprowadza krótszą składnie, pozwalając na pisanie precyzyjnego i bardziej przejrzystego kodu. Ma zwolenników wśród programistów języka Ruby.
110
173
-[TypeScript](http://www.typescriptlang.org/) skupia się na dodaniu "rygorystycznego typowania danych" w celu ułatwienia dewelopmentu i lepszego wsparcia dla skomplikowanych systemów. Jest rozwijany przez Microsoft.
111
174
-[Flow](http://flow.org/) również dodaje typy, ale w nieco inny sposób. Rozwijany przez Facebooka.
112
175
-[Dart](https://www.dartlang.org/) jest odrębnym językiem, posiadającym własny silnik, który działa poza przeglądarką (np. w aplikacjach mobilnych), ale może być także transpilowany do JavaScriptu. Rozwijany przez Google.
113
176
114
177
Jest ich więcej. Rzecz jasna, nawet jeśli używamy któregoś z języków transpilowanych, powinniśmy znać JavaScript, aby lepiej rozumieć, co się dzieje w kodzie.
178
+
=======
179
+
-[CoffeeScript](https://coffeescript.org/) is "syntactic sugar" for JavaScript. It introduces shorter syntax, allowing us to write clearer and more precise code. Usually, Ruby devs like it.
180
+
-[TypeScript](https://www.typescriptlang.org/) is concentrated on adding "strict data typing" to simplify the development and support of complex systems. It is developed by Microsoft.
181
+
-[Flow](https://flow.org/) also adds data typing, but in a different way. Developed by Facebook.
182
+
-[Dart](https://www.dartlang.org/) is a standalone language that has its own engine that runs in non-browser environments (like mobile apps), but also can be transpiled to JavaScript. Developed by Google.
183
+
-[Brython](https://brython.info/) is a Python transpiler to JavaScript that enables the writing of applications in pure Python without JavaScript.
184
+
-[Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) is a modern, concise and safe programming language that can target the browser or Node.
185
+
186
+
There are more. Of course, even if we use one of these transpiled languages, we should also know JavaScript to really understand what we're doing.
187
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
115
188
116
189
## Podsumowanie
117
190
191
+
<<<<<<< HEAD
118
192
- JavaScript został stworzony jako język tylko dla przeglądarek, jednak obecnie używa się go także w wielu innych środowiskach.
119
193
- Uplasował się na dogodnej pozycji jako najszerzej stosowany język przeglądarkowy o pełnej integrowalności z HTML-em i CSS-em.
120
194
- Istnieje wiele języków "transpilowanych" do JavaScriptu, które dodają konkretne funkcjonalności. Dobrze jest się z nimi zapoznać po nauce JavaScriptu, choćby pobieżnie.
195
+
=======
196
+
- JavaScript was initially created as a browser-only language, but it is now used in many other environments as well.
197
+
- Today, JavaScript has a unique position as the most widely-adopted browser language, fully integrated with HTML/CSS.
198
+
- There are many languages that get "transpiled" to JavaScript and provide certain features. It is recommended to take a look at them, at least briefly, after mastering JavaScript.
Copy file name to clipboardExpand all lines: 1-js/01-getting-started/2-manuals-specifications/article.md
+27Lines changed: 27 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,22 +1,35 @@
1
1
2
2
# Podręczniki i specyfikacje
3
3
4
+
<<<<<<< HEAD
4
5
Ta książka służy jako *samouczek*. Pozwala stopniowo wdrażać się w język. Jednak gdy tylko zapoznasz się z podstawami, nadejdzie czas na zgłębienie wiedzy z innych źródeł.
6
+
=======
7
+
This book is a *tutorial*. It aims to help you gradually learn the language. But once you're familiar with the basics, you'll need other resources.
8
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
5
9
6
10
## Specyfikacja
7
11
8
12
[Specyfikacja ECMA-262](https://www.ecma-international.org/publications/standards/Ecma-262.htm) zawiera najbardziej dogłębne, szczegółowe i formalne informacje o JavaScripcie. Definiuje język.
9
13
10
14
Przez tę całą formalność trudniej jest jednak ją zrozumieć. Dlatego jeśli potrzebujesz najbardziej wiarygodnego źródła informacji o szczegółach dotyczących języka, zajrzenie do specyfikacji jest najlepszym wyjściem. Nie służy ona jednak do codziennego użytku.
11
15
16
+
<<<<<<< HEAD
12
17
Co roku wypuszczana jest nowa wersja specyfikacji. W międzyczasie wszelkie aktualne "szkice" można zobaczyć na <https://tc39.es/ecma262/>.
18
+
=======
19
+
A new specification version is released every year. Between these releases, the latest specification draft is at <https://tc39.es/ecma262/>.
20
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
13
21
14
22
Aby dowiedzieć się czegoś o najświeższych funkcjonalnościach, wliczając w to te, które "są już prawie częścią standardu" (są na tzw. "etapie 3"), przejrzyj listę wniosków na <https://github.com/tc39/proposals>.
15
23
24
+
<<<<<<< HEAD
16
25
Jeśli piszesz kod dla przeglądarek, w [drugiej części](info:browser-environment) samouczka znajdziesz więcej materiałów.
26
+
=======
27
+
Also, if you're developing for the browser, then there are other specifications covered in the [second part](info:browser-environment) of the tutorial.
28
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
17
29
18
30
## Podręczniki
19
31
32
+
<<<<<<< HEAD
20
33
-**Dokumentacja referencyjna JavaScript na MDN (Mozilla)** służy za poradnik z przykładami i innymi informacjami. Świetnie nadaje się do zgłębiania wiedzy na temat poszczególnych funkcjonalności języka, interfejsów itd.
21
34
22
35
Dostępna jest pod adresem <https://developer.mozilla.org/pl/docs/Web/JavaScript/Referencje>.
@@ -27,16 +40,30 @@ Jeśli piszesz kod dla przeglądarek, w [drugiej części](info:browser-environm
27
40
-**MSDN** – podręcznik od Microsoftu zawierający sporo informacji, m.in. o JavaScripcie (często nazywany JScriptem). Jeśli szukasz czegoś konkretnego z tematyki Internet Explorera, lepiej zajrzyj na <http://msdn.microsoft.com/>.
28
41
29
42
Można też przeszukać internet przy użyciu fraz "[pojęcie] MSDN" lub "[pojęcie] MSDN jscript", np. "RegExp MSDN".
43
+
=======
44
+
-**MDN (Mozilla) JavaScript Reference** is the main manual with examples and other information. It's great to get in-depth information about individual language functions, methods etc.
45
+
46
+
You can find it at <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference>.
47
+
48
+
Although, it's often best to use an internet search instead. Just use "MDN [term]" in the query, e.g. <https://google.com/search?q=MDN+parseInt> to search for the `parseInt` function.
49
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
30
50
31
51
## Tabele kompatybilności
32
52
33
53
JavaScript jest językiem intensywnie rozwijanym, dlatego dość często pojawiają się w nim nowe funkcjonalności.
34
54
35
55
Jeśli chcesz dowiedzieć się, jak wygląda wsparcie dla nich w poszczególnych silnikach (przeglądarkowych i innych), odwiedź:
36
56
57
+
<<<<<<< HEAD
37
58
-<http://caniuse.com> - tabela kompatybilności dla każdej z funkcji z osobna. Na przykład, jeśli chcesz sprawdzić, które silniki wspierają funkcje kryptograficzne: <http://caniuse.com/#feat=cryptography>.
38
59
-<https://kangax.github.io/compat-table> - tabela z wypisanymi funkcjonalnościami języka oraz informacjami, które silniki je wspierają, a które nie.
39
60
40
61
Wszystkie z powyższych źródeł są przydatne podczas codziennego dewelopmentu, jako że zawierają cenne informacje o szczegółach języka, wsparcia dla nich itp.
62
+
=======
63
+
-<https://caniuse.com> - per-feature tables of support, e.g. to see which engines support modern cryptography functions: <https://caniuse.com/#feat=cryptography>.
64
+
-<https://kangax.github.io/compat-table> - a table with language features and engines that support those or don't support.
65
+
66
+
All these resources are useful in real-life development, as they contain valuable information about language details, their support, etc.
67
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
41
68
42
69
Pamiętaj o nich (lub o tej stronie) na wypadek potrzeby zasięgnięcia informacji o konkretnej funkcjonalności.
0 commit comments