JavaScript Training
Goal Trainers Format
• Lecture
• Exercises
• Ask Questions!
• bitovi/js-training
=== and ==
21 == "21"
undefined == null
undefined === null
21 === 21
{} === {}
NaN === NaN
true == {valueOf: function(){return "1"}}
✓
✓
✓
✓
❌
❌
❌
Address Value
…. ….
x1001 call-object
x1002 str1
x1003 x2001
x1004 str2
x1005 x2101
…. ….
x2001 STRING
x2002 hi
…. ….
x2101 STRING
x2102 hi
=== with primitives
var str1 = "hi";
var str2 = "hi";
str1 === str2
✓
var obj1 = {};
var obj2 = {};
obj1 === obj2
❌
Address Value
…. ….
x1001 call-object
x1002 obj1
x1003 x2001
x1004 obj2
x1005 x2101
…. ….
x2001 OBJECT
x2002 0
…. ….
x2101 OBJECT
x2102 0
=== with objects
Types the same?
x==y
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
true==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
true==({toString: function(){return "1"}})
Types the same?
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
true==({toString: function(){return "1"}})
Types the same?
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
true==({toString: function(){return "1"}})
Types the same?
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
true==({toString: function(){return "1"}})
Types the same?
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
true==({toString: function(){return "1"}})
Types the same?
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
true==({toString: function(){return "1"}})
Types the same?
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
string== number?
boolean == anything
1 == ({toString:function(){return"1"}})
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1==({toString: function(){return "1"}})
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
string== number?
boolean == anything
1=="1"
Types the same?
1 == "1"
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1 == "1"
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1 == "1"
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1 == "1"
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Types the same?
1 == "1"
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
string== number?
boolean == anything
1==1
Types the same?
1 == 1
Both null or undefined?
object == string or number?
undefined -> NaN
null -> 0
true -> 1
false -> 0
string -> # || NaN
.toString()
.valueOf()
===
true
false
==
==
string== number?
boolean == anything
Summary
type coercion craziness
primitive?
bitwise comparison address comparison
===
==
Types the same?
false

Comparisons

  • 1.
    JavaScript Training Goal TrainersFormat • Lecture • Exercises • Ask Questions! • bitovi/js-training
  • 2.
  • 3.
    21 == "21" undefined== null undefined === null 21 === 21 {} === {} NaN === NaN true == {valueOf: function(){return "1"}} ✓ ✓ ✓ ✓ ❌ ❌ ❌
  • 4.
    Address Value …. …. x1001call-object x1002 str1 x1003 x2001 x1004 str2 x1005 x2101 …. …. x2001 STRING x2002 hi …. …. x2101 STRING x2102 hi === with primitives var str1 = "hi"; var str2 = "hi"; str1 === str2 ✓
  • 5.
    var obj1 ={}; var obj2 = {}; obj1 === obj2 ❌ Address Value …. …. x1001 call-object x1002 obj1 x1003 x2001 x1004 obj2 x1005 x2101 …. …. x2001 OBJECT x2002 0 …. …. x2101 OBJECT x2102 0 === with objects
  • 6.
    Types the same? x==y Bothnull or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 7.
    Types the same? true==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 8.
    true==({toString: function(){return "1"}}) Typesthe same? Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 9.
    true==({toString: function(){return "1"}}) Typesthe same? Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 10.
    true==({toString: function(){return "1"}}) Typesthe same? Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 11.
    true==({toString: function(){return "1"}}) Typesthe same? Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 12.
    true==({toString: function(){return "1"}}) Typesthe same? Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 13.
    true==({toString: function(){return "1"}}) Typesthe same? Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == string== number? boolean == anything 1 == ({toString:function(){return"1"}})
  • 14.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 15.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 16.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 17.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 18.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 19.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 20.
    Types the same? 1==({toString:function(){return "1"}}) Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == string== number? boolean == anything 1=="1"
  • 21.
    Types the same? 1== "1" Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 22.
    Types the same? 1== "1" Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 23.
    Types the same? 1== "1" Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 24.
    Types the same? 1== "1" Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 25.
    Types the same? 1== "1" Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == string== number? boolean == anything 1==1
  • 26.
    Types the same? 1== 1 Both null or undefined? object == string or number? undefined -> NaN null -> 0 true -> 1 false -> 0 string -> # || NaN .toString() .valueOf() === true false == == string== number? boolean == anything
  • 27.
    Summary type coercion craziness primitive? bitwisecomparison address comparison === == Types the same? false

Editor's Notes

  • #3 I think the key to JavaScript is really understanding what’s going on in memory. And the key to understanding what’s going on in memory is understanding what JS’s basic data types look like in memory and how JS’s operators are used to manipulate those data structures.
  • #4 Here I’ve created an object with an age property of 30. I create a variable to hold that person’s age and update it to 31, but if I read me.age, I get back 30 .. why?