Aug
25
Javascript is a very flexible language, I made a compilation of some edge cases that you may have encountered while programming. The main goal is to point out some interesting specific behaviors.
Concatenation
1] var result = [10] + 1; |
Explanation:
The Array doesn't have a toNumber method, instead it has a toString method: [10] + 1 becomes "10" + 1.
String has a greater priority over Number with the + operator: "10" + 1 becomes "10" + "1" = "101"
The Array doesn't have a toNumber method, instead it has a toString method: [10] + 1 becomes "10" + 1.
String has a greater priority over Number with the + operator: "10" + 1 becomes "10" + "1" = "101"
2] var result = ['a', 'b', 'c'] + ""; |
Explanation:
The Array.toString method concatenates all it's elements (converted to string) with the "," separator.
The Array.toString method concatenates all it's elements (converted to string) with the "," separator.
3] var result = 'a' + 5; |
Explanation:
In Javascript, String has a greater priority than Number for the + operator, so 5 is converted to string before being concatenated.
In PHP, the
In C, a
In Javascript, String has a greater priority than Number for the + operator, so 5 is converted to string before being concatenated.
In PHP, the
+
operator is only the addition so 'a'
is converted to number (gives 0
) before being added.In C, a
char
and an integer
are of the same type. 'a'
is first converted to it's Ascii value (gives 65
) before being added.
Operations
4] var result = 3.75 | 0; |
Explanation:
|0
is a fast way to do a Math.floor
for positive integers.
5] var result = 65 / 'a'; |
Explanation:
A division by 0 does not throw an error but results the object
/
is only defined for Numbers so 'a'
is first converted to a number (gives 0
).A division by 0 does not throw an error but results the object
NaN
(Not a Number).
Objects
6] var ob = {"10": 1}; ob[10] = 2; ob[[1, 0]] = 3; var result = ob["10"] + ob[10] + ob[[1, 0]]; |
Explanation:
Objects keys are strings. If you don't provide a string, it will convert the key to string.
Objects keys are strings. If you don't provide a string, it will convert the key to string.
"10"
and 10
gives "10"
[1, 0]
gives "1,0"
7] var $ = {"": String}; var result = !!$[([])](); |
Explanation:
Parenthesis inside the key part are useless:
Objects key are first converted to string.
It is possible to have the empty string
$
is a valid variable name.Parenthesis inside the key part are useless:
array[(1+2)]
is the same thing as array[1+2]
.Objects key are first converted to string.
[].toString()
is ""
.It is possible to have the empty string
""
as an object key.$[""]
is the String
object. String(val)
returns val.toString()
. String()
returns ""
.!
is the negation operator. "" == false
, so !"" == true
, !!"" == false
!!expr
is a fast way to typecast an expression to a boolean.
Equality
8] var result = (' \t\r\n ' == 0); |
Explanation:
Unlike PHP, strings wrapped around simple quote
When compared to a number value, a string will be converted to a number. If it contains only spacing characters it will be converted to
Unlike PHP, strings wrapped around simple quote
'
are also parsed. '\t' == "\t"
When compared to a number value, a string will be converted to a number. If it contains only spacing characters it will be converted to
0
. If a string cannot be parsed as a number it will return NaN
(Note that NaN != NaN
).
9] var a = new String("123"); var b = "123"; var result = (a === b); |
Explanation:
When creating an object with the
When creating an object with the
new
operator, the result type is always "object"
. The type of "123"
is "string"
so the type does not match for ===
.
10] var a = {key: 1}; var b = {key: 1}; var result = (a == b); |
Explanation:
Object comparison is only done with the pointers behind the objects.
Object comparison is only done with the pointers behind the objects.
If you liked this article, you might be interested in my Twitter feed as well.