tutorials/sida1.html at master · folkol/tutorials · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>JavaScript Crash Course</title>
    <link rel="stylesheet" href="google-code-prettify/prettify.css">
    <link rel="stylesheet" href="css/sons-of-obsidian.css">
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <script src="google-code-prettify/prettify.js"></script>
    <script src="js/qunit-1.15.0.js"></script>
    <script src="exercises/sida1.js"></script>
    <script src="tests/sida1.js"></script>
  </head>
  <body onload="prettyPrint()">
    <div class='column'>
      <div class="content">
        <div class="button left"><a href="index.html">&lt;&lt;PREV</a></div>
        <div class="button right"><a href="sida2.html">NEXT >></a></div>
        <h1>Variabler och typer</h1>
        <p>En variabel i JavaScript deklareras med ett <a href='http://www.ecma-international.org/ecma-262/5.1/#sec-12.2'>Variable Statement</a>, vilket består av ordet 'var' följt av ett namn.</p>
        <div class='testcaption'>Ett statement som deklarerar en variabel vid namn 'foo':</div>
        <pre class="prettyprint linenums">var foo;</pre>
        <p>En variabel i JavaScript är otypad, men det värde som variabeln för tillfället refererar till är typat och har en av följande typer:</p>
        <ul>
          <li>Boolean</li>
          <li>Null</li>
          <li>Undefined</li>
          <li>Number</li>
          <li>String</li>
          <li>Object</li>
        </ul>
        <p>Operatorn "typeof" ger en textsträng som beskriver typen för den variabel man använder den på. Se <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4.3">specen</a> för mer detaljer.</p>
        <p>Vi ska gå igenom typerna lite hastigt och kommer i senare slides gå in lite mer på djupet av typen Object</p>
        <h3>Boolean</h3>
        <p>Kan anta värdena true och false. Här passar vi även på att visa kommentars-syntaxen.</p>
        <div class='testcaption'>Att tilldela variabler boolean values:</div>
        <pre class="prettyprint linenums">var foo = true;
var bar = false;
var fooType = typeof foo; // 'boolean'</pre>
        <h3>Null</h3>
        <p>Kan endast anta värdet null.</p>
        <div class='testcaption'>Att sätta en variabeln till null:</div>
        <pre class="prettyprint linenums">var foo = null;</pre>
        <h3>Undefined</h3>
        <p>Kan endast anta värdet undefined. Alla variabler har värdet undefined innan de tilldelas något annat värde. Det finns fler situationer där man träffar på undefined, men vi kommer till det senare.</p>
        <p>Man tilldelar generellt inte värdet undefined till en variabel explicit.</p>
        <div class='testcaption'>Variabler är undefined tills man tilldelat dem ett värde:</div>
        <pre class="prettyprint linenums">var foo; // undefined</pre>
        <h3>Number</h3>
        <p>Ett 64 bits tal, enligt <a href="https://en.wikipedia.org/wiki/IEEE_floating_point">IEEE 754</a>. D.v.s. ett gäng flyttal, samt NaN, -Inf och +Inf.</p>
        <p>Man kan konvertera en textsträng till ett Number genom parseFloat (Eller parseInt, om man bara vill ha heltal).</p>
        <div class='testcaption'>Number values:</div>
        <pre class="prettyprint linenums">var foo = 2;
var bar = 3.14;
var baz = parseInt('1337');</pre>
        <h3>String</h3>
        <p>En textsträng skapas genom antingen enkla eller dubbla citattecken, valfritt.</p>
        <p>(En serie av UTF-16 code points när den innehåller text, men kan även innehålla godtycklig binär data.)</p>
        <p>Man kan läsa ut strängens längd m.h.a. propertien ".length". Vi återkommer till vad properties är under Object.</p>
        <p>Man kan konkatenera strängar med +.</p>
        <div class='testcaption'>Skapa textsträngar:</div>
        <pre class="prettyprint linenums">var foo = 'Hello';
var bar = "Hello there";
var baz = "Hello" + " there";</pre>
        <h3>Object</h3>
        <p>Ett JavaScript Object är en samling properties. En property är ett namn associerat med ett värde. Värdet kan vara av vilken typ som helst, inklusive i sin tur ett Object.</p>
        <p>Det finns flera olika sätt att skapa Objects, här visas några av dem (Alla Object i exemplet är tomma objekt, utan några programdefinierade properties).</p>
        <div class='testcaption'>Skapa Objects:</div>
        <pre class="prettyprint linenums">var baz = {};
var bar = Object.create(null);
var foo = new Object();</pre>
        <h2>Tester</h2>
        <p>Tilldela variablerna värden av förväntad typ, samt skapa de variabler som saknas.</p>
        <div class='testcaption'>Test results:</div>
        <div class='testresult' id="qunit"></div>
        <div id="qunit-fixture"></div>
      </div>
    </div>
  </body>
</html>