Types
Javascript has types and subtypes of object. Array, Function, RegExp are not types but sub-type of object called natives. Truly, typeof [] returns object. string, number, boolean are types and those value called primitive value.
primitive value and Natives?
primitive value type
JavaScript has seven built-in types: null, undefined, boolean, number, string, object, symbol. They can be identified by the typeof operator.
string
number
boolean
null
undefined
object
symbol (ES6)
When you call typeof null, it returns object. However it is own primitive type null. It is not object and undefined as well.null and undefined are different. null is assigned mostly explicitly. undefined means any value is not assigned.
Symbol
Symbols are new to JavaScript in ECMAScript Edition 6. A Symbol is a unique and immutable primitive value and may be used as the key of an Object property (see below).
Built in Object (Natives)
String()
Number()
Boolean()
Array()
Object()
Function()
RegExp()
Date()
Error()
Symbol() -- added in ES6!
Natives are Built in Object create by constructor function and creates object which has sub type of object. Each prototype of [[prototype]] is object.
typeof [] === "object" // true
Every objects work like this.
What happened when you call methods onto primitive value.
var message = "a"
a.length; // 1
a.toUpperCase(); // "A"
var message contains primitive value "a" and type "string" which is not a object and does not have any method.
So what happened here is that "a" is convert to wrapped object which is called natives (native type).
Primitive and native is different.
var message = "Hello, Kei"
message instanceof String
This result is false because message is primitive value string.
Following code returns true.
var message = new String("Hello, Kei")
message instanceof String // true
You have to box the primitive value by wrapper native String which is object.
var a = new Boolean( false );
if (!a) {
console.log( "Oops" );
} else if (a) {
console.log( "a is truthy");
}
since a is wrapped by an object wrapper
var a = new Boolean( false );
// Boolean {[[PrimitiveValue]]: false} <- chrome
a is truthy because a contains object whose sub-type is Boolean.
Function
Function is very unique when it comes to prototype chain.
Function constructor function refers its own prototype Function.prototype and function refers same prototype Function.prototype
Function.__proto__ === Function.prototype // true
Object.__proto__ === Object.prototype // false
function Bar () {}
Function.constructor === Bar.constructor
Every functions Object() , Bar() , function sum() {} even Function() has a linkage to Function.prototype.
Every objects Function.prototype, {} has a linkage to Object.prototype
Function.prototype is a empty function that has property and methods.
typeof Function.prototype
// "function"
typeof Object.prototype
// "object"
Since function can have property, even if the type of function.prototype is function, it can have property.
function a () {};
a.name = "hello";
a.name // "hello";
But odd thing is thatFunction.prototype.__proto__ is equal to Object.prototype , which is same as other prototypes.
typeof Function.prototype
// "function"
typeof Function.prototype.__proto__
// object
Function.prototype.__proto__ === Object.prototype
// true
Coercing
What will this code output? console.log("122" + 344)?
the second operand is coerced into the type of the first operand in JS. So in this case, since the first operand is a string, the second one becomes a string. So "122" + "344" --
122344
Small Decimal
0.1 + 0.2 === 0.3; // false
Simply put, the representations for 0.1 and 0.2 in binary floating-point are not exact, so when they are added, the result is not exactly 0.3. It's really close: 0.30000000000000004, but if your comparison fails, "close" is irrelevant.
How do you unbox natives (wrapped object)?
If you get primitive value from the object, you can call valueOf() function.
var string = new String( "kei" );
var number = new Number( 28 );
var boolean = new Boolean( true );
string.valueOf(); // "kei"
number.valueOf(); // 28
boolean.valueOf(); // true
How do you check internal [[Class]] values? and what happened when you check type primitive value?
[[Class]] does not mean class oriented programming.
Object.prototype.toString.call( "abc" ); // "[object String]"
Object.prototype.toString.call( 42 ); // "[object Number]"
Object.prototype.toString.call( true ); // "[object Boolean]"
primitive value will boxed by natives.
What is the difference between == and ===?
short answer: == converts type of value but === is type sensitive.
The Strict Equality Comparison Algorithm (===)
value types, have the same value
.
0 == '0' // true
0 === '0' // false
null == undefined // true
null === undefined // false
true == 1; true
true === 1; false
var a = [1,2,3];
var b = [1,2,3];
a == b //false
a === b //false
var c = [1,2,3];
var d = c;
c == d // false
c === d // false
+0 === -0 // true
false == 0 // true
false === 0 // false
```
```
What's the difference between a variable that is: null, undefined, NaN or undeclared?
typeof null is "object" but typeof undefined is "undefined".
In JavaScript, undefined means a variable has been declared but has not yet been assigned a value, such as:
- How would you go about checking for any of these states?
- What is a potential pitfall with using
typeof bar === "object"to determine if bar is an object? How can this pitfall be avoided? Because bar could be null and null is also "Object" - NaN means “not a number”, its type is Number
- A variable whose value is null was explicitly given a value of null , which means that the variable was explicitly set to have no value.
console.log(typeof null); // Object
console.log(typeof undefined); // undefined
console.log(typeof NaN === "number"); // true
Difference between undefined and undeclared is that whether variable or function is declared or not. NaN is not invalid number but type is number.
var a;
console.log(a); // undefined
console.log(b); // RefereneceError b is not declared
The value of a variable with no value is undefined (i.e., it has not been initialized). Variables can be emptied by setting their value to null. You can test for each using the === (three equal signs) or == (two equal signs) for comparison checking. The big difference is the latter uses coercion, which can have some odd results — it returns true for a null or undefined comparison if they are either.
if (nullExample === null) { // executes this block only if null }
if (undExample === undefined) { // executes this block only if Undefined }
if (bothExampe == null) { // executes this block if Undefined or null }
You can be more exact with a comparison by using the typeof to return an object's type.
If (typeof variable === "undefined") { // executes this block of if undefined }
What's the difference between host objects and native objects?
Native objects: Object (constructor), Date, Math, parseInt, eval, string methods like indexOf and replace, array methods, ...
Host objects (assuming browser environment): window, document, location, history, XMLHttpRequest, setTimeout, getElementsByTagName, querySelectorAll,
Objects like window, XmlHttpRequest, DOM nodes and so on, which is provided by the browser environment.