Skip to content

Commit 0135f09

Browse files
committed
merging all conflicts
2 parents c4052cf + 34a80e7 commit 0135f09

File tree

868 files changed

+24346
-12354
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

868 files changed

+24346
-12354
lines changed

.gitattributes

+1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
* text=auto eol=lf
2+
*.svg binary

.github/FUNDING.yml

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
github: iliakan

.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -21,3 +21,4 @@ sftp-config.json
2121
Thumbs.db
2222

2323

24+
/svgs

1-js/01-getting-started/1-intro/article.md

+86
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,32 @@
11
# Introducció a JavaScript
22

3+
<<<<<<< HEAD
34
Vegem què fa de JavaScript un llenguatge tan especial, què podem aconseguir amb ell, i quines altres tecnologies s'hi integren bé.
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+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
48
59
## Què és JavaScript?
610

11+
<<<<<<< HEAD
712
*JavaScript* fou inicialment creat per a *"donar vida a les pàgines web"*.
13+
=======
14+
*JavaScript* was initially created to "make web pages alive".
15+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
816
917
Els programes escrits en aquest llenguatge s'anomenen *scripts*. Poden ser escrits directament al codi HTML d'una pàgina web i executar-se automàticament quan la pàgina es carrega.
1018

1119
Els scripts es proporcionen i s'executen com a text pla. No necessiten cap preparació especial o compilació per executar-se.
1220

1321
En aquest aspecte, JavaScript és molt diferent d'un altre llenguatge anomenat [Java](https://ca.wikipedia.org/wiki/Java_(llenguatge_de_programaci%C3%B3)).
1422

23+
<<<<<<< HEAD
1524
```smart header="Per què <u>Java</u>Script?"
1625
Quan JavaScript fou creat, tenia un altre nom: "LiveScript". Però Java era molt popular en aquella època, així que es decidí que posicionar un nou llenguatge com el "germà petit" de Java seria útil.
26+
=======
27+
```smart header="Why is it called <u>Java</u>Script?"
28+
When JavaScript was created, it initially had another name: "LiveScript". But Java was very popular at that time, so it was decided that positioning a new language as a "younger brother" of Java would help.
29+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
1730
1831
No obstant, a l'evolucionar, JavaScript esdevingué un llenguatge completament independent amb la seva pròpia especificació anomenada [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript), i actualment no té cap tipus de relació amb Java.
1932
```
@@ -24,26 +37,46 @@ El navegador disposa d'un motor integrat, generalment anomenat "Màquina virtual
2437

2538
Motors diferents tenen "noms en clau" (criptònims) diferents. Per exemple:
2639

40+
<<<<<<< HEAD
2741
- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- en Chrome i Opera.
2842
- [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- en Firefox.
2943
- ...Hi ha altres noms en clau com "Trident" i "Chakra" per diferents versions d'IE, "ChakraCore" per Microsoft Edge, "Nitro" i "SquirrelFish" per Safari, etc.
3044

3145
Fóra bo mantenir en ment els termes anteriors perquè són àmpliament utilitzats en articles de desenvolupadors a Internet. També els emprarem aquí. Per exemple, si "la funcionalitat X és suportada per V8", llavors probablement funcioni a Chrome i Opera.
46+
=======
47+
- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome, Opera and Edge.
48+
- [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox.
49+
- ...There are other codenames like "Chakra" for IE, "JavaScriptCore", "Nitro" and "SquirrelFish" for Safari, etc.
50+
51+
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.
52+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
3253
3354
```smart header="Com funcionen els motors?"
3455
3556
Els motors són complicats, però els fonaments són fàcils.
3657
58+
<<<<<<< HEAD
3759
1. El motor (en el cas dels navegadors, integrat) llegeix, o analitza ("parses") el script.
3860
2. Posteriorment, converteix ("compiles") el script a llenguatge màquina.
3961
3. Finalment, el codi màquina s'executa veloçment.
4062
4163
El motor aplica optimitzacions a cada pas del procés. Fins i tot supervisa l'script compilat mentre s'executa, analitza les dades que rep i retorna, i aplica optimitzacions al codi màquina basant-se en aquest coneixement. Quan això passa, els scripts s'executen força ràpid.
64+
=======
65+
1. The engine (embedded if it's a browser) reads ("parses") the script.
66+
2. Then it converts ("compiles") the script to machine code.
67+
3. And then the machine code runs, pretty fast.
68+
69+
The engine applies optimizations at each step of the process. It even watches the compiled script as it runs, analyzes the data that flows through it, and further optimizes the machine code based on that knowledge.
70+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
4271
```
4372

4473
## Què pot fer JavaScript al navegador?
4574

75+
<<<<<<< HEAD
4676
El JavaScript modern és un llenguatge de programació "segur". No ofereix accés de baix nivell a la memòria o la CPU, ja que fou inicialment creat per navegadors que no ho requerien.
77+
=======
78+
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.
79+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
4780
4881
Les capacitats de JavaScript depenen majoritàriament de l'entorn on s'executa. Per exemple, [Node.js](https://wikipedia.org/wiki/Node.js) suporta funcions que permeten, amb JavaScript, llegir i escriure fitxers, realitzar peticions a través de la xarxa, etc.
4982

@@ -59,14 +92,23 @@ A tall d'exemple, JavaScript en navegador és capaç de:
5992

6093
## Què NO pot fer JavaScript al navegador?
6194

95+
<<<<<<< HEAD
6296
Les capacitats de JavaScript al navegador són limitades per protegir a l'usuari. L'objectiu és evitar el robatori d'informació privada o la corrupció de les dades de l'usuari per part d'una pàgina web maliciosa.
97+
=======
98+
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.
99+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
63100
64101
Com a mostra, algunes d'aquestes restriccions són:
65102

103+
<<<<<<< HEAD
66104
- El codi JavaScript d'una pàgina web no pot llegir o escriure fitxers arbitraris al disc dur, copiar-los o executar programes. No té accés directe a funcions del sistema operatiu.
105+
=======
106+
- 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.
107+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
67108
68109
Els navegadors moderns permeten treballar amb fitxers, però l'accés és limitat i només es garanteix si l'usuari realitza certes accions, com "soltar" (amb drag-and-drop) un fitxer a la finestra del navegador, o si el selecciona amb una etiqueta `<input>`.
69110

111+
<<<<<<< HEAD
70112
Hi ha maneres d'interactuar amb la càmera/micròfon o altres dispositius, però requereixen el permís explícit de l'usuari. Així, una pàgina web amb JavaScript no pot activar la càmera sigil·losament, observar l'escena i enviar la informació a la [NSA](https://en.wikipedia.org/wiki/National_Security_Agency).
71113
- Les diferents pestanyes o finestres, generalment, no saben res de les altres. A vegades en saben alguna cosa, com quan una finestra empra JavaScript per obrir-ne una altra, però fins i tot en aquest cas el codi JavaScript d'una pàgina no pot accedir el codi de l'altra si provenen de llocs diferents (domini, protocol o port diferent).
72114

@@ -78,43 +120,87 @@ Com a mostra, algunes d'aquestes restriccions són:
78120
![](limitations.svg)
79121

80122
Aquests límits desapareixen si JavaScript s'empra fora del navegador (en un servidor, per exemple). Els navegadors moderns també permeten plug-ins o extensions que poden demanar permisos addicionals.
123+
=======
124+
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).
125+
- 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).
126+
127+
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.
128+
129+
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.
130+
- 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 crippled. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation.
131+
132+
![](limitations.svg)
133+
134+
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.
135+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
81136
82137
## Què fa JavaScript únic?
83138

84139
JavaScript té, com a mínim, *tres* punts forts:
85140

86141
```compare
142+
<<<<<<< HEAD
87143
+ Integració completa amb HTML/CSS.
88144
+ Les coses simples es fan de forma simple
89145
+ És suportat per tots els navegadors importants i està activat per defecte.
146+
=======
147+
+ Full integration with HTML/CSS.
148+
+ Simple things are done simply.
149+
+ Supported by all major browsers and enabled by default.
150+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
90151
```
91152
JavaScript és l'única tecnologia de navegador que combina aquestes tres característiques.
92153

93154
Això és el que fa JavaScript únic. Per això és l'eina més estesa per crear interfícies de navegador.
94155

156+
<<<<<<< HEAD
95157
Quan es valora aprendre una nova tecnologia, és recomanable comprovar les perspectives d'aquesta: per tant, procedim a comentar les tendències que l'afectaran properament, incloent nous llenguatges i capacitats dels navegadors.
96158

159+
=======
160+
That said, JavaScript can be used to create servers, mobile applications, etc.
161+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
97162
98163
## Llenguatges "sobre" JavaScript
99164

100165
La sintaxi de JavaScript no satisfà les necessitats de tothom. Diferents persones volen diferents funcionalitats.
101166

102167
Això és esperable, ja que els projectes i requisits depenen de cadascú.
103168

169+
<<<<<<< HEAD
104170
Recentment, ha aparegut una plètora de llenguatges nous, que es *transpilen* (converteixen) a JavaScript abans d'executar-se al navegador.
171+
=======
172+
So, recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser.
173+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
105174
106175
Les noves eines fan que la conversió sigui ràpida i transparent, permetent als desenvolupadors programar en un altre llenguatge i convertir-lo automàticament.
107176

108177
Alguns exemples d'aquests llenguatges:
109178

179+
<<<<<<< HEAD
110180
- [CoffeeScript](http://coffeescript.org/) és "syntactic sugar" per JavaScript. Introdueix sintaxi més curta, permetent escriure codi més clar i precís. Generalment, els devs de Ruby se l'estimen força.
111181
- [TypeScript](http://www.typescriptlang.org/) se centra en afegir "tipatge estricte" per simplificar el desenvolupament i manteniment de sistemes complexos. És desenvolupat per Microsoft.
112182
- [Dart](https://www.dartlang.org/) és un llenguatge independent, amb el seu propi motor, que s'executa en entorns diferents del navegador (com les aplicacions mòbils). Originalment, Google l'oferí com a substitut de JavaScript, però actualment els navegadors requereixen que es converteixi a JavaScript, com els llenguatges anteriors.
113183

114184
N'hi ha més. Per suposat, fins i tot emprant algun d'aquests llenguatges, hom hauria de conèixer JavaScript per tal d'entendre realment què està fent.
185+
=======
186+
- [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.
187+
- [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.
188+
- [Flow](https://flow.org/) also adds data typing, but in a different way. Developed by Facebook.
189+
- [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.
190+
- [Brython](https://brython.info/) is a Python transpiler to JavaScript that enables the writing of applications in pure Python without JavaScript.
191+
- [Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) is a modern, concise and safe programming language that can target the browser or Node.
192+
193+
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.
194+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
115195
116196
## Resum
117197

198+
<<<<<<< HEAD
118199
- JavaScript fou inicialment creat com un llenguatge per a navegadors, però actualment s'empra també en altres entorns.
119200
- Avui dia, JavaScript ostenta indiscutiblement el títol del llenguatge de navegador amb integració completa amb HTML/CSS més utilitzat.
120201
- Hi ha diversos llenguatges que es "converteixen" a JavaScript i proporcionen certes funcionalitats. Es recomana donar-los un cop d'ull, almenys breument, un cop dominat JavaScript.
202+
=======
203+
- JavaScript was initially created as a browser-only language, but it is now used in many other environments as well.
204+
- Today, JavaScript has a unique position as the most widely-adopted browser language, fully integrated with HTML/CSS.
205+
- 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.
206+
>>>>>>> 34a80e70f8cce5794be259d25f815d7a7db7cbe3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
2+
# Manuals and specifications
3+
4+
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.
5+
6+
## Specification
7+
8+
[The ECMA-262 specification](https://www.ecma-international.org/publications/standards/Ecma-262.htm) contains the most in-depth, detailed and formalized information about JavaScript. It defines the language.
9+
10+
But being that formalized, it's difficult to understand at first. So if you need the most trustworthy source of information about the language details, the specification is the right place. But it's not for everyday use.
11+
12+
A new specification version is released every year. Between these releases, the latest specification draft is at <https://tc39.es/ecma262/>.
13+
14+
To read about new bleeding-edge features, including those that are "almost standard" (so-called "stage 3"), see proposals at <https://github.com/tc39/proposals>.
15+
16+
Also, if you're developing for the browser, then there are other specifications covered in the [second part](info:browser-environment) of the tutorial.
17+
18+
## Manuals
19+
20+
- **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.
21+
22+
You can find it at <https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference>.
23+
24+
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.
25+
26+
## Compatibility tables
27+
28+
JavaScript is a developing language, new features get added regularly.
29+
30+
To see their support among browser-based and other engines, see:
31+
32+
- <https://caniuse.com> - per-feature tables of support, e.g. to see which engines support modern cryptography functions: <https://caniuse.com/#feat=cryptography>.
33+
- <https://kangax.github.io/compat-table> - a table with language features and engines that support those or don't support.
34+
35+
All these resources are useful in real-life development, as they contain valuable information about language details, their support, etc.
36+
37+
Please remember them (or this page) for the cases when you need in-depth information about a particular feature.

0 commit comments

Comments
 (0)