WTFJS? EnterJS Matthias Reuter

Transkript

1 WTFJS? EnterJS 2014 Matthias Reuter

2 Grafik: Angus

3 » CC-BY-SA

4 Computer! Binärsystem! Endliche Präzision!

5 = dec bin IEEE 754 double keine Integerzahlen in JavaScript!

6 e ± 2 m IEEE 754 DOUBLE 64 bit: 1 bit Vorzeichen, 11 bit Exponent, 53 (52) bit Mantisse dec

7 LÖSUNG function equals(a, b) { var epsilon = Math.pow(2, -53); return Math.abs(a - b) < epsilon; } Geeignetes Epsilon wählen Tipp: Bei Geldbeträgen immer in Cent, nicht in Euro rechnen

8 typeof NaN» "number" CC-BY-NC-ND

9 NAN IEEE 754 Software- und Hardware-Implementierungen Alles muss eine Zahl sein NaN signalisiert eine ungültige Operation

10 UNGÜLTIGE OPERATIONEN Infinity - Infinity Math.sqrt(-1) 0/0 Number("wtf")

11 DARSTELLUNG xxxxx (Mantisse 0)

12 NaN === NaN» false isnan(nan)» true isnan(43)» false isnan("wft")» true

13 Number.isNaN() LÖSUNG (ES6) LÖSUNG (NACHBAU) function betterisnan(a) { return typeof a === "number" && isnan(a); } LÖSUNG (SCHLAU) function cleverisnan(a) { return a!== a; }

14 "0" == false» true 0 == false» true "" == false» true [] == false» true CC-BY-NC-SA

15 == BEDEUTET NICHT GLEICH, EHER BEDEUTET ES ÄHNLICH Für Mathematiker: == ist keine Äquivalenzrelation "0" == falseund false == [], aber nicht "0" == []

16 ÄHNLICH? CC-PD

17 PPK on Javascript: An empty string becomes false. All other values become true. Matthias: Echt? Auch "0"? Matthias: Wie erzwinge ich denn die Umwandlung von "0" in ein Boolean? Matthias (dumme Idee): "0" == true; Browser: false

18 ABSTRACT EQUALITY COMPARISON ALGORITHM THE ABSTRACT EQUALITY COMPARISON ALGORITHM The comparison x == y, where x and y are values, produces true or false. Such a comparison is performed as follows: 1. If Type(x) is different from Type(y), go to step 14. (22 Schritte insgesamt, in ES umformuliert, 10 Schritte)

19

20 "0" == false "0" == 0 0 == 0 true

21 "" == false "" == 0 0 == 0 true TONUMBER APPLIED TO THE STRING TYPE A StringNumericLiteral that is empty or contains only white space is converted to +0.

22 [] == false [] == 0 "" == 0 0 == 0 true

23 Matthias an PPK: Dein Buch hat einen Fehler! PPK an Matthias: Nein! Verwende explizite Typkonvertierung

24 LÖSUNG Algorithmus auswendig lernen LÖSUNG (TYP ERZWINGEN) Boolean("0") === true LÖSUNG (VERGLEICHEN) "0" === false Ist === eine Äquivalenzrelation?

25 [5, 10, 1].sort()» [1, 10, 5]

26 ARRAY.PROTOTYPE.SORT (COMPAREFN) When the SortCompare abstract operation is called with two arguments j and k, the following steps are taken: 1. Let jstring be ToString(j). 2. Let kstring be ToString(k). Äpfel, Birnen..., diesmal Strings

27 LÖSUNG [5, 10, 1].sort(function (a, b) { return a - b; });

28 null == undefined» true CC-BY-SA

29 4.3.9 UNDEFINED VALUE primitive value used when a variable has not been assigned a value Null Value primitive value that represents the intentional absence of any object value

30 UNDEFINED var a; arr[2014] NULL "enterjs".match(/\d/); new Date("foo").toJSON();

31 GEMEINSAMKEITEN Sind ähnlich (==) Sind falsy UNTERSCHIEDE Konvertierung in Number/String JSON kennt nur null

32 undefined = 3» 3 typeof null» "object"

33 3.toString(2)» SyntaxError 3..toString(2)» "11" CC-BY

34 7 LEXICAL CONVENTIONS The source text is scanned from left to right, repeatedly taking the longest possible sequence of characters as the next input element.

35 7.8.3 NUMERIC LITERALS DecimalLiteral :: DecimalIntegerLiteral. DecimalDigits opt ExponentPart. DecimalDigits ExponentPart opt DecimalIntegerLiteral ExponentPart opt opt

36 3. tostring (2) 3..toString (2)

37 var a = 10, b = 20; a+b» 30 a++b» SyntaxError a+++b» 30 CC-PD

38 a + b a++ b a++ + b

39 ALLES GUT MIT ===? Nein, es gibt ja noch < und Verwandte

40 "536.26" > » true

41 THE ABSTRACT RELATIONAL COMPARISON ALGORITHM 3. If it is not the case that both Type(px) is String and Type(py) is String, then a. Let nx be the result of calling ToNumber(px). [...] b. Let ny be the result of calling ToNumber(py). Äpfel, Birnen..., diesmal Zahlen

42 Bug in Safari, ab Webkit-Version Version aus dem User-Agent (böse, ich weiß) Vergleich mit Zahl

43 klappt wunderbar, bis... "Mozilla/5.0 (Macintosh; Intel Mac OS X 1084) AppleWebKit/ (KHTML like Gecko) Version/6.0.5 Safari/ " " " > » false

44 Number(" ")» NaN parsefloat(" ")» 536.3

45 console.log( );» parseint( )» 1 CC-BY

46 > 2 53 IEEE 754: Runden zur nächstgelegenen Zahl

47 PARSEINT (STRING, RADIX) 1. Let inputstring be ToString(string).

48 String( )» "1e+21" parseint("1e+21")» 1

49 IEEE 754 Dyn. Typ. Syntax "0" == false 3..toString(2) NaN [5, 10, 1].sort() a+++b null == undefined parseint("1e+21") " " >

50 JAVASCRIPT HAT GENAU ZWEI WTFS: 1. IEEE Dynamische Typisierung

51 LEKTÜRE Weitere WTFs: wtfjs.com ECMAScript online: gedruckte Version kostenlos bestellen: ecma-international.org/publications/getit.php