-
Notifications
You must be signed in to change notification settings - Fork 10
/
method1.html
125 lines (103 loc) · 4.83 KB
/
method1.html
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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta content="width=device-width" name="viewport">
<title>JS Hero</title>
<meta name="description" content="Learn to Code">
<meta name="keywords" content="JavaScript Koans Lernen Übungen Programmierung Kurs Aufgaben">
<meta name="author" content="Stefan Trenkel">
<link rel="stylesheet" href="../css/main.css">
<link rel="stylesheet" href="../css/header.css">
<link rel="stylesheet" href="../css/nav.css">
<link rel="stylesheet" href="../css/footer.css">
</head>
<body>
<div id="header">
<a id="next-button" class="control" href="regex1.html" title="Nächste Seite"></a>
<a id="success-button" class="control" href="../success.html" title="Übersicht"></a>
<a id="prev-button" class="control" href="object4.html" title="Vorherige Seite"></a>
<div id="menu" class="menu" title="Menü"></div>
<a id="title" class="title" href="../home.html" title="Home">JavaScript Hero</a>
<a id="title-short" class="title" href="../home.html" title="Home">JS Hero</a>
</div>
<div id="nav">
<a href="../home.html">Home</a>
<a href="../intro.html">Einführung</a>
<a href="var.html">Start</a>
<a href="../success.html">Übersicht</a>
<a href="../playground.html">Playground</a>
<a href="../links.html">Links</a>
<a href="../en/koans/var.html">--- English ---</a>
</div>
<div id="content">
<noscript>
<p class="warning">
Du hast JavaScript deaktiviert oder dein Browser unterstützt kein JavaScript. JavaScript Hero benötigt einen
Browser mit aktiviertem JavaScript.
</p>
</noscript>
<p id="no-storage-warning" class="warning">
Der Browser-Speicher
<a href="https://wiki.selfhtml.org/wiki/JavaScript/Web_Storage">localStorage</a>
ist nicht verfügbar. Entweder unterstützt dein Browser ihn nicht oder du hast ihn deaktiviert oder er ist voll.
Ohne localStorage werden deine Lösungen nicht gespeichert.
</p>
<h1 id="koans-title">Methoden</h1>
<div id="koans-lesson" class="paragraph">Bisher waren die Werte von Objekt-Eigenschaften Daten wie Strings oder Zahlen.
Objekt-Eigenschaften können aber auch Funktionen sein. Solche Objekt-Eigenschaften nennt man
Methoden. Methoden operieren auf den Daten eines Objekts.
<pre><code>var ware = {
name: 'Äpfel',
preis: 2.15,
erhoehePreis: function(erhoehung) {
this.preis = this.preis + erhoehung;
};
};
var alterPreis = ware.preis;
ware.erhoehePreis(0.05);
var neuerPreis = ware.preis;</code></pre>
Das Objekt <code>ware</code> besitzt die Methode <code>erhoehePreis</code>. Diese Methode greift mithilfe von
<code>this</code> auf die Objekt-Eigenschaft <code>preis</code> zu. <code>this</code> steht innerhalb eines Objekts für
das Objekt selbst. Mit der bekannten Punkt-Notation kann man nun auf die Objekt-Eigenschaften zugreifen und sie
verändern.<br>
Von außen wird eine Methode über die zugeordnete Variable und der Punkt-Notation aufgerufen.</div>
<h2>Aufgabe</h2>
<div id="koans-task" class="paragraph">Definiere ein Objekt mit den beiden Eigenschaften <code>x</code> und <code>y</code> sowie einer Methode
<code>moveX</code>. <code>x</code> und <code>y</code> sollen den Wert <code>0</code> erhalten. <code>moveX</code>
soll den Wert von <code>x</code> um <code>1</code> erhöhen. Weise das Objekt einer Variablen <code>point</code> zu.</div>
<textarea id="code-area" class="code-area" autocapitalize="none" spellcheck="false" autocorrect="off"
autocomplete="off" placeholder="// ... deine Lösung ..." rows="8"></textarea>
<p>
<button id="test-button">Tests</button>
</p>
<div id="messages"></div>
</div>
<div id="footer">
<a href="https://www.jshero.net">Web App</a>
<a href="https://play.google.com/store/apps/details?id=net.jshero">Android App</a>
<a href="../privacy.html">Datenschutz</a>
<a href="../info.html">Kontakt</a>
</div>
<script src="../js/util/nodeutil.js"></script>
<script src="../js/util/polyfill.js"></script>
<script src="../js/util/array.js"></script>
<script src="../js/util/object.js"></script>
<script src="../js/util/date.js"></script>
<script src="../js/util/util.js"></script>
<script src="../js/util/cordova.js"></script>
<script src="../js/util/language.js"></script>
<script src="../js/util/i18n.js"></script>
<script src="../js/lib/evaluator.js"></script>
<script src="../js/lib/nav.js"></script>
<script src="../js/lib/header.js"></script>
<script src="../js/lib/storage.js"></script>
<script src="../js/lib/code.js"></script>
<script src="../js/lib/message.js"></script>
<script src="../js/lib/log.js"></script>
<script src="../js/lib/testutil.js"></script>
<script src="../js/lib/actualkoan.js"></script>
<script src="../js/lib/tester.js?v=320"></script>
<script src="../js/main.js"></script>
</body>
</html>