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
+85-1Lines changed: 85 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,21 +1,32 @@
1
1
# En introduksjon til JavaScript
2
2
3
-
Let's see what's so special about JavaScript, what we can achieve with it, and which other technologies play well with it.
3
+
Let's see what's so special about JavaScript, what we can achieve with it, and what other technologies play well with it.
4
4
5
5
La oss se litt nærmere på hva som er så spesielt med JavaScript, hva vi kan oppnå ved å bruke det, og hvilke andre teknologier som passer godt sammen med det.
6
6
7
+
<<<<<<< HEAD
7
8
## Hva er JavaScript?
8
9
9
10
*JavaScript* var egentlig ment for å *"gi hjemmesider mer liv"*.
11
+
=======
12
+
*JavaScript* was initially created to "make web pages alive".
13
+
14
+
The programs in this language are called *scripts*. They can be written right in a web page's HTML and run automatically as the page loads.
15
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
10
16
11
17
Programmer skrevet i JavaScript kalles for *scripts*. De kan skrives rett inn i en nettsides's HTML og kjører automatisk så fort siden blir lastet.
12
18
13
19
Scripts er utdelt og kjørt som ren tekst. De trenger altså ingen forberedelser eller å bli kompilert for å kjøre.
14
20
15
21
Med dette øyemed, er JavaScript veldig annerledes fra et annet språk kalt [Java](https://en.wikipedia.org/wiki/Java_(programming_language)).
16
22
23
+
<<<<<<< HEAD
17
24
```smart header="Why <u>Java</u>Script?"
18
25
Når JavaScript ble skapt, hadde det i utgangspunktet navnet: "LiveScript". Men Java var veldig populært på den tiden, så det ble bestemt at å presentere et nytt programmeringsspråk som en "lillebror" til Java ville være en god ide.
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
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
19
30
20
31
Men etterhvert som det utviklet seg ble JavaScript et helt uavhengig programmeringsspårk med sitt eget sett med spesifikasjoner kalt [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript), og nå har det ingenting med Java å gjøre i det hele tatt.
21
32
```
@@ -27,27 +38,47 @@ Nettleseren har en innebygget motor som noenganger blir kalt for en "JavaScript
27
38
Different engines have different "codenames". For example:
28
39
Det finnes flere forskjellige motorer som har skilles fra hverandre med forskjellige "kodenavn". For eksempel:
29
40
41
+
<<<<<<< HEAD
30
42
-[V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- i Chrome og Opera.
31
43
-[SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- i Firefox.
32
44
- ...Det er også andre kodenavn som "Trident" og "Chakra" for forskjellige versjoner av IE, "ChakraCore" for Microsoft Edge, "Nitro" og "SquirrelFish" for Safari, osv.
33
45
34
46
Begrepene ovenfor er gode å huske fordi de ofte brukt i artikler skrevet av utviklere på nettet. Vi vil bruke de også. For eksempel, hvis "en funksjon x er støttet av v8", vil den sannsynlig fungere i Chrome og Opera.
47
+
=======
48
+
-[V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome, Opera and Edge.
49
+
-[SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox.
50
+
- ...There are other codenames like "Chakra" for IE, "JavaScriptCore", "Nitro" and "SquirrelFish" for Safari, etc.
51
+
52
+
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.
53
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
35
54
36
55
```smart header="How do engines work?"
37
56
38
57
Motorer er kompliserte. Men det grunnleggende er ganske lett.
39
58
59
+
<<<<<<< HEAD
40
60
1. Motoren (Innebygd hvis det er en nettleser) leser ("parser") scriptet.
41
61
2. Så konverterer den ("kompilerer") scriptet til maskin språk
42
62
3. Og så kjører maskin koden, veldig raskt.
43
63
44
64
Motoren tar ibruk optimaliseringer til hver eneste steg i prosessen. Passer til og med på det kompilerte scriptet imens det kjører, analyserer data som flyter gjennom det, og legger så til optimaliseringer til maskin koden basert på denne kunnskapen.
45
65
Når dette gjøres, kjører scripts rimelig fort.
66
+
=======
67
+
1. The engine (embedded if it's a browser) reads ("parses") the script.
68
+
2. Then it converts ("compiles") the script to machine code.
69
+
3. And then the machine code runs, pretty fast.
70
+
71
+
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.
72
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
46
73
```
47
74
48
75
## Hva kan JavaScript gjøre i nettleseren?
49
76
77
+
<<<<<<< HEAD
50
78
Moderne JavaScript er et "trygt" programmeringsspråk. Det gir ikke lavniå tilgang til minne eller CPU, fordi det i utgangspunktet var laget for nettlesere som ikke krever det.
79
+
=======
80
+
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.
81
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
51
82
52
83
JavaScript's evber er sterkt avhengig av miljøet det kjører i. For eksempel, [Node.js](https://wikipedia.org/wiki/Node.js) støtter funksjoner som lar JavaScript lese/skrive vilkårlig, gjennomføre nettverksforespørsler, osv.
53
84
@@ -63,14 +94,23 @@ For eksempel, i-nettleser JavaScript er i stand til å:
63
94
64
95
## Hva KAN IKKE JavaScript gjøre i nettleseren?
65
96
97
+
<<<<<<< HEAD
66
98
JavaScript's egenskaper i nettleseren er begrensede på vegne av brukeren trygghet. Dette er ment for å hindre nettsider med onde hensikter fra å aksessere informasjon eller ramme brukerens data på noen som helst måte.
99
+
=======
100
+
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.
101
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
67
102
68
103
Eksempler på slike begrensninger inkluderer:
69
104
105
+
<<<<<<< HEAD
70
106
- JavaScript på en nettside kan ikke lese/skrive vilkårlige filer på en harddisk, kopiere eller kjøre programmer. Det har ingen direkte tilgang til funksjoner som er tilknyttet operativsystemet (OS).
107
+
=======
108
+
- 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.
109
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
71
110
72
111
Moderne nettlesere tillater det til å behandle filer, men denne adgangen er begrenset og kun gitt hvis brukeren gjennomfører utvalgte hendelser, som å "slippe" en fil over et nettleservindu eller velger det via en `<input>` tag.
73
112
113
+
<<<<<<< HEAD
74
114
Det finnes måter å interragere med kamera og mikrofon og andre enheter, men disse krever at brukeren gir eksplisitt tillatelse. Så en JavaScript-akrivert side kan ikke på en lumsk måte aktivere webkameraet, se seg rundt og sende informasjonen om dette til [PST](https://no.wikipedia.org/wiki/Politiets_sikkerhetstjeneste).
75
115
76
116
- Forskjellige paneler/vinduer i en nettleser vet i utgangspunktet ingenting om hverandre. Noenganger gjør de det, for eksempel når et vindu bruker JavaScript til å åpne et annet vindu. Men selv i dette tilfellet, JavaScript fra en side til en kan ikke aksessere et annet vindu hvis det kommer fra forskjellige sider (fra et annet domene, protokoll eller port).
@@ -80,6 +120,19 @@ Eksempler på slike begrensninger inkluderer:
80
120
Denne begrensningen er, igjen satt på plass med brukerens trygghet i tankene. En side fra `http://hvilkensomhelstside.no` som en bruker har åpnet kan overhodet ikke være i stand til å aksessere et annet panel med URL'en `http://gmail.com` og stjele informasjon derfra.
81
121
82
122
- JavaScript kan med letthet kommunisere med en tjener over nettet hvor den nåværende siden kom fra. Men dets egenskap til å motta data fra andre sider/domener er veldig tungvint, men det er mulig, dette krever eksplisitt tillatelse (uttrykt via HTTP headere) fra den eksterne siden. Igjen, dette er sikkerhetsbegrensning.
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 severely limited. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation.
131
+
132
+

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
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
83
136
84
137

85
138
@@ -90,37 +143,68 @@ Slike begrensninger eksisterer ikke hvis JavaScript brukes på utsiden av nettle
90
143
Dette er de *tre* minst gode ting om JavaScript:
91
144
92
145
```compare
146
+
<<<<<<< HEAD
93
147
+ Full integrasjon med HTML/CSS.
94
148
+ Enkle ting kan gjøres på en enkel måte.
95
149
+ Støttet av alle de største nettleserne og er påslått som standard.
150
+
=======
151
+
+ Full integration with HTML/CSS.
152
+
+ Simple things are done simply.
153
+
+ Supported by all major browsers and enabled by default.
154
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
96
155
```
97
156
JavaScript er den eneste nettleser teknologien som kombinerer disse tre tingene.
98
157
99
158
Dette er det som gjør JavaScript unikt. Dette er grunnen til at JavaScript er det mest utstrakte verktøyet for utvikling av grensesnitt i nettleseren.
100
159
160
+
<<<<<<< HEAD
101
161
Imens du har planer om å lære deg en teknologi, er det gunstig å sjekke dens perspektiver. Så la oss fortsette til de moderne trendene som påvirker den, inkluderende nye språk og ny nettleser-funksjonalitet.
102
162
103
163
## Språk "via" JavaScript
164
+
=======
165
+
That said, JavaScript can be used to create servers, mobile applications, etc.
166
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
104
167
105
168
JavaScript's syntax er tilpasset alle sitt behov. Forskjellige folk trenger forskjellige funksjoner.
106
169
107
170
Dette er ikke overraskende, siden forskjellige prosjekter har forskjellige krav.
108
171
109
172
En haug av nye språk har nylig dukket opp, som er *transpilert* (konvertert) til JavaScript før de kjører i nettleseren.
110
173
174
+
<<<<<<< HEAD
111
175
Moderne verktøy gjør transpileringen veldig rask og forutsigbar, faktisk så lar dette utviklere å skrive kode på et annet språk som blir automatisk konvertert "under panseret".
176
+
=======
177
+
So, recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser.
178
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
112
179
113
180
Dette er eksempler på slike språk:
114
181
115
182
-[CoffeeScript](http://coffeescript.org/) er en "syntaktisk sukker" for JavaScript. Det introduserer kortere syntax, som lar oss skrive klarer og mer presis kode. Ruby utviklere er vanligvis mer glad i dette.
116
183
-[TypeScript](http://www.typescriptlang.org/) er konsentrert rundt å legge til "streng datatyping" for å gjøre utvikling og drifting av komplekse systemer lettere. TypeScript er utviklet av Microsoft.
117
184
-[Dart](https://www.dartlang.org/) er et selvstendig språk som har sin egen motor som kjører ukjente miljøer for nettleseren (som mobilapplikasjoner). Det var i utgangspunktet lagt frem av Google som en erstatter for JavaScript, men foreløpig krever nettlesere at Dart transpileres til JavaScript akkurat som de andre nevnt ovenfor.
118
185
186
+
<<<<<<< HEAD
119
187
Det finnes flere selvfølgelig. Men selv om vi bruker noen av disse språkene, er det lurt av oss å kjenne JavaScript for å vite hva vi egentlig driver med.
188
+
=======
189
+
-[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.
190
+
-[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.
191
+
-[Flow](https://flow.org/) also adds data typing, but in a different way. Developed by Facebook.
192
+
-[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.
193
+
-[Brython](https://brython.info/) is a Python transpiler to JavaScript that enables the writing of applications in pure Python without JavaScript.
194
+
-[Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) is a modern, concise and safe programming language that can target the browser or Node.
195
+
196
+
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.
197
+
>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf
120
198
121
199
## Summary
122
200
## Oppsummering
123
201
202
+
<<<<<<< HEAD
124
203
- JavaScript var i utgangspunktet skapt som et kun-nettleser språk, men finnes også i mange andre miljøer i tillegg.
125
204
- Idag, har JavaScript en unik position som det mest brukt nettleser språket med full integrasjon mot HTML/CSS.
126
205
- Det finnes mange språk som blir "transpilert" til JavaScript og som gir utvalgte funksjoner. Det er anbefalt å ta en kikk på de, ihvertfall ganske kort, etter at du mestrer JavaScript.
206
+
=======
207
+
- JavaScript was initially created as a browser-only language, but it is now used in many other environments as well.
208
+
- Today, JavaScript has a unique position as the most widely-adopted browser language, fully integrated with HTML/CSS.
209
+
- 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.
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