Q's Flashcards

1
Q

What’s the difference between undefined and not defined in JavaScript?

A

In JavaScript if you try to use a variable that doesn’t exist and has not been declared, then JavaScript will throw an error var name is not defined and the script will stop executing thereafter. But If you use typeof undeclared_variable then it will return undefined.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

var x = 1

A

is both declaration and definition, here declaration and assignment of value happen inline for variable x—what we are doing is called “initialization”.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

hoisting

A

In JavaScript both variable declarations and function declarations go to the top of the scope in which they are declared, then assignment happens

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

A variable can be declared but not defined. When we try to access it, It will result undefined

A

var x; // Declaration

typeof x === ‘undefined’; // Will return true

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

For which value of x the results of the following statements are not the same?
if( x <= 100 ) {…}
if( !(x > 100) ) {…}

A

NaN <= 100 is false and NaN > 100 is also false, so if the value of x is NaN, the statements are not the same.

The same holds true for any value of x that being converted to type Number, returns NaN, e.g.: undefined, [1,2,5], {a:22} , etc.

This is why you need to pay attention when you deal with numeric variables. NaN can’t be equal, less than or more than any other numeric value, so the only reliable way to check if the value is NaN, is to use the isNaN() function.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What is the drawback of declaring methods directly in JavaScript objects?

A

One of the drawbacks of declaring methods directly in JavaScript objects is that they are very memory inefficient. When you do that, a new copy of the method is created for each instance of an object.

var Employee = function (name, company, salary) {

this. name = name || “”;
this. company = company || “”;
this. salary = salary || 5000;

  // We can create a method like this:
  this.formatSalary = function () {
      return "$ " + this.salary;
  };
};
// Alternatively we can add the method to Employee's prototype:
Employee.prototype.formatSalary2 = function() {
    return "$ " + this.salary;
}
//creating objects
var emp1 = new Employee('Yuri Garagin', 'Company 1', 1000000);
var emp2 = new Employee('Dinesh Gupta', 'Company 2', 1039999);
var emp3 = new Employee('Erich Fromm', 'Company 3', 1299483);

In this case each instance variable emp1, emp2, emp3 has its own copy of theformatSalary method. However the formatSalary2 will only be added once to Employee.prototype

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is “closure” in javascript? Can you provide an example?

A

A closure is a function defined inside another function (called parent function) and as such it has access to the variables declared and defined within its parent function’s scope.

The closure has access to the variables in three scopes:

Variable declared in its own scope
Variable declared in its parent function’s scope
Variable declared in the global namespace

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Write a mul function which will work properly when invoked with following syntax.

console. log(mul(2)(3)(4)); // output : 24
console. log(mul(4)(3)(4)); // output : 48

A
function mul (x) {
  return function (y) { // anonymous function
    return function (z) { // anonymous function
      return x * y * z;
    };
  };
}

Here the mul function accepts the first argument and returns an anonymous function which then takes the second parameter and returns one last anonymous function which finally takes the third and final parameter; the last function then multiplies x, y and z, and returns the result of the operation.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

How to empty an array in JavaScript?

var arrayList = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];

A

Method 1
arrayList = [];
The code above will set the variable arrayList to a new empty array. This is recommended if you don’t have references to the original array arrayList anywhere else because It will actually create a new empty array. You should be careful with this way of empty the array, because if you have referenced this array from another variable, then the original reference array will remain unchanged, Only use this way if you have only referenced the array by its original variable arrayList.

For instance:

var arrayList = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]; // Created array
var anotherArrayList = arrayList; // Referenced arrayList by another variable
arrayList = []; // Empty the array
console.log(anotherArrayList); // Output [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]

Method 2
arrayList.length = 0;
The code above will clear the existing array by setting its length to 0. This way of emptying an array will also update all the reference variables that point to the original array.

For instance:

var arrayList = ['a', 'b', 'c', 'd', 'e', 'f']; // Created array
var anotherArrayList = arrayList;  // Referenced arrayList by another variable
arrayList.length = 0; // Empty the array by setting length to 0
console.log(anotherArrayList); // Output []

Method 3
arrayList.splice(0, arrayList.length);
Above implementation will also work perfectly. This way of empty the array will also update all the references of the original array.

var arrayList = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]; // Created array
var anotherArrayList = arrayList; // Referenced arrayList by another variable
arrayList.splice(0, arrayList.length); // Empty the array by setting length to 0
console.log(anotherArrayList); // Output []

Method 4
while(arrayList.length) {
  arrayList.pop();
}
Above implementation can also empty the array. But not recommended to use often.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

How to check if an object is an array or not?

A

The best way to find whether an object is instance of a particular class or not using toString method from Object.prototype

var arrayList = [1 , 2, 3];
One of the best use cases of type checking of an object is when we do method overloading in JavaScript. To understand this, let's say we have a method called greet which can take a single string and also a list of strings. To make our greet method workable in both situation we need to know what kind of parameter is being passed: is it single value or list of values?
function greet(param) {
  if() {
    // here have to check whether param is array or not
  }
  else {
  }
}
However, in the above implementation it might not necessary to check the type of the array, we can check for single value string and put array logic code in else block, let see below code for the same.
 function greet(param) {
   if(typeof param === 'string') {
   }
   else {
     // If param is of type array then this block of code would execute
   }
 }
Now it's fine we can go with the previous two implementations, but when we have a situation like a parameter can be single value, array, and object type then we will be in trouble.

Coming back to checking the type of an object, As we mentioned that we can use Object.prototype.toString

if(Object.prototype.toString.call(arrayList) === ‘[object Array]’) {
console.log(‘Array!’);
}
If you are using jQuery then you can also used jQuery isArray method:

if($.isArray(arrayList)) {
  console.log('Array');
} else {
  console.log('Not an array');
}
FYI jQuery uses Object.prototype.toString.call internally to check whether an object is an array or not.

In modern browser, you can also use:

Array.isArray(arrayList);

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What will be the output of the following code?

var output = (function(x) {
  delete x;
  return x;
})(0);

console.log(output);

A

The code above will output 0 as output. delete operator is used to delete a property from an object. Here x is not an object it’s local variable. delete operator doesn’t affect local variables.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What will be the output of the following code?

var x = 1;
var output = (function() {
  delete x;
  return x;
})();

console.log(output);

A

The code above will output 1 as output. delete operator is used to delete a property from an object. Here x is not an object it’s global variable of type number.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What will be the output of the following code?

var x = { foo : 1};
var output = (function() {
  delete x.foo;
  return x.foo;
})();

console.log(output);

A

The code above will output undefined as output. delete operator is used to delete a property from an object. Here x is an object which has foo as a property and from a self-invoking function, we are deleting the foo property of object x and after deletion, we are trying to reference deleted property foo which result undefined.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What will be the output of the following code?

var Employee = {
  company: 'xyz'
}
var emp1 = Object.create(Employee);
delete emp1.company
console.log(emp1.company);
A

The code above will output xyz as output. Here emp1 object got company as prototype property. delete operator doesn’t delete prototype property.
emp1 object doesn’t have company as its own property. you can test it console.log(emp1.hasOwnProperty(‘company’)); //output : false However, we can delete company property directly from Employee object using delete Employee.company or we can also delete from emp1 object using __proto__ property delete emp1.__proto__.company.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is undefined x 1 in JavaScript?

var trees = ["redwood", "bay", "cedar", "oak", "maple"];
delete trees[3];
A

When you run the code above and do console.log(trees); in chrome developer console then you will get ["redwood", "bay", "cedar", undefined × 1, "maple"]. - In the recent versions of Chrome you will see the word empty of undefined x 1. - When you run the same code in Firefox browser console then you will get ["redwood", "bay", "cedar", undefined, "maple"]
Clearly we can see that Chrome has its own way of displaying uninitialized index in arrays. However when you check trees[3] === undefined in any browser you will get similar output as true.

Note: Please remember that you need not check for the uninitialized index of the array in trees[3] === ‘undefined × 1’ it will give an error because ‘undefined × 1’ this is just way of displaying an uninitialized index of an array in chrome.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What will be the output of the following code?

var trees = ["xyz", "xxxx", "test", "ryan", "apple"];
delete trees[3];
console.log(trees.length);
A

The code above will output 5 as output. When we used delete operator for deleting an array element then, the array length is not affected by this. This holds even if you deleted all elements of an array using delete operator.
So when delete operator removes an array element that deleted element is no longer present in the array. In place of value at deleted index undefined x 1 in chrome and undefined is placed at the index. If you do console.log(trees) output [“xyz”, “xxxx”, “test”, undefined × 1, “apple”] in Chrome and in Firefox [“xyz”, “xxxx”, “test”, undefined, “apple”].

17
Q

What will be the output of the following code?

var bar = true;

console. log(bar + 0);
console. log(bar + “xyz”);
console. log(bar + true);
console. log(bar + false);

A

The code above will output 1, “truexyz”, 2, 1 as output. Here’s a general guideline for the plus operator:

Number + Number -> Addition
Boolean + Number -> Addition
Boolean + Boolean -> Addition
Number + String -> Concatenation
String + Boolean -> Concatenation
String + String -> Concatenation
18
Q

What will be the output of the following code?

var z = 1, y = z = typeof y;
console.log(y);
A

The code above will print string “undefined” as output. According to associativity rule operator with the same precedence are processed based on their associativity property of operator. Here associativity of the assignment operator is Right to Left so first typeof y will evaluate first which is string “undefined” and assigned to z and then y would be assigned the value of z. The overall sequence will look like that:

var z;
z = 1;
var y;
z = typeof y;
y = z;
19
Q

What will be the output of the following code?

// NFE (Named Function Expression)
var foo = function bar() { return 12; };
typeof bar();
A

The output will be Reference Error. To fix the bug we can try to rewrite the code a little bit:

Sample 1

var bar = function() { return 12; };
typeof bar();
or

Sample 2

function bar() { return 12; };
typeof bar();
The function definition can have only one reference variable as a function name, In sample 1 bar is reference variable which is pointing to anonymous function and in sample 2 we have function statement and bar is the function name.
var foo = function bar() {
  // foo is visible here
  // bar is visible here
  console.log(typeof bar()); // Works here :)
};
// foo is visible here
// bar is undefined here
20
Q
What is the difference between declaring a function in the formats listed below?
var foo = function() {
  // Some code
}
function bar () {
  // Some code
}
A

The main difference is that function foo is defined at run-time and is called a function expression, whereas function bar is defined at parse time and is called a function statement. To understand it better, let’s take a look at the code below :

// Run-Time function declaration
  foo(); // Call foo function here, It will give an error
  var foo = function() {
    console.log("Hi I am inside Foo");
  };
// Parse-Time function declaration
bar(); // Call bar function here, It will not give an Error
function bar() {
  console.log("Hi I am inside Foo");
}
21
Q

What is the output of the following?

bar();
(function abc(){console.log('something')})();
function bar(){console.log('bar got called')};
A

The output will be :

bar got called
something
Since the function is called first and defined during parse time the JS engine will try to find any possible parse time definitions and start the execution loop which will mean function is called first even if the definition is post another function.

22
Q

In which case the function definition is not hoisted in JavaScript?

A

Let’s take the following function expression

 var foo = function foo() {
     return 12;
 }
In JavaScript var-declared variables and functions are hoisted. Let's take function hoisting first. Basically, the JavaScript interpreter looks ahead to find all the variable declaration and hoists them to the top of the function where it's declared. For example:
foo(); // Here foo is still undefined
var foo = function foo() {
  return 12;
};
The code above behind the scene look something like this:
var foo = undefined;
foo(); // Here foo is undefined
foo = function foo() {
  // Some code stuff
}
var foo = undefined;
foo = function foo() {
  // Some code stuff
}
foo(); // Now foo is defined here
23
Q

What will be the output of the following code?

var salary = “1000$”;

(function () {
console.log(“Original salary was “ + salary);

var salary = “5000$”;

console.log(“My New Salary “ + salary);
})();

A

The code above will output: undefined, 5000$ because of hoisting. In the code presented above, you might be expecting salary to retain it values from outer scope until the point that salary was re-declared in the inner scope. But due to hoisting salary value was undefined instead. To understand it better have a look of the following code, here salary variable is hoisted and declared at the top in function scope. When we print its value using console.log the result is undefined. Afterwards the variable is redeclared and the new value “5000$” is assigned to it.

var salary = “1000$”;

(function () {
  var salary = undefined;
  console.log("Original salary was " + salary);

salary = “5000$”;

console.log(“My New Salary “ + salary);
})();

24
Q

What’s the difference between typeof and instanceof?

A

typeof is an operator that returns a string with the type of whatever you pass.

The typeof operator checks if a value belongs to one of the seven basic types: number, string, boolean, object, function, undefined or Symbol.

typeof(null) will return object.

instanceof is much more intelligent: it works on the level of prototypes. In particular, it tests to see if the right operand appears anywhere in the prototype chain of the left. instanceof doesn’t work with primitive types. The instanceof operator checks the current object and returns true if the object is of the specified type, for example:

var dog = new Animal();
dog instanceof Animal; // Output : true
Here dog instanceof Animal is true since dog inherits from Animal.prototype
var name = new String("xyz");
name instanceof String; // Output : true