Versionen vergleichen

Eine Wiedereinführung in JavaScript

Version 486761:

Version 486761 von eminor am

Version 486763:

Version 486763 von eminor am

Titel:
Eine Wiedereinführung in JavaScript
Eine Wiedereinführung in JavaScript
Adressname:
JavaScript/Eine_Wiedereinfuehrung_in_JavaScript
JavaScript/Eine_Wiedereinfuehrung_in_JavaScript
Inhalt:

Version 486761
Version 486763
n81    <h3>n81    <h3 id="Numbers_(numerische_Werte)">
n179        <strong>Anmerkung:</strong> Die Funktionen parseInt() undn179        <strong>Anmerkung:</strong> Die Funktionen parseInt() und
> parseFloat() parsen einen String, bis ein Zeichen erreicht wird,> parseFloat() parsen einen String, bis ein Zeichen erreicht wird,
> welches für das entsprechende Number-Format unzulässig ist und g> welches für das entsprechende Number-Format unzulässig ist und g
>eben die Zahl bis zu dieser Stelle zurück. Der unänere + Operator>eben die Zahl bis zu dieser Stelle zurück. Der unäre + Operator k
> konvertiert den String einfach zu NaN, falls dieser ein unerlaub>onvertiert den String einfach zu NaN, falls dieser ein unerlaubte
>tes Zeichen enthält. Damit Sie die Unterschiede besser verstehen,>s Zeichen enthält. Damit Sie die Unterschiede besser verstehen, p
> probieren Sie alle beschriebenen Methoden am besten selbst aus u>robieren Sie alle beschriebenen Methoden am besten selbst aus und
>nd versuchen Sie den String "10.2anc" in der Konsole zu parsen.> versuchen Sie den String "10.2anc" in der Konsole zu parsen.
n182    <h3>n182    <h3 id=".C2.A0">
n185    <h3>n185    <h3 id="Strings_(Zeichenketten)">
n189      Strings sind bei JavaScript eine Folge von Zeichen. Um genan189      Strings sind bei JavaScript eine Folge von Zeichen. Um gena
>u zu sein, handelt es sich um Unicode-Zeichen, wobei jedes Zeiche>u zu sein handelt es sich um Unicode-Zeichen, wobei jedes Zeichen
>n durch eine 16-Bit Zahl repräsentiert wird. Falls Sie schon einm> durch eine 16-Bit Zahl repräsentiert wird. Falls Sie schon einma
>al mit Internationalisierung zutun hatten, werden Sie darüber sic>l mit Internationalisierung zutun hatten, werden Sie darüber sich
>her erfreut sein.>er erfreut sein.
n212    <h3>n212    <h3 id="Weitere_Datentypen_und_Werte">
n216      JavaScript unterscheidet zwischen <code>null</code>, wobei n216      JavaScript unterscheidet zwischen <code>null</code>, wobei 
>es sich um ein Objekt vom Typ 'object' handelt, welches "keinen W>es sich um ein Objekt vom Typ 'object' handelt, welches einen "ni
>ert" repräsentiert und <code>undefined</code>, wobei es sich um e>cht Wert" repräsentiert und <code>undefined</code>, wobei es sich
>in Objekt vom Typ 'undefined' handelt, welches für einen nicht-in> um ein Objekt vom Typ 'undefined' handelt, welches für einen nic
>itialisierten Wert steht - also anzeigt, dass noch kein Wert zuge>ht-initialisierten Wert steht - also anzeigt, dass noch kein Wert
>wiesen wurde. Später werden wir uns noch gründlicher mit Variable> zugewiesen wurde. Später werden wir uns noch gründlicher mit Var
>n beschäftigen. Nur noch eines sei gesagt: Bei JavaScript ist es >iablen beschäftigen. Nur noch eines sei gesagt: Bei JavaScript is
>möglich, eine Variable zu deklarieren, ohne sie zu initialisieren>t es möglich, eine Variable zu deklarieren, ohne sie zu initialis
>, ihr also einen Wert zuzuweisen - und genau dann ist ihr Typ <co>ieren, ihr also einen Wert zuzuweisen - und genau dann ist ihr Ty
>de>undefined</code> (undefiniert).>p <code>undefined</code> (undefiniert).
n242    <h3>n242    <h3 id="Variablen">
n258    <h3>n258    <h3 id="Operatoren">
t282      Let's start off by looking at the building block of any lant282      &nbsp;
>guage: the types. JavaScript programs manipulate values, and thos 
>e values all belong to a type. JavaScript's types are: 
283    </p>
284    <ul>
285      <li>
286        <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects
>/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/N 
>umber">Numbers</a> 
287      </li>
288      <li>
289        <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects
>/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/S 
>tring">Strings</a> 
290      </li>
291      <li>
292        <a href="/en/JavaScript/Reference/Global_Objects/Boolean"
> title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean"> 
>Booleans</a> 
293      </li>
294      <li>
295        <a href="/en/JavaScript/Reference/Global_Objects/Function
>" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function 
>">Functions</a> 
296      </li>
297      <li>
298        <a href="/en/JavaScript/Reference/Global_Objects/Object" 
>title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">Ob 
>jects</a> 
299      </li>
300    </ul>
301    <p>283    </p>
302      ... oh, and Undefined and Null, which are slightly odd. And
> <a href="/en/JavaScript/Reference/Global_Objects/Array" title="e 
>n/Core_JavaScript_1.5_Reference/Global_Objects/Array">Arrays</a>, 
> which are a special kind of object. And <a href="/en/JavaScript/ 
>Reference/Global_Objects/Date" title="en/Core_JavaScript_1.5_Refe 
>rence/Global_Objects/Date">Dates</a> and <a href="/en/JavaScript/ 
>Reference/Global_Objects/RegExp" title="en/Core_JavaScript_1.5_Re 
>ference/Global_Objects/RegExp">Regular Expressions</a>, which are 
> objects that you get for free. And to be technically accurate, f 
>unctions are just a special type of object. So the type diagram l 
>ooks more like this: 
303    </p>
304    <ul>
305      <li>Number
306      </li>
307      <li>String
308      </li>
309      <li>Boolean
310      </li>
311      <li>Object
312        <ul>
313          <li>Function
314          </li>
315          <li>Array
316          </li>
317          <li>Date
318          </li>
319          <li>RegExp
320          </li>
321        </ul>
322      </li>
323      <li>Null
324      </li>
325      <li>Undefined
326      </li>
327    </ul>
328    <p>
329      And there are some built in <a href="/en/JavaScript/Referen
>ce/Global_Objects/Error" title="en/Core_JavaScript_1.5_Reference/ 
>Global_Objects/Error">Error</a> types as well. Things are a lot e 
>asier if we stick with the first diagram, though. 
330    </p>
331    <h2 id="Numbers">
332      Numbers
333    </h2>
334    <p>
335      Numbers in JavaScript are "double-precision 64-bit format I
>EEE 754 values", according to the spec. This has some interesting 
> consequences. There's no such thing as an integer in JavaScript, 
> so you have to be a little careful with your arithmetic if you'r 
>e used to math in C or Java. Watch out for stuff like: 
336    </p>
337    <pre class="eval">
3380.1 + 0.2 == 0.30000000000000004
339</pre>
340    <p>
341      In practice, integer values are treated as 32-bit ints (and
> are stored that way in some browser implementations), which can  
>be important for bit-wise operations. For details, see <a class=" 
>external" href="http://www.hunlock.com/blogs/The_Complete_Javascr 
>ipt_Number_Reference" title="http://www.hunlock.com/blogs/The_Com 
>plete_Javascript_Number_Reference">The Complete JavaScript Number 
> Reference</a>. 
342    </p>
343    <p>
344      The standard <a href="/en/JavaScript/Reference/Operators/Ar
>ithmetic_Operators" title="en/Core_JavaScript_1.5_Reference/Opera 
>tors/Arithmetic_Operators">numeric operators</a> are supported, i 
>ncluding addition, subtraction, modulus (or remainder) arithmetic 
> and so forth. There's also a built-in object that I forgot to me 
>ntion earlier called <a href="/en/JavaScript/Reference/Global_Obj 
>ects/Math" title="en/Core_JavaScript_1.5_Reference/Global_Objects 
>/Math">Math</a> to handle more advanced mathematical functions an 
>d constants: 
345    </p>
346    <pre class="brush: js">
347Math.sin(3.5);
348var d = Math.PI * r * r;
349</pre>
350    <p>
351      You can convert a string to an integer using the built-in <
>code><a href="/en/JavaScript/Reference/Global_Objects/parseInt" t 
>itle="en/Core_JavaScript_1.5_Reference/Global_Functions/parseInt" 
>>parseInt()</a></code> function. This takes the base for the conv 
>ersion as an optional second argument, which you should always pr 
>ovide: 
352    </p>
353    <pre class="brush: js">
354&gt; parseInt("123", 10)
355123
356&gt; parseInt("010", 10)
35710
358</pre>
359    <p>
360      If you don't provide the base, you can get surprising resul
>ts in older browsers (pre-2013): 
361    </p>
362    <pre class="brush: js">
363&gt; parseInt("010")
3648
365</pre>
366    <p>
367      That happened because the <code>parseInt</code> function de
>cided to treat the string as octal due to the leading 0. 
368    </p>
369    <p>
370      If you want to convert a binary number to an integer, just 
>change the base: 
371    </p>
372    <pre class="brush: js">
373&gt; parseInt("11", 2)
3743
375</pre>
376    <p>
377      Similarly, you can parse floating point numbers using the b
>uilt-in <code><a href="/en/JavaScript/Reference/Global_Objects/pa 
>rseFloat" title="en/JavaScript/Reference/Global Objects/parseFloa 
>t">parseFloat()</a></code> function which uses base 10 always unl 
>ike its <a href="/en/JavaScript/Reference/Global_Objects/parseInt 
>" title="en/JavaScript/Reference/Global Objects/parseInt"><code>p 
>arseInt()</code></a> cousin. 
378    </p>
379    <p>
380      You can also use the unary <code>+</code> operator to conve
>rt values to numbers: 
381    </p>
382    <pre>
383&gt; + "42"
38442 
385</pre>
386    <p>
387      A special value called <code><a href="/en/JavaScript/Refere
>nce/Global_Objects/NaN" title="en/Core_JavaScript_1.5_Reference/G 
>lobal_Properties/NaN">NaN</a></code> (short for "Not a Number") i 
>s returned if the string is non-numeric: 
388    </p>
389    <pre class="brush: js">
390&gt; parseInt("hello", 10)
391NaN
392</pre>
393    <p>
394      <code>NaN</code> is toxic: if you provide it as an input to
> any mathematical operation the result will also be <code>NaN</co 
>de>: 
395    </p>
396    <pre class="brush: js">
397&gt; NaN + 5
398NaN
399</pre>
400    <p>
401      You can test for <code>NaN</code> using the built-in <code>
><a href="/en/JavaScript/Reference/Global_Objects/isNaN" title="en 
>/Core_JavaScript_1.5_Reference/Global_Functions/isNaN">isNaN()</a 
>></code> function: 
402    </p>
403    <pre class="brush: js">
404&gt; isNaN(NaN)
405true
406</pre>
407    <p>
408      JavaScript also has the special values <code><a href="/en/J
>avaScript/Reference/Global_Objects/Infinity" title="en/Core_JavaS 
>cript_1.5_Reference/Global_Properties/Infinity">Infinity</a></cod 
>e> and <code>-Infinity</code>: 
409    </p>
410    <pre class="brush: js">
411&gt; 1 / 0
412Infinity
413&gt; -1 / 0
414-Infinity
415</pre>
416    <p>
417      You can test for <code>Infinity</code>, <code>-Infinity</co
>de> and <code>NaN</code> values using the built-in <code><a href= 
>"/en/JavaScript/Reference/Global_Objects/isFinite" title="en/Core 
>_JavaScript_1.5_Reference/Global_Functions/isFinite">isFinite()</ 
>a></code> function: 
418    </p>
419    <pre class="brush: js">
420&gt; isFinite(1/0)
421false
422&gt; isFinite(-Infinity)
423false
424&gt; isFinite(NaN)
425false
426</pre>
427    <div class="note">
428      <strong>Note:</strong> The <a href="/en/JavaScript/Referenc
>e/Global_Objects/parseInt" title="en/JavaScript/Reference/Global  
>Objects/parseInt"><code>parseInt()</code></a> and <code><a href=" 
>/en/JavaScript/Reference/Global_Objects/parseFloat" title="en/Jav 
>aScript/Reference/Global Objects/parseFloat">parseFloat()</a></co 
>de> functions parse a string until they reach a character that is 
>n't valid for the specified number format, then return the number 
> parsed up to that point. However the "+" operator simply convert 
>s the string to <code>NaN</code> if there is any invalid characte 
>r in it. Just try parsing the string "10.2abc" with each method b 
>y yourself in the console and you'll understand the differences b 
>etter. 
429    </div>
430    <h2 id="Strings">
431      Strings
432    </h2>
433    <p>
434      Strings in JavaScript are sequences of characters. More acc
>urately, they're sequences of <a href="/en/JavaScript/Guide/Value 
>s,_variables,_and_literals#Unicode" title="en/Core_JavaScript_1.5 
>_Guide/Unicode">Unicode characters</a>, with each character repre 
>sented by a 16-bit number. This should be welcome news to anyone  
>who has had to deal with internationalisation. 
435    </p>
436    <p>
437      If you want to represent a single character, you just use a
> string of length 1. 
438    </p>
439    <p>
440      To find the length of a string, access its <code><a href="/
>en/JavaScript/Reference/Global_Objects/String/length" title="en/C 
>ore_JavaScript_1.5_Reference/Global_Objects/String/length">length 
></a></code> property: 
441    </p>
442    <pre class="brush: js">
443&gt; "hello".length
4445
445</pre>
446    <p>
447      There's our first brush with JavaScript objects! Did I ment
>ion that strings are objects too? They have <a href="/En/Core_Jav 
>aScript_1.5_Reference/Global_Objects/String#Methods" title="en/Co 
>re_JavaScript_1.5_Reference/Global_Objects/String#Methods">method 
>s</a> as well: 
448    </p>
449    <pre class="brush: js">
450&gt; "hello".charAt(0)
451h
452&gt; "hello, world".replace("hello", "goodbye")
453goodbye, world
454&gt; "hello".toUpperCase()
455HELLO
456</pre>
457    <h2 id="Other_types">
458      Other types
459    </h2>
460    <p>
461      JavaScript distinguishes between <code>null</code>, which i
>s an object of type 'object' that indicates a deliberate non-valu 
>e, and <code>undefined</code>, which is an object of type 'undefi 
>ned' that indicates an uninitialized value — that is, a value has 
>n't even been assigned yet. We'll talk about variables later, but 
> in JavaScript it is possible to declare a variable without assig 
>ning a value to it. If you do this, the variable's type is <code> 
>undefined</code>. 
462    </p>
463    <p>
464      JavaScript has a boolean type, with possible values <code>t
>rue</code> and <code>false</code> (both of which are keywords). A 
>ny value can be converted to a boolean according to the following 
> rules: 
465    </p>
466    <ol>
467      <li>
468        <code>false</code>, <code>0</code>, the empty string (<co
>de>""</code>), <code>NaN</code>, <code>null</code>, and <code>und 
>efined</code> all become <code>false</code> 
469      </li>
470      <li>all other values become <code>true</code>
471      </li>
472    </ol>
473    <p>
474      You can perform this conversion explicitly using the <code>
>Boolean()</code> function: 
475    </p>
476    <pre class="brush: js">
477&gt; Boolean("")
478false
479&gt; Boolean(234)
480true
481</pre>
482    <p>
483      However, this is rarely necessary, as JavaScript will silen
>tly perform this conversion when it expects a boolean, such as in 
> an <code>if</code> statement (see below). For this reason, we so 
>metimes speak simply of "true values" and "false values," meaning 
> values that become <code>true</code> and <code>false</code>, res 
>pectively, when converted to booleans. Alternatively, such values 
> can be called "truthy" and "falsy", respectively. 
484    </p>
485    <p>
486      Boolean operations such as <code>&amp;&amp;</code> (logical
> <em>and</em>), <code>||</code> (logical <em>or</em>), and <code> 
>!</code> (logical <em>not</em>) are supported; see below. 
487    </p>
488    <h2 id="Variables">
489      Variables
490    </h2>
491    <p>
492      New variables in JavaScript are declared using the <code><a
> href="/en/JavaScript/Reference/Statements/var" title="en/Core_Ja 
>vaScript_1.5_Reference/Statements/var">var</a></code> keyword: 
493    </p>
494    <pre class="brush: js">
495var a;
496var name = "simon";
497</pre>
498    <p>
499      If you declare a variable without assigning any value to it
>, its type is <code>undefined</code>.&nbsp; 
500    </p>
501    <p>
502      An important difference from other languages like Java is t
>hat in JavaScript, blocks do not have scope; only functions have  
>scope. So if a variable is defined using <code>var</code> in a co 
>mpound statement (for example inside an <code>if</code> control s 
>tructure), it will be visible to the entire function. 
503    </p>
504    <h2 id="Operators">
505      Operators
506    </h2>
507    <p>
508      JavaScript's numeric operators are <code>+</code>, <code>-<
>/code>, <code>*</code>, <code>/</code> and <code>%</code> - which 
> is the remainder operator. Values are assigned using <code>=</co 
>de>, and there are also compound assignment statements such as <c 
>ode>+=</code> and <code>-=</code>. These extend out to <code>x =  
>x <em>operator</em> y</code>. 
509    </p>
510    <pre class="brush: js">
511x += 5
512x = x + 5
513</pre>
514    <p>
515      You can use <code>++</code> and <code>--</code> to incremen
>t and decrement respectively. These can be used as prefix or post 
>fix operators. 
516    </p>
517    <p>
518      The <a href="/en/JavaScript/Reference/Operators/String_Oper
>ators" title="en/Core_JavaScript_1.5_Reference/Operators/String_O 
>perators"><code>+</code> operator</a> also does string concatenat 
>ion: 
519    </p>
520    <pre class="brush: js">
521&gt; "hello" + " world"
522hello world
523</pre>

Zurück zur Versionsgeschichte