Because JavaScript is loosely typed, there needs to be a way to determine the data type of a given variable.
The typeof
operator provides a way to determine the data type of a given variable.
Using the typeof
operator on a value returns one of the following strings:
"undefined"
if the value is undefined"boolean"
if the value is a boolean"string"
if the value is a string"number"
if the value is a number"object"
if the value is an object or null"function"
if the value is a function
typeof undefined; // "undefined" typeof null; // "object" typeof true; // "boolean" typeof 'false'; // "string" typeof 'hello'; // "string" typeof 42; // "number" typeof 1.4142135; // "number" typeof {key: 'value' }; // "object" typeof Math.sin; // "function" typeof function () {}; // "function"
because
typeof
is an operator and not a function
no parentheses are required (although they can be used)typeof('hello'); //OK typeof 'hello'; //OKbecause special value
null
is considered an empty object reference
typeof null
returns"object"
typeof null; // "object"although functions are considered objects and don’t represent another data type
they do have some special properties, which differentiate them from other objects:
typeof
applied to a function returns"function"
not"object"
typeof function(){}; // "function"
Unary operators are operators that work on only one value.
They are the simplest operators in JavaScript.
The increment operator is represented by ++
and increments the value by 1;
the decrement operator is represented by --
and decrements the value by 1.
The increment and decrement operators can be used in two versions, prefix and postfix:
- the prefix versions of the operators are placed before the variable they work on,
and is applied before the statement is evaluated; - the postfix versions of the operators are placed after the variable,
and is applied after the statement is evaluated.
increments the input value by 1 before the statement is evaluated.
var a = 123; var b = ++a; a; //124 b; //124
increments the input value by 1 after the statement is evaluated.
var a = 123; var b = a++; a; //124 b; //123
decremented the input value by 1 before the statement is evaluated.
var a = 123; var b = --a; b; //122 a; //122
decremented the input value by 1 after the statement is evaluated.
var a = 123; var b = a--; b; //123 a; //122
When used on a nonnumeric value, these operators convert the value to a number and then apply the change:
- when used on a string that is a valid number, convert to a number and apply the change;
the variable is changed from a string to a number - when used on a string that is not a valid number, convert to
NaN
;
the variable is changed from a string to a number - when used on a boolean, convert to a number (
false
in0
,true
in1
) and apply the change;
the variable is changed from a boolean to a number - when used on a floating-point value, apply the change;
the variable is just a number - when used on an object, call its
valueOf()
method to get a value to work with and apply the change;
the variable is changed from an object to a number
var s = "10"; ++s; //11var x = "hello"; ++x; //NaNvar b = true; ++b; //2var f = 0.07; ++f; 1.07;var o = { valueOf: function () { return 100; } }; ++o; //101
is represented by a single plus sign +
placed before a variable and returns its numeric value:
when used on a numeric values, it does nothing to a numeric value but return the value;
when used on a nonnumeric value, it converts the value to a number and return the result:
- when used on a string that is a valid number, convert to a number and return the result
- when used on a boolean, convert to a number (
false
in0
,true
in1
) and return the result - when used on an object, call its
valueOf()
method to get a value to work with and return the result
var n = 25;
n = +n; //still 25
var s = "01";
s = +s; //value becomes numeric 1
var s = "1.1";
s = +s; //value becomes numeric 1.1
var s = "z";
s = +s; //value becomes NaN
var b = false;
b = +b; //value becomes numeric 0
var f = 1.1;
f = +f; //still 1.1
var o = { valueOf: function () { return 1; } };
o = +o; //value becomes numeric 1
is represented by the character minus -
placed before a value and simply negate it:
when used on a numeric value, it simply negates the value;
when used on nonnumeric values, it applies all of the same rules as unary plus and then negates the result.
var n = 25;
n = -n; //-25
var s = "01";
s = -s; //value becomes numeric -1
var s = "1.1";
s = -s; //value becomes numeric -1.1
var s = "z";
s = -s; //value becomes NaN
var b = false;
b = -b; //value becomes numeric 0
var f = 1.1;
f = -f; //value becomes -1.1
var o = { valueOf: function () { return 1; } };
o = -o; //value becomes numeric -1
is represented by the tilde character ~
and simply returns the one’s complement of the number.
var num1 = 25; //binary 0000 0000 0000 0000 0000 0000 0001 1001
var num2 = ~num1; //binary 1111 1111 1111 1111 1111 1111 1110 0110
console.log(num2); //-26
is represented by the ampersand character &
and works on two values;
it lines up the bits in each number and then performs an AND operation between the bits in the same position.
var a = 25; //binary 0000 0000 0000 0000 0000 0000 0001 1001
var b = 11; //binary 0000 0000 0000 0000 0000 0000 0000 1011
var c = a & b; //binary 0000 0000 0000 0000 0000 0000 0000 1001
console.log(c); //9
is represented by the pipe character |
and works on two values;
it lines up the bits in each number and then performs an OR operation between the bits in the same position.
var a = 25; //binary 0000 0000 0000 0000 0000 0000 0001 1001
var b = 11; //binary 0000 0000 0000 0000 0000 0000 0000 1011
var c = a | b; //binary 0000 0000 0000 0000 0000 0000 0001 1011
console.log(c); //27
is represented by the caret character ^
and works on two values;
it lines up the bits in each number and then performs a XOR operation between the bits in the same position.
var a = 25; //0000 0000 0000 0000 0000 0000 0001 1001
var b = 3; //0000 0000 0000 0000 0000 0000 0000 0011
var c = a ^ b; //0000 0000 0000 0000 0000 0000 0001 1010
console.log(c); //26
is represented by !
and negate the boolean value.
!true; //false
!false; //true
when used on a non-boolean value, it converts the value to a boolean and return the result;
most values convert to true
with the exception of the following (which convert to false
):
- the empty string
""
null
undefined
- the number
0
- the number
NaN
- the boolean
false
If you use the logical NOT twice, you get the original value.
Use double negation to easily convert any value to its boolean equivalent.!!false; //false !!""; //false !!null; //false !!undefined; //false !!0; //false !!NaN; //false !!true; //true !!"0"; //true !!1; //true
is represented by &&
and returns the logical AND of the operands.
true && true; //true
true && false; //false
false && true; //false
false && false; //false
is represented by ||
and returns the logical OR of the operands.
true || true; //true
true || false; //true
false || true; //true
false || false; //false
If you mix logical operators in the same expression,
you should use parentheses to clarify how you intend the operation to work.false && false || true && true; //true false && (false || true) && true; //falseAssuming there are no parentheses that demand otherwise,
!
is executed first, then comes&&
and finally||
.false && false || true && true; //true (false && false) || (true && true); //trueUse parentheses instead of relying on operator precedence,
in order to make your code easier to read and understand.
is represented by an asterisk *
and is used, as one might suspect, to multiply two numbers:
- if the operands are numbers, performs regular arithmetic multiplication
- if the result cannot be represented, the result is
Infinity
or–Infinity
- if either operand is
NaN
, the result isNaN
- if
Infinity
is multiplied by zero, the result isNaN
- if
Infinity
is multiplied by a nonzero finite number, the result isInfinity
or-Infinity
,
depending on the sign of the number - if
Infinity
is multiplied byInfinity
, the result isInfinity
- if either operand isn’t a number, it is converted to a number using Number()
and then the other rules are applied
6 * 8; //48
1e308 * 2; //Infinity
NaN * 3; //NaN
Infinity * 0; //NaN
Infinity * 1; //Infinity
Infinity * -2; //-Infinity
Infinity * Infinity; //Infinity
"3" * true; //3
is represented by a slash /
and divides the first operand by the second operand:
- if the operands are numbers, regular arithmetic division is performed
- if the result can’t be represented, the result is
Infinity
or–Infinity
- if either operand is
NaN
, the result isNaN
- if
Infinity
is divided byInfinity
, the result isNaN
- if zero is divided by zero, the result is
NaN
- if a nonzero finite number is divided by zero, the result is
Infinity
or–Infinity
,
depending on the sign of the first operand - if
Infinity
is divided by any number, the result isInfinity
or–Infinity
,
depending on the sign of the second operand - if either operand isn’t a number, it is converted to a number using Number()
and then the other rules are applied
25 / 2; //12.5
NaN / 3; //NaN
0 / 0; //NaN
1 / 0; //Infinity
Infinity / 0; //Infinity
Infinity / 1; //Infinity
Infinity / -2; //-Infinity
Infinity / Infinity; //NaN
"3" / true; //3
is represented by a percent sign %
and return the remainder of the division:
- if the operands are numbers, regular arithmetic division is performed,
and the remainder of that division is returned. - if the dividend is an infinite number and the divisor is a finite number, the result is
NaN
- if the dividend is a finite number and the divisor is
0
, the result isNaN
- if
Infinity
is divided byInfinity
, the result isNaN
- if the dividend is a finite number and the divisor is an infinite number, the result is the dividend
- if the dividend is zero and the divisor is nonzero, the result is zero
- if either operand isn’t a number, it is converted to a number using Number()
and then the other rules are applied
is represented by +
and is used just as one would expect:
- if either operand is
NaN
, the result isNaN
- if
Infinity
is added toInfinity
, the result isInfinity
- if
–Infinity
is added to–Infinity
, the result is–Infinity
- if
Infinity
is added to–Infinity
, the result isNaN
- if
+0
is added to+0
, the result is+0
- if
–0
is added to+0
, the result is+0
- if
–0
is added to–0
, the result is–0
- if one of the operands is a string
- if both operands are strings, the second string is concatenated to the first
- if only one operand is a string, the other operand is converted to a string
and the result is the concatenation of the two strings - if either operand is an object, number, or boolean, it is converted to a string calling its
toString()
method
and then the other rules regarding strings are applied - if either operand is
undefined
ornull
, it is converted to"undefined"
or"null"
and then the other rules regarding strings are applied
Infinity + Infinity; //Infinity
-Infinity + -Infinity; //-Infinity
Infinity + -Infinity; //NaN
0 + 0; //0
-0 + 0; //0
-0 + -0; //-0
1 / (-0 + -0); //-Infinity
5 + 5; //10
5 + "5"; //"55"
true + "5"; //"true5"
is represented by -
and is used just as one would expect:
- if the two operands are numbers, perform arithmetic subtract and return the result
- if either operand is
NaN
, the result isNaN
- if
Infinity
is subtracted fromInfinity
, the result isNaN
- if
–Infinity
is subtracted from–Infinity
, the result isNaN
- if
–Infinity
is subtracted fromInfinity
, the result isInfinity
- if
Infinity
is subtracted from–Infinity
, the result is–Infinity
- if
+0
is subtracted from+0
, the result is+0
- if
–0
is subtracted from+0
, the result is–0
- if
–0
is subtracted from–0
, the result is+0
- if either operand is a string, a boolean,
null
, orundefined
,
it is converted to a number usingNumber()
and the arithmetic subtract is performed - if either operand is an object, its valueOf() method is called to retrieve a numeric value to represent it
and the arithmetic subtract is performed - if the object doesn’t have
valueOf()
defined, thentoString()
is called and the resulting string is converted into a number
5 - true; //4 because true is converted to 1
NaN - 1; //NaN
5 - 3; //2
5 - ""; //5 because "" is converted to 0
5 - "2"; //3 because "2" is converted to 2
5 - null; //5 because null is converted to 0
The relational operators perform comparisons between values:
- less-than
<
- greater-than
>
- less-than-or-equal-to
<=
- greater-than-or-equal-to
>=
When using different data types:
- if the operands are numbers, perform a numeric comparison
- if the operands are strings, compare the character codes of each corresponding character in the string
- if one operand is a number, convert the other operand to a number and perform a numeric comparison
- if an operand is an object, call
valueOf()
and use its result to perform the comparison,
ifvalueOf()
is not available, calltoString()
and use its result to perform the comparison - if an operand is a boolean, convert it to a number and perform the comparison
The equal operator is represented by ==
, and returns true
if the operands are equal.
The not-equal operator is represented by !=
, and returns true
if two operands are not equal.
Both operators do conversions to determine if two operands are equal:
- if an operand is a boolean, convert to a number (
false
in0
,true
in1
) and check for equality - if one operand is a string and the other is a number, convert the string to a number and check for equality
- if either one of the operands is an object and the other is not,
callvalueOf()
on the object and use its result to check for equality null
andundefined
are equalnull
andundefined
cannot be converted into any other values for equality checking- if either operand is
NaN
, the equal operator returnsfalse
and the not-equal operator returnstrue
- if both operands are
NaN
, the equal operator returnsfalse
because, by rule,NaN
is not equal toNaN
- if both operands are objects, then they are compared to see if they are the same object,
if both operands point to the same object, then the equal operator returnstrue
, otherwisefalse
null == undefined; //true
"NaN" == NaN; //false
5 == NaN; //false
NaN == NaN; //false
NaN != NaN; //true
false == 0; //true
true == 1; //true
true == 2; //false
undefined == 0; //false
null == 0; //false
"5" == 5; //true
The identically equal and not identically equal operators do the same thing as equal and not equal,
except that they do not convert operands before testing for equality.
The identically equal operator is represented by ===
and returns true
only if the operands are equal without conversion.
The not identically equal operator is represented !==
and returns true
only if the operands are not equal without conversion
"55" == 55; //true - equal because of conversion
"55" === 55; //false - not equal because different data types
"55" != 55; //false - equal because of conversion
"55" !== 55; //true - not equal because different data types
null == undefined
istrue
because they are similar values,
null === undefined
isfalse
because they are not the same type.
Because of the type conversion issues with the equal and not-equal operators,
use identically equal and not identically equal instead,
in order to maintain data type integrity throughout your code.
The conditional operator (also called ternary operator) is represented by ?
and :
and return one of two values depending on the evaluation of a boolean expression:
- if the boolean expression is
true
, return value defined after?
- if the boolean expression is
false
, return value defined after:
boolean_expression ? true_value : false_value;
var max = (num1 > num2) ? num1 : num2;
is represented by =
and simply assigns the value on the right to the variable on the left.
var variable = value;
exist for each of the major mathematical operations and a few others as well:
- multiply/assign
*=
- divide/assign
/=
- modulus/assign
%=
- add/assign
+=
- subtract/assign
-=
- left shift/assign
<<=
- signed right shift/assign
>>=
- unsigned right shift/assign
>>>=
Compound-assignment operators are designed specifically as shorthand ways of achieving operations,
they do not represent any performance improvement.
allows execution of more than one operation in a single statement.
Comma operator can be used in the declaration of variables
var a, b = 1, c = 2; a; //undefined b; //1 c; //2Comma operator can be used to assign value to a variable,
it returns the last item in the expression.var n = (0, 1, 2, 3, 4, 5); n; //5