Essential Javascript Interview Questions
Tags: interview, javascript
Published: 2020-01-11 08:22:00

<div class="Box-body">
        <article class="markdown-body entry-content p-5" itemprop="text">




<h2><a id="user-content-question-1-whats-the-difference-between-undefined-and-not-defined-in-javascript" class="anchor" aria-hidden="true" href="#question-1-whats-the-difference-between-undefined-and-not-defined-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 1. What's the difference between <code>undefined</code> and <code>not defined</code> in JavaScript</h2>
<h3><a id="user-content-answer" class="anchor" aria-hidden="true" href="#answer"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>In JavaScript if you try to use a variable that doesn't exist and has not been declared, then JavaScript will throw an error <code>var name is not defined</code> and the script will stop executing thereafter. But If you use <code>typeof undeclared_variable</code> then it will return <code>undefined</code>.</p>
<p>Before starting further discussion let's understand the difference between declaration and definition.</p>
<p><code>var x</code> is a declaration because you are not defining what value it holds yet, but you are declaring its existence and the need for memory allocation.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x; <span class="pl-c"><span class="pl-c">//</span> declaring x</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(x); <span class="pl-c"><span class="pl-c">//</span> output: undefined</span></pre></div>
<p><code>var x = 1</code> is both declaration and definition (also we can say we are doing initialisation), Here declaration and assignment of value happen inline for variable x, In JavaScript every variable declaration and function declaration brings to the top of its current scope in which it's declared then assignment happen in order this term is called <code>hoisting</code>.</p>
<p>A variable can be declared but not defined. When we try to access it, It will result <code>undefined</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x; <span class="pl-c"><span class="pl-c">//</span> Declaration</span>
<span class="pl-k">typeof</span> x <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span>; <span class="pl-c"><span class="pl-c">//</span> Will return true</span></pre></div>
<p>A variable can be neither declared nor defined. When we try to reference such variable then the result will be <code>not defined</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(y);  <span class="pl-c"><span class="pl-c">//</span> Output: ReferenceError: y is not defined</span></pre></div>
<h3><a id="user-content-ref-link" class="anchor" aria-hidden="true" href="#ref-link"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Ref Link:</h3>
<p><a href="http://stackoverflow.com/questions/20822022/javascript-variable-definition-declaration" rel="nofollow">http://stackoverflow.com/questions/20822022/javascript-variable-definition-declaration</a></p>
<h2><a id="user-content-question-2-for-which-value-of-x-the-results-of-the-following-statements-are-not-the-same" class="anchor" aria-hidden="true" href="#question-2-for-which-value-of-x-the-results-of-the-following-statements-are-not-the-same"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 2. For which value of <code>x</code> the results of the following statements are not the same?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>  if( x &lt;= 100 ) {...}</span>
<span class="pl-k">if</span>( <span class="pl-k">!</span>(x <span class="pl-k">&gt;</span> <span class="pl-c1">100</span>) ) {<span class="pl-k">...</span>}</pre></div>
<h3><a id="user-content-answer-1" class="anchor" aria-hidden="true" href="#answer-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p><code>NaN &lt;= 100</code> is <code>false</code> and <code>NaN &gt; 100</code> is also <code>false</code>, so if the
value of <code>x</code> is <code>NaN</code>, the statements are not the same.</p>
<p>The same holds true for any value of x that being converted to Number, returns NaN, e.g.: <code>undefined</code>, <code>[1,2,5]</code>, <code>{a:22}</code> , etc.</p>
<p>This is why you need to pay attention when you deal with numeric variables. <code>NaN</code> can’t be equal, less than or more than any other numeric value, so the only reliable way to check if the value is <code>NaN</code>, is to use <code>isNaN()</code> function.</p>
<h2><a id="user-content-question-3-what-is-the-drawback-of-declaring-methods-directly-in-javascript-objects" class="anchor" aria-hidden="true" href="#question-3-what-is-the-drawback-of-declaring-methods-directly-in-javascript-objects"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 3. What is the drawback of declaring methods directly in JavaScript objects?</h2>
<h3><a id="user-content-answer-2" class="anchor" aria-hidden="true" href="#answer-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>One of the drawback 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. Let's see it on example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">Employee</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">name</span>, <span class="pl-smi">company</span>, <span class="pl-smi">salary</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-pds">"</span></span>;       
  <span class="pl-c1">this</span>.<span class="pl-smi">company</span> <span class="pl-k">=</span> company <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-pds">"</span></span>;
  <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> salary <span class="pl-k">||</span> <span class="pl-c1">5000</span>;

  <span class="pl-c"><span class="pl-c">//</span> We can create a method like this:</span>
  <span class="pl-c1">this</span>.<span class="pl-en">formatSalary</span> <span class="pl-k">=</span> <span class="pl-k">function</span> () {
      <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>$ <span class="pl-pds">"</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-smi">salary</span>;
  };
};

<span class="pl-c"><span class="pl-c">//</span> we can also create method in Employee's prototype:</span>
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span>.<span class="pl-en">formatSalary2</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
    <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>$ <span class="pl-pds">"</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-smi">salary</span>;
}

<span class="pl-c"><span class="pl-c">//</span>creating objects</span>
<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Yuri Garagin<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Company 1<span class="pl-pds">'</span></span>, <span class="pl-c1">1000000</span>);
<span class="pl-k">var</span> emp2 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Dinesh Gupta<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Company 2<span class="pl-pds">'</span></span>, <span class="pl-c1">1039999</span>);
<span class="pl-k">var</span> emp3 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Erich Fromm<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Company 3<span class="pl-pds">'</span></span>, <span class="pl-c1">1299483</span>);</pre></div>
<p>Here each instance variable <code>emp1</code>, <code>emp2</code>, <code>emp3</code> has own copy of <code>formatSalary</code> method. However the <code>formatSalary2</code> will only be added once to an object <code>Employee.prototype</code>.</p>
<h2><a id="user-content-question-4-what-is-closure-in-javascript-can-you-provide-an-example" class="anchor" aria-hidden="true" href="#question-4-what-is-closure-in-javascript-can-you-provide-an-example"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 4. What is “closure” in javascript? Can you provide an example?</h2>
<h3><a id="user-content-answer-3" class="anchor" aria-hidden="true" href="#answer-3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>A closure is a function defined inside another function (called parent function) and has access to the variable which is declared and defined in parent function scope.</p>

<ul>
<li>Variable declared in his own scope</li>
<li>Variable declared in parent function scope</li>
<li>Variable declared in the global namespace</li>
</ul>
<p>The closure has access to the variable in three scopes:</p><div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> globalVar <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>abc<span class="pl-pds">"</span></span>;

<span class="pl-c"><span class="pl-c">//</span> Parent self invoking function</span>
(<span class="pl-k">function</span> <span class="pl-en">outerFunction</span> (<span class="pl-smi">outerArg</span>) { <span class="pl-c"><span class="pl-c">//</span> begin of scope outerFunction</span>
  <span class="pl-c"><span class="pl-c">//</span> Variable declared in outerFunction function scope</span>
  <span class="pl-k">var</span> outerFuncVar <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>x<span class="pl-pds">'</span></span>;    
  <span class="pl-c"><span class="pl-c">//</span> Closure self-invoking function</span>
  (<span class="pl-k">function</span> <span class="pl-en">innerFunction</span> (<span class="pl-smi">innerArg</span>) { <span class="pl-c"><span class="pl-c">//</span> begin of scope innerFunction</span>
    <span class="pl-c"><span class="pl-c">//</span> variable declared in innerFunction function scope</span>
    <span class="pl-k">var</span> innerFuncVar <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>y<span class="pl-pds">"</span></span>;
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(         
      <span class="pl-s"><span class="pl-pds">"</span>outerArg = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> outerArg <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>outerFuncVar = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> outerFuncVar <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>innerArg = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> innerArg <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>innerFuncVar = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> innerFuncVar <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>globalVar = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> globalVar);
  <span class="pl-c"><span class="pl-c">//</span> end of scope innerFunction</span>
  })(<span class="pl-c1">5</span>); <span class="pl-c"><span class="pl-c">//</span> Pass 5 as parameter</span>
<span class="pl-c"><span class="pl-c">//</span> end of scope outerFunction</span>
})(<span class="pl-c1">7</span>); <span class="pl-c"><span class="pl-c">//</span> Pass 7 as parameter</span></pre></div>
<p><code>innerFunction</code> is closure which is defined inside <code>outerFunction</code> and has access to all variable which is declared and defined in outerFunction scope. In addition to this function defined inside the function as closure has access to the variable which is declared in <code>global namespace</code>.</p>
<p>Output of above code would be:</p>
<div class="highlight highlight-source-js"><pre>outerArg <span class="pl-k">=</span> <span class="pl-c1">7</span>
outerFuncVar <span class="pl-k">=</span> x
innerArg <span class="pl-k">=</span> <span class="pl-c1">5</span>
innerFuncVar <span class="pl-k">=</span> y
globalVar <span class="pl-k">=</span> abc</pre></div>
<h2><a id="user-content-question-5-write-a-mul-function-which-will-work-properly-when-invoked-with-following-syntax" class="anchor" aria-hidden="true" href="#question-5-write-a-mul-function-which-will-work-properly-when-invoked-with-following-syntax"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 5. Write a mul function which will work properly when invoked with following syntax.</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)(<span class="pl-c1">4</span>)); <span class="pl-c"><span class="pl-c">//</span> output : 24</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">4</span>)(<span class="pl-c1">3</span>)(<span class="pl-c1">4</span>)); <span class="pl-c"><span class="pl-c">//</span> output : 48</span></pre></div>
<h3><a id="user-content-answer-4" class="anchor" aria-hidden="true" href="#answer-4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>Below is the code followed by the explanation of how it works:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span> (<span class="pl-smi">x</span>) {
  <span class="pl-k">return</span> <span class="pl-k">function</span> (<span class="pl-smi">y</span>) { <span class="pl-c"><span class="pl-c">//</span> anonymous function</span>
    <span class="pl-k">return</span> <span class="pl-k">function</span> (<span class="pl-smi">z</span>) { <span class="pl-c"><span class="pl-c">//</span> anonymous function</span>
      <span class="pl-k">return</span> x <span class="pl-k">*</span> y <span class="pl-k">*</span> z;
    };
  };
}</pre></div>
<p>Here the <code>mul</code> function accepts the first argument and returns the anonymous function which takes the second parameter and returns the anonymous function which takes the third parameter and returns the multiplication of arguments which is being passed in successive</p>
<p>In Javascript function defined inside has access to outer function variable and function is the first class object so it can be returned by the function as well and passed as an argument in another function.</p>
<ul>
<li>A function is an instance of the Object type</li>
<li>A function can have properties and has a link back to its constructor method</li>
<li>A function can be stored as variable</li>
<li>A function can be pass as a parameter to another function</li>
<li>A function can be returned from another function</li>
</ul>
<h2><a id="user-content-question-6-how-to-empty-an-array-in-javascript" class="anchor" aria-hidden="true" href="#question-6-how-to-empty-an-array-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 6. How to empty an array in JavaScript?</h2>
<p>For instance:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span>  [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>];</pre></div>
<p>How can we empty the array above?</p>
<h3><a id="user-content-answer-5" class="anchor" aria-hidden="true" href="#answer-5"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>There are a couple of ways by which we can empty an array, So let's discuss all the possible way by which we can empty an array.</p>
<h4><a id="user-content-method-1" class="anchor" aria-hidden="true" href="#method-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 1</h4>
<div class="highlight highlight-source-js"><pre>arrayList <span class="pl-k">=</span> [];</pre></div>
<p>The code above will set the variable <code>arrayList</code> to a new empty array. This is recommended if you don't have <strong>references to the original array</strong> <code>arrayList</code> 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 <code>arrayList</code>.</p>
<p>For instance:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>]; <span class="pl-c"><span class="pl-c">//</span> Created array</span>
<span class="pl-k">var</span> anotherArrayList <span class="pl-k">=</span> arrayList;  <span class="pl-c"><span class="pl-c">//</span> Referenced arrayList by another variable</span>
arrayList <span class="pl-k">=</span> []; <span class="pl-c"><span class="pl-c">//</span> Empty the array</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(anotherArrayList); <span class="pl-c"><span class="pl-c">//</span> Output ['a', 'b', 'c', 'd', 'e', 'f']</span></pre></div>
<h4><a id="user-content-method-2" class="anchor" aria-hidden="true" href="#method-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 2</h4>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span> <span class="pl-k">=</span> <span class="pl-c1">0</span>;</pre></div>
<p>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.</p>
<p>For instance:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>]; <span class="pl-c"><span class="pl-c">//</span> Created array</span>
<span class="pl-k">var</span> anotherArrayList <span class="pl-k">=</span> arrayList;  <span class="pl-c"><span class="pl-c">//</span> Referenced arrayList by another variable</span>
<span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span> <span class="pl-k">=</span> <span class="pl-c1">0</span>; <span class="pl-c"><span class="pl-c">//</span> Empty the array by setting length to 0</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(anotherArrayList); <span class="pl-c"><span class="pl-c">//</span> Output []</span></pre></div>
<h4><a id="user-content-method-3" class="anchor" aria-hidden="true" href="#method-3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 3</h4>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">arrayList</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">0</span>, <span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span>);</pre></div>
<p>Above implementation will also work perfectly. This way of empty the array will also update all the references of the original array.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>]; <span class="pl-c"><span class="pl-c">//</span> Created array</span>
<span class="pl-k">var</span> anotherArrayList <span class="pl-k">=</span> arrayList;  <span class="pl-c"><span class="pl-c">//</span> Referenced arrayList by another variable</span>
<span class="pl-smi">arrayList</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">0</span>, <span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span>); <span class="pl-c"><span class="pl-c">//</span> Empty the array by setting length to 0</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(anotherArrayList); <span class="pl-c"><span class="pl-c">//</span> Output []</span></pre></div>
<h4><a id="user-content-method-4" class="anchor" aria-hidden="true" href="#method-4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 4</h4>
<div class="highlight highlight-source-js"><pre><span class="pl-k">while</span>(<span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span>) {
  <span class="pl-smi">arrayList</span>.<span class="pl-c1">pop</span>();
}</pre></div>
<p>Above implementation can also empty the array. But not recommended to use often.</p>
<h2><a id="user-content-question-7-how-to-check-if-an-object-is-an-array-or-not" class="anchor" aria-hidden="true" href="#question-7-how-to-check-if-an-object-is-an-array-or-not"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 7. How to check if an object is an array or not?</h2>
<h3><a id="user-content-answer-6" class="anchor" aria-hidden="true" href="#answer-6"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The best way to find whether an object is instance of a particular class or not using <code>toString</code> method from <code>Object.prototype</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-c1">1</span> , <span class="pl-c1">2</span>, <span class="pl-c1">3</span>];</pre></div>
<p>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 <code>greet</code> which can take a single string and also a list of strings. To make our <code>greet</code> method workable in both situation we need to know what kind of parameter is being passed: is it single value or list of values?</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">greet</span>(<span class="pl-smi">param</span>) {
  <span class="pl-k">if</span>() {
    <span class="pl-c"><span class="pl-c">//</span> here have to check whether param is array or not</span>
  }
  <span class="pl-k">else</span> {
  }
}</pre></div>
<p>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.</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-k">function</span> <span class="pl-en">greet</span>(<span class="pl-smi">param</span>) {
   <span class="pl-k">if</span>(<span class="pl-k">typeof</span> param <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>string<span class="pl-pds">'</span></span>) {
   }
   <span class="pl-k">else</span> {
     <span class="pl-c"><span class="pl-c">//</span> If param is of type array then this block of code would execute</span>
   }
 }</pre></div>
<p>Now it's fine we can go with the previous two implementations, but when we have a situation like a parameter can be <code>single value</code>, <code>array</code>, and <code>object</code> type then we will be in trouble.</p>
<p>Coming back to checking the type of an object, As we mentioned that we can use <code>Object.prototype.toString</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">toString</span>.<span class="pl-c1">call</span>(arrayList) <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>[object Array]<span class="pl-pds">'</span></span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Array!<span class="pl-pds">'</span></span>);
}</pre></div>
<p>If you are using <code>jQuery</code> then you can also used jQuery <code>isArray</code> method:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-smi">$</span>.<span class="pl-en">isArray</span>(arrayList)) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Array<span class="pl-pds">'</span></span>);
} <span class="pl-k">else</span> {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Not an array<span class="pl-pds">'</span></span>);
}</pre></div>
<p>FYI jQuery uses <code>Object.prototype.toString.call</code> internally to check whether an object is an array or not.</p>
<p>In modern browser, you can also use:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Array</span>.<span class="pl-en">isArray</span>(arrayList);</pre></div>
<p><code>Array.isArray</code> is supported by Chrome 5, Firefox 4.0, IE 9, Opera 10.5 and Safari 5</p>
<h2><a id="user-content-question-8-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-8-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 8. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> output <span class="pl-k">=</span> (<span class="pl-k">function</span>(<span class="pl-smi">x</span>) {
  <span class="pl-k">delete</span> x;
  <span class="pl-k">return</span> x;
})(<span class="pl-c1">0</span>);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(output);</pre></div>
<h3><a id="user-content-answer-7" class="anchor" aria-hidden="true" href="#answer-7"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>0</code> as output. <code>delete</code> operator is used to delete a property from an object. Here <code>x</code> is not an object it's <strong>local variable</strong>. <code>delete</code> operator doesn't affect local variables.</p>
<h2><a id="user-content-question-9-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-9-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 9. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x <span class="pl-k">=</span> <span class="pl-c1">1</span>;
<span class="pl-k">var</span> output <span class="pl-k">=</span> (<span class="pl-k">function</span>() {
  <span class="pl-k">delete</span> x;
  <span class="pl-k">return</span> x;
})();

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(output);</pre></div>
<h3><a id="user-content-answer-8" class="anchor" aria-hidden="true" href="#answer-8"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>1</code> as output. <code>delete</code> operator is used to delete a property from an object. Here <code>x</code> is not an object it's <strong>global variable</strong> of type <code>number</code>.</p>
<h2><a id="user-content-question-10-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-10-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 10. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x <span class="pl-k">=</span> { foo <span class="pl-k">:</span> <span class="pl-c1">1</span>};
<span class="pl-k">var</span> output <span class="pl-k">=</span> (<span class="pl-k">function</span>() {
  <span class="pl-k">delete</span> <span class="pl-smi">x</span>.<span class="pl-smi">foo</span>;
  <span class="pl-k">return</span> <span class="pl-smi">x</span>.<span class="pl-smi">foo</span>;
})();

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(output);</pre></div>
<h3><a id="user-content-answer-9" class="anchor" aria-hidden="true" href="#answer-9"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>undefined</code> as output. <code>delete</code> operator is used to delete a property from an object. Here <code>x</code> is an object which has foo as a property and from a self-invoking function, we are deleting the <code>foo</code> property of object <code>x</code> and after deletion, we are trying to reference deleted property <code>foo</code> which result <code>undefined</code>.</p>
<h2><a id="user-content-question-11-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-11-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 11. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> Employee <span class="pl-k">=</span> {
  company<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz<span class="pl-pds">'</span></span>
}
<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(Employee);
<span class="pl-k">delete</span> <span class="pl-smi">emp1</span>.<span class="pl-smi">company</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">emp1</span>.<span class="pl-smi">company</span>);</pre></div>
<h3><a id="user-content-answer-10" class="anchor" aria-hidden="true" href="#answer-10"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>xyz</code> as output. Here <code>emp1</code> object got company as <strong>prototype</strong> property. delete operator doesn't delete prototype property.</p>
<p><code>emp1</code> object doesn't have <strong>company</strong> as its own property. you can test it <code>console.log(emp1.hasOwnProperty('company')); //output : false</code> However, we can delete company property directly from <code>Employee</code> object using <code>delete Employee.company</code> or we can also delete from <code>emp1</code> object using <code>__proto__</code> property <code>delete emp1.__proto__.company</code>.</p>
<h2><a id="user-content-question-12-what-is-undefined-x-1-in-javascript" class="anchor" aria-hidden="true" href="#question-12-what-is-undefined-x-1-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 12. What is <code>undefined x 1</code> in JavaScript</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> trees <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">"</span>redwood<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>bay<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>cedar<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>oak<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>maple<span class="pl-pds">"</span></span>];
<span class="pl-k">delete</span> trees[<span class="pl-c1">3</span>];</pre></div>
<h3><a id="user-content-answer-11" class="anchor" aria-hidden="true" href="#answer-11"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<ul>
<li>When you run the code above and do <code>console.log(trees);</code> in chrome developer console then you will get <code>["redwood", "bay", "cedar", undefined × 1, "maple"]</code>.</li>
<li>In the recent versions of Chrome you will see the word <code>empty</code> of <code>undefined x 1</code>.</li>
<li>When you run the same code in Firefox browser console then you will get <code>["redwood", "bay", "cedar", undefined, "maple"]</code></li>
</ul>
<p>Clearly we can see that Chrome has its own way of displaying uninitialized index in arrays. However when you check <code>trees[3] === undefined</code> in any browser you will get similar output as <code>true</code>.</p>
<p><strong>Note:</strong> Please remember that you need not check for the uninitialized index of the array in  <code>trees[3] === 'undefined × 1'</code> it will give an error because <code>'undefined × 1'</code> this is just way of displaying an uninitialized index of an array in chrome.</p>
<h2><a id="user-content-question-13-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-13-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 13. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> trees <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>xxxx<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>test<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>ryan<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>apple<span class="pl-pds">"</span></span>];
<span class="pl-k">delete</span> trees[<span class="pl-c1">3</span>];
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">trees</span>.<span class="pl-c1">length</span>);</pre></div>
<h3><a id="user-content-answer-12" class="anchor" aria-hidden="true" href="#answer-12"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>5</code> as output. When we used <code>delete</code> 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 <code>delete</code> operator.</p>
<p>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 <code>undefined x 1</code> in <strong>chrome</strong> and <code>undefined</code> is placed at the index. If you do <code>console.log(trees)</code> output <code>["xyz", "xxxx", "test", undefined × 1, "apple"]</code> in Chrome and in Firefox <code>["xyz", "xxxx", "test", undefined, "apple"]</code>.</p>
<h2><a id="user-content-question-14-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-14-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 14. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> bar <span class="pl-k">=</span> <span class="pl-c1">true</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-c1">0</span>);   
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>);  
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-c1">true</span>);  
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-c1">false</span>);</pre></div>
<h3><a id="user-content-answer-13" class="anchor" aria-hidden="true" href="#answer-13"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>1, "truexyz", 2, 1</code> as output. Here's a general guideline  for the plus operator:</p>
<ul>
<li>Number + Number  -&gt; Addition</li>
<li>Boolean + Number -&gt; Addition</li>
<li>Boolean + Boolean -&gt; Addition</li>
<li>Number + String  -&gt; Concatenation</li>
<li>String + Boolean -&gt; Concatenation</li>
<li>String + String  -&gt; Concatenation</li>
</ul>
<h2><a id="user-content-question-15-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-15-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 15. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> z <span class="pl-k">=</span> <span class="pl-c1">1</span>, y <span class="pl-k">=</span> z <span class="pl-k">=</span> <span class="pl-k">typeof</span> y;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(y);</pre></div>
<h3><a id="user-content-answer-14" class="anchor" aria-hidden="true" href="#answer-14"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will print string <code>"undefined"</code> 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 <code>Right to Left</code> so first <code>typeof y</code> will evaluate first which is string <code>"undefined"</code> and assigned to <code>z</code> and then <code>y</code> would be assigned the value of z. The overall sequence will look like that:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> z;
z <span class="pl-k">=</span> <span class="pl-c1">1</span>;
<span class="pl-k">var</span> y;
z <span class="pl-k">=</span> <span class="pl-k">typeof</span> y;
y <span class="pl-k">=</span> z;</pre></div>
<h2><a id="user-content-question-16-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-16-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 16. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> NFE (Named Function Expression)</span>
<span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">bar</span>() { <span class="pl-k">return</span> <span class="pl-c1">12</span>; };
<span class="pl-k">typeof</span> <span class="pl-en">bar</span>();</pre></div>
<h3><a id="user-content-answer-15" class="anchor" aria-hidden="true" href="#answer-15"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The output will be <code>Reference Error</code>. To fix the bug we can try to rewrite the code a little bit:</p>
<p><strong>Sample 1</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">bar</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() { <span class="pl-k">return</span> <span class="pl-c1">12</span>; };
<span class="pl-k">typeof</span> <span class="pl-en">bar</span>();</pre></div>
<p>or</p>
<p><strong>Sample 2</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">bar</span>() { <span class="pl-k">return</span> <span class="pl-c1">12</span>; };
<span class="pl-k">typeof</span> <span class="pl-en">bar</span>();</pre></div>
<p>The function definition can have only one reference variable as a function name, In <strong>sample 1</strong> <code>bar</code> is reference variable which is pointing to <code>anonymous function</code> and in <strong>sample 2</strong> we have function statement and <code>bar</code> is the function name.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">bar</span>() {
  <span class="pl-c"><span class="pl-c">//</span> foo is visible here</span>
  <span class="pl-c"><span class="pl-c">//</span> bar is visible here</span>
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-en">bar</span>()); <span class="pl-c"><span class="pl-c">//</span> Works here :)</span>
};
<span class="pl-c"><span class="pl-c">//</span> foo is visible here</span>
<span class="pl-c"><span class="pl-c">//</span> bar is undefined here</span></pre></div>
<h2><a id="user-content-question-17a-what-is-the-difference-between-declaring-a-function-in-the-formats-listed-below" class="anchor" aria-hidden="true" href="#question-17a-what-is-the-difference-between-declaring-a-function-in-the-formats-listed-below"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 17a. What is the difference between declaring a function in the formats listed below?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Some code</span>
}</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">bar</span> () {
  <span class="pl-c"><span class="pl-c">//</span> Some code</span>
}</pre></div>
<h3><a id="user-content-answer-16" class="anchor" aria-hidden="true" href="#answer-16"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The main difference is that function <code>foo</code> is defined at <code>run-time</code> and is called a function expression, whereas function <code>bar</code> is defined at <code>parse time</code> and is called a function statement. To understand it better, let's take a look at the code below :</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Run-Time function declaration</span>
  <span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Call foo function here, It will give an error</span>
  <span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am inside Foo<span class="pl-pds">"</span></span>);
  };</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Parse-Time function declaration</span>
<span class="pl-en">bar</span>(); <span class="pl-c"><span class="pl-c">//</span> Call bar function here, It will not give an Error</span>
<span class="pl-k">function</span> <span class="pl-en">bar</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am inside Foo<span class="pl-pds">"</span></span>);
}</pre></div>
<h2><a id="user-content-question-17b-what-is-the-output-of-the-following" class="anchor" aria-hidden="true" href="#question-17b-what-is-the-output-of-the-following"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 17b. What is the output of the following?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-en">bar</span>();
(<span class="pl-k">function</span> <span class="pl-en">abc</span>(){<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>something<span class="pl-pds">'</span></span>)})();
<span class="pl-k">function</span> <span class="pl-en">bar</span>(){<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>bar got called<span class="pl-pds">'</span></span>)};</pre></div>
<h3><a id="user-content-answer-17" class="anchor" aria-hidden="true" href="#answer-17"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The output will be :</p>
<pre><code>bar got called
something
</code></pre>
<p>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.</p>
<h2><a id="user-content-question-18-in-which-case-the-function-definition-is-not-hoisted-in-javascript" class="anchor" aria-hidden="true" href="#question-18-in-which-case-the-function-definition-is-not-hoisted-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 18. In which case the function definition is not hoisted in JavaScript?</h2>
<h3><a id="user-content-answer-18" class="anchor" aria-hidden="true" href="#answer-18"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>Let's take the following <strong>function expression</strong></p>
<div class="highlight highlight-source-js"><pre> <span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
     <span class="pl-k">return</span> <span class="pl-c1">12</span>;
 }</pre></div>
<p>In JavaScript <code>var</code>-declared variables and functions are <code>hoisted</code>. Let's take function <code>hoisting</code> 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:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Here foo is still undefined</span>
<span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
  <span class="pl-k">return</span> <span class="pl-c1">12</span>;
};</pre></div>
<p>The code above behind the scene look something like this:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> foo <span class="pl-k">=</span> <span class="pl-c1">undefined</span>;
<span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Here foo is undefined</span>
<span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Some code stuff</span>
}</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> foo <span class="pl-k">=</span> <span class="pl-c1">undefined</span>;
<span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Some code stuff</span>
}
<span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Now foo is defined here</span></pre></div>
<h2><a id="user-content-question-19-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-19-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 19. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>1000$<span class="pl-pds">"</span></span>;

(<span class="pl-k">function</span> () {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Original salary was <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);

  <span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>5000$<span class="pl-pds">"</span></span>;

  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>My New Salary <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);
})();</pre></div>
<h3><a id="user-content-answer-19" class="anchor" aria-hidden="true" href="#answer-19"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output: <code>undefined, 5000$</code> because of hoisting. In the code presented above, you might be expecting <code>salary</code> to retain it values from outer scope until the point that <code>salary</code> was re-declared in the inner scope. But due to <code>hoisting</code> salary value was <code>undefined</code> instead. To understand it better have a look of the following code, here <code>salary</code> variable is hoisted and declared at the top in function scope. When we print its value using <code>console.log</code> the result is <code>undefined</code>. Afterwards the variable is redeclared and the new value <code>"5000$"</code> is assigned to it.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>1000$<span class="pl-pds">"</span></span>;

(<span class="pl-k">function</span> () {
  <span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-c1">undefined</span>;
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Original salary was <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);

  salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>5000$<span class="pl-pds">"</span></span>;

  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>My New Salary <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);
})();</pre></div>
<h2><a id="user-content-question-20-whats-the-difference-between-typeof-and-instanceof" class="anchor" aria-hidden="true" href="#question-20-whats-the-difference-between-typeof-and-instanceof"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 20. What’s the difference between <code>typeof</code> and <code>instanceof</code>?</h2>
<h3><a id="user-content-answer-20" class="anchor" aria-hidden="true" href="#answer-20"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p><code>typeof</code> is an operator that returns a string with the type of whatever you pass.</p>
<p>The <code>typeof</code> operator checks if a value belongs to one of the seven basic types: <code>number</code>, <code>string</code>, <code>boolean</code>, <code>object</code>, <code>function</code>, <code>undefined</code> or <code>Symbol</code>.</p>
<p><code>typeof(null)</code> will return <code>object</code>.</p>
<p><code>instanceof</code> 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. <code>instanceof</code> doesn’t work with primitive types. It <code>instanceof</code> operator checks the current object and returns true if the object is of the specified type, for example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> dog <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Animal</span>();
dog <span class="pl-k">instanceof</span> Animal; <span class="pl-c"><span class="pl-c">//</span> Output : true</span></pre></div>
<p>Here <code>dog instanceof Animal</code> is true since <code>dog</code> inherits from <code>Animal.prototype</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> name <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">String</span>(<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>);
name <span class="pl-k">instanceof</span> <span class="pl-c1">String</span>; <span class="pl-c"><span class="pl-c">//</span> Output : true</span></pre></div>
<p>Ref Link: <a href="http://stackoverflow.com/questions/2449254/what-is-the-instanceof-operator-in-javascript" rel="nofollow">http://stackoverflow.com/questions/2449254/what-is-the-instanceof-operator-in-javascript</a></p>
<h2><a id="user-content-question-21-calculate-the-length-of-the-associative-array" class="anchor" aria-hidden="true" href="#question-21-calculate-the-length-of-the-associative-array"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 21. Calculate the length of the associative array</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> counterArray <span class="pl-k">=</span> {
  <span class="pl-c1">A</span> <span class="pl-k">:</span> <span class="pl-c1">3</span>,
  <span class="pl-c1">B</span> <span class="pl-k">:</span> <span class="pl-c1">4</span>
};
counterArray[<span class="pl-s"><span class="pl-pds">"</span>C<span class="pl-pds">"</span></span>] <span class="pl-k">=</span> <span class="pl-c1">1</span>;</pre></div>
<h3><a id="user-content-answer-21" class="anchor" aria-hidden="true" href="#answer-21"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>First of all, in case of JavaScript an associative array is the same as an object. Secondly, even though is no built-in function or property available to calculate the length/size an object, we can write such function ourselves.</p>
<h4><a id="user-content-method-1-1" class="anchor" aria-hidden="true" href="#method-1-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 1</h4>
<p><code>Object</code> has <code>keys</code> method which can we used to calculate the length of object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(counterArray).<span class="pl-c1">length</span>; <span class="pl-c"><span class="pl-c">//</span> Output 3</span></pre></div>
<h4><a id="user-content-method-2-1" class="anchor" aria-hidden="true" href="#method-2-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 2</h4>
<p>We can also calculate the length of object by iterating through the object and by doing a count of own property of object. This way we will ignoge the properties that came from the object's prototype chain:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getLength</span>(<span class="pl-smi">object</span>) {
  <span class="pl-k">var</span> count <span class="pl-k">=</span> <span class="pl-c1">0</span>;
  <span class="pl-k">for</span>(key <span class="pl-k">in</span> object) {
    <span class="pl-c"><span class="pl-c">//</span> hasOwnProperty method check own property of object</span>
    <span class="pl-k">if</span>(<span class="pl-smi">object</span>.<span class="pl-en">hasOwnProperty</span>(key)) count<span class="pl-k">++</span>;
  }
  <span class="pl-k">return</span> count;
}</pre></div>
<h4><a id="user-content-method-3-1" class="anchor" aria-hidden="true" href="#method-3-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 3</h4>
<p>All modern browsers (including IE9+) support the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames" rel="nofollow"><code>getOwnPropertyNames</code></a> method, so we can calculate the length using the following code:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Object</span>.<span class="pl-en">getOwnPropertyNames</span>(counterArray).<span class="pl-c1">length</span>; <span class="pl-c"><span class="pl-c">//</span> Output 3</span></pre></div>
<h4><a id="user-content-method-4-1" class="anchor" aria-hidden="true" href="#method-4-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 4</h4>
<p><a href="https://underscorejs.org/#size" rel="nofollow">Underscore</a> and <a href="https://lodash.com/docs/4.17.10#size" rel="nofollow">lodash</a> libraries have the method <code>size</code> dedicated to calculate the object length. We don't recommend to include one of these libraries just to use the <code>size</code> method, but if it's already used in your project - why not?</p>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">_</span>.<span class="pl-c1">size</span>({one<span class="pl-k">:</span> <span class="pl-c1">1</span>, two<span class="pl-k">:</span> <span class="pl-c1">2</span>, three<span class="pl-k">:</span> <span class="pl-c1">3</span>});
<span class="pl-k">=&gt;</span> <span class="pl-c1">3</span></pre></div>
<h2><a id="user-content-question-22-difference-between-function-method-and-constructor-calls-in-javascript" class="anchor" aria-hidden="true" href="#question-22-difference-between-function-method-and-constructor-calls-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 22. Difference between <code>Function</code>, <code>Method</code> and <code>Constructor</code> calls in JavaScript.</h2>
<p>If your are familiar with Object-oriented programming, More likely familiar to thinking of functions, methods, and class constructors as three separate things. But In JavaScript, these are just three different usage patterns of one single construct.</p>
<p>functions : The simplest usages of function call:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">helloWorld</span>(<span class="pl-smi">name</span>) {
  <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>hello world, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> name;
}

<span class="pl-en">helloWorld</span>(<span class="pl-s"><span class="pl-pds">"</span>JS Geeks<span class="pl-pds">"</span></span>); <span class="pl-c"><span class="pl-c">//</span> "hello world JS Geeks"</span></pre></div>
<p>Methods in JavaScript are nothing more than object properties that are functions.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
  <span class="pl-en">helloWorld</span> <span class="pl-k">:</span> <span class="pl-k">function</span>() {
    <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>hello world, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>;
  },
  name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John Carter<span class="pl-pds">'</span></span>
}
<span class="pl-smi">obj</span>.<span class="pl-en">helloWorld</span>(); <span class="pl-c"><span class="pl-c">//</span> // "hello world John Carter"</span></pre></div>
<p>Notice how <code>helloWorld</code> refer to <code>this</code> properties of obj. Here it's clear or you might have already understood that <code>this</code> gets bound to <code>obj</code>. But the interesting point that we can copy a reference to the same function <code>helloWorld</code> in another object and get a difference answer. Let see:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj2 <span class="pl-k">=</span> {
  helloWorld <span class="pl-k">:</span> <span class="pl-smi">obj</span>.<span class="pl-smi">helloWorld</span>,
  name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John Doe<span class="pl-pds">'</span></span>
}
<span class="pl-smi">obj2</span>.<span class="pl-en">helloWorld</span>(); <span class="pl-c"><span class="pl-c">//</span> "hello world John Doe"</span></pre></div>
<p>You might be wonder what exactly happens in a method call here. Here we call the expression itself determine the binding of this <code>this</code>, The expression <code>obj2.helloWorld()</code> looks up the <code>helloWorld</code> property of obj and calls it with receiver object <code>obj2</code>.</p>
<p>The third use of functions is as constructors. Like function and method, <code>constructors</code> are defined with function.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">name</span>, <span class="pl-smi">age</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name;
  <span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age;
}

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>John Doe<span class="pl-pds">'</span></span>, <span class="pl-c1">28</span>);
<span class="pl-smi">emp1</span>.<span class="pl-c1">name</span>; <span class="pl-c"><span class="pl-c">//</span> "John Doe"</span>
<span class="pl-smi">emp1</span>.<span class="pl-smi">age</span>; <span class="pl-c"><span class="pl-c">//</span> 28</span></pre></div>
<p>Unlike function calls and method calls, a constructor call <code>new Employee('John Doe', 28)</code> creates a brand new object and passes it as the value of <code>this</code>, and implicitly returns the new object as its result.</p>
<p>The primary role of the constructor function is to initialize the object.</p>
<h2><a id="user-content-question-23-what-would-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-23-what-would-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 23. What would be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">User</span>(<span class="pl-smi">name</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>JsGeeks<span class="pl-pds">"</span></span>;
}

<span class="pl-k">var</span> person <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">User</span>(<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>)[<span class="pl-s"><span class="pl-pds">"</span>location<span class="pl-pds">"</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>USA<span class="pl-pds">"</span></span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(person);</pre></div>
<h3><a id="user-content-answer-22" class="anchor" aria-hidden="true" href="#answer-22"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The output of above code would be <code>"USA"</code>. Here <code>new User("xyz")</code> creates a brand new object and created property <code>location</code> on that and <code>USA</code> has been assigned to object property location and that has been referenced by the person.</p>
<p>Let say <code>new User("xyz")</code> created a object called <code>foo</code>. The value <code>"USA"</code> will be assigned to <code>foo["location"]</code>, but according to <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-assignment-operators-runtime-semantics-evaluation" rel="nofollow">ECMAScript Specification</a> , pt 12.14.4 the assignment will itself return the rightmost value: in our case it's <code>"USA"</code>.
Then it will be assigned to person.</p>
<p>To better understand what's going on here, try to execute this code in console, line by line:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">User</span>(<span class="pl-smi">name</span>) {
 <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>JsGeeks<span class="pl-pds">"</span></span>;
}

<span class="pl-k">var</span> person;
<span class="pl-k">var</span> foo <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">User</span>(<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>);
foo[<span class="pl-s"><span class="pl-pds">"</span>location<span class="pl-pds">"</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>USA<span class="pl-pds">"</span></span>;
<span class="pl-c"><span class="pl-c">//</span> the console will show you that the result of this is "USA"</span>
</pre></div>
<h2><a id="user-content-question-24-what-are-service-workers-and-when-can-you-use-them" class="anchor" aria-hidden="true" href="#question-24-what-are-service-workers-and-when-can-you-use-them"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 24. What are Service Workers and when can you use them?</h2>
<h3><a id="user-content-answer-23" class="anchor" aria-hidden="true" href="#answer-23"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>It’s a technology that allows your web application to use cached resources first, and provide default experience offline, before getting more data from the network later. This principle is commonly known as Offline First.</p>
<p>Service Workers actively use promises. A Service Worker has to be installed,activated and then it can react on fetch, push and sync events.</p>
<p>As of 2017, Service Workers are not supported in IE and Safari.</p>
<h2><a id="user-content-question-25-what-is-the-difference-between-a-method-and-a-function-in-javascript" class="anchor" aria-hidden="true" href="#question-25-what-is-the-difference-between-a-method-and-a-function-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 25. What is the difference between a method and a function in javascript?</h2>
<p>In JS, that difference is quite subtle. A function is a piece of code that is called by name and function itself not associated with any object and not defined inside any object. It can be passed data to operate on (i.e. parameter) and can optionally return data (the return value).</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Function statement</span>
<span class="pl-k">function</span> <span class="pl-en">myFunc</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Do some stuff;</span>
}

<span class="pl-c"><span class="pl-c">//</span> Calling the function</span>
<span class="pl-en">myFunc</span>();</pre></div>
<p>Here myFunc() function call is not associated with object hence not invoked through any object.</p>
<p>A function can take a form of immediately invoked function expression (IIFE):</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Anonymous Self-invoking Function</span>
(<span class="pl-k">function</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Do some stuff;</span>
})();</pre></div>
<p>Finally there are also arrow functions:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">const</span> <span class="pl-c1">myFunc</span> <span class="pl-k">=</span> <span class="pl-smi">arg</span> <span class="pl-k">=&gt;</span> {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>hello<span class="pl-pds">"</span></span>, arg)
} </pre></div>
<p>A method is a piece of code that is called by its name and that is associated with the object. Methods are functions. When you call a method like this <code>obj1.myMethod()</code>, the reference to <code>obj1</code> gets assigned (bound) to <code>this</code> variable. In other words, the value of <code>this</code> will be <code>obj1</code> inside <code>myMethod</code>.</p>
<p>Here are some examples of methods:</p>
<h5><a id="user-content-example-1" class="anchor" aria-hidden="true" href="#example-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example 1</h5>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj1 <span class="pl-k">=</span> {
  attribute<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>,
  <span class="pl-en">myMethod</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {  <span class="pl-c"><span class="pl-c">//</span> Method</span>
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">attribute</span>);
  }
};

<span class="pl-c"><span class="pl-c">//</span> Call the method</span>
<span class="pl-smi">obj1</span>.<span class="pl-en">myMethod</span>();</pre></div>
<p>Here <code>obj1</code> is an object and <code>myMethod</code> is a method which is associated with <code>obj1</code>.</p>
<h5><a id="user-content-example-2" class="anchor" aria-hidden="true" href="#example-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example 2</h5>
<p>In ES6 we have classes. There the methods will look like this:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">class</span> <span class="pl-en">MyAwesomeClass</span> {
  <span class="pl-en">myMethod</span>() {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>hi there<span class="pl-pds">"</span></span>);
  }
}

<span class="pl-k">const</span> <span class="pl-c1">obj1</span> <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">MyAwesomeClass</span>();
<span class="pl-smi">obj1</span>.<span class="pl-en">myMethod</span>();</pre></div>
<p>Understand: the method is not some kind of special type of a function, and it's not about how you declare a function. It's the way we <strong>call</strong> a function. Look at that:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj1 <span class="pl-k">=</span> {
  prop1<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>buddy<span class="pl-pds">"</span></span>
}; 
<span class="pl-k">var</span> <span class="pl-en">myFunc</span> <span class="pl-k">=</span> <span class="pl-k">function</span> () {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi there<span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
};
<span class="pl-c"><span class="pl-c">//</span> let's call myFunc as a function: </span>
<span class="pl-en">myFunc</span>(); <span class="pl-c"><span class="pl-c">//</span> will output "Hi there undefined" or "Hi there Window"</span>
 
<span class="pl-smi">obj1</span>.<span class="pl-smi">myMethod</span> <span class="pl-k">=</span> myFunc;
<span class="pl-c"><span class="pl-c">//</span>now we're calling myFunc as a method of obj1, so this will point to obj1</span>
<span class="pl-smi">obj1</span>.<span class="pl-en">myMethod</span>(); <span class="pl-c"><span class="pl-c">//</span> will print "Hi there" following with obj1. </span>
</pre></div>
<h2><a id="user-content-question-26-what-is-iife-immediately-invoked-function-expression-and-how-it-can-be-useful" class="anchor" aria-hidden="true" href="#question-26-what-is-iife-immediately-invoked-function-expression-and-how-it-can-be-useful"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 26. What is IIFE (Immediately Invoked Function Expression) and how it can be useful?</h2>
<h3><a id="user-content-answer-24" class="anchor" aria-hidden="true" href="#answer-24"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<h4><a id="user-content-definition" class="anchor" aria-hidden="true" href="#definition"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Definition</h4>
<p>IIFE a function that runs as soon as it's defined. Usually it's anonymous (doesn't have a function name), but it also can be named. Here's an example of IIFE:</p>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE!<span class="pl-pds">"</span></span>);
})();
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE!"</span></pre></div>
<h4><a id="user-content-explanation" class="anchor" aria-hidden="true" href="#explanation"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Explanation</h4>
<p>So, here's how it works. Remember the difference between function statements (<code>function a () {}</code>) and function expressions (<code>var a = function() {}</code>)? So, IIFE is a function expression. To make it an expression we surround our function declaration into the parens. We do it to explicitly tell the parser that it's an expression, not a statement (JS doesn't allow statements in parens).</p>
<p>After the function you can see the two <code>()</code> braces, this is how we run the function we just declared.</p>
<p>That's it. The rest is details.</p>
<ul>
<li>
<p>The function inside IIFE doesn't have to be anonymous. This one will work perfectly fine and will help to detect your function in a stacktrace during debugging:</p>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">myIIFEFunc</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE!<span class="pl-pds">"</span></span>);
})();
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE!"</span></pre></div>
</li>
<li>
<p>It can take some parameters:</p>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">myIIFEFunc</span>(<span class="pl-smi">param1</span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> param1);
})(<span class="pl-s"><span class="pl-pds">"</span>Yuri<span class="pl-pds">"</span></span>);
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE, Yuri!"</span></pre></div>
<p>Here there value <code>"Yuri"</code> is passed to the <code>param1</code> of the function.</p>
</li>
<li>
<p>It can return a value:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> result <span class="pl-k">=</span> (<span class="pl-k">function</span> <span class="pl-en">myIIFEFunc</span>(<span class="pl-smi">param1</span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> param1);
  <span class="pl-k">return</span> <span class="pl-c1">1</span>;
})(<span class="pl-s"><span class="pl-pds">"</span>Yuri<span class="pl-pds">"</span></span>);
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE, Yuri!"</span>
<span class="pl-c"><span class="pl-c">//</span> result variable will contain 1</span></pre></div>
</li>
<li>
<p>You don't have to surround the function declaration into parens, although it's the most common way to define IIFE. Instead you can use any of the following forms:</p>
<ul>
<li><code>~function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>!function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>+function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>-function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>(function(){console.log("hi I'm IIFE")}());</code></li>
<li><code>var i = function(){console.log("hi I'm IIFE")}();</code></li>
<li><code>true &amp;&amp; function(){ console.log("hi I'm IIFE") }();</code></li>
<li><code>0, function(){ console.log("hi I'm IIFE") }();</code></li>
<li><code>new function(){ console.log("hi I'm IIFE") }</code></li>
<li><code>new function(){ console.log("hi I'm IIFE") }()</code></li>
</ul>
<p>Please don't use all these forms to impress colleagues, but be prepared that you can encounter them in someone's code.</p>
</li>
</ul>
<h4><a id="user-content-applications-and-usefulness" class="anchor" aria-hidden="true" href="#applications-and-usefulness"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Applications and usefulness</h4>
<p>Variables and functions that you declare inside an IIFE are not visible to the outside world, so you can:</p>
<ul>
<li>Use the IIFE for isolating parts of the code to hide details of implementation.</li>
<li>Specify the input interface of your code by passing commonly used global objects (window, document, jQuery, etc.) IIFE’s parameters, and then reference these global objects within the IIFE via a local scope.</li>
<li>Use it in closures, when you use closures in loops.</li>
<li>IIFE is the basis of in the module pattern in ES5
code, it helps to prevent polluting the global scope and provide the module interface to the outside.</li>
</ul>
<h2><a id="user-content-question-27-describe-singleton-pattern-in-javascript" class="anchor" aria-hidden="true" href="#question-27-describe-singleton-pattern-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 27. Describe Singleton Pattern In JavaScript</h2>
<h3><a id="user-content-answer-25" class="anchor" aria-hidden="true" href="#answer-25"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The singleton pattern is an often used JavaScript design pattern. It provides a way to wrap the code into a logical unit that can be accessed through a single variable. The Singleton design pattern is used when only one instance of an object is needed throughout the lifetime of an application. In JavaScript, Singleton pattern have many uses, they can be used for NameSpacing, which reduce the number of global variables in your page (prevent from polluting global space), organizing the code in a consistent manner, which increase the readability and maintainability of your pages.</p>
<p>There are two important points in the traditional definition of Singleton pattern:</p>
<ul>
<li>There should be only one instance allowed for a class and</li>
<li>We should allow global point of access to that single instance</li>
</ul>
<p>Let me define singleton pattern in JavaScript context:</p>
<blockquote>
<p>It is an object that is used to create namespace and group together a related set of methods and attributes (encapsulation) and if we allow to initiate then it can be initiated only once.</p>
</blockquote>
<p>In JavaScript, we can create singleton though object literal. However, there is some another way but that I will cover in next post.</p>
<p>A singleton object consists of two parts: The object itself, containing the members (Both methods and attributes) within it, and global variable used to access it. The variable is global so that object can be accessed anywhere in the page, this is a key feature of the singleton pattern.</p>
<p><strong>JavaScript: A Singleton as a Namespace</strong></p>
<p>As I have already stated above that singleton can be used to declare Namespace in JavaScript. NameSpacing is a large part of responsible programming in JavaScript. Because everything can be overwritten, and it is very easy to wipe out variable by mistake or a function, or even a class without even knowing it. A common example which happens frequently when you are working with another team member parallel,</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">findUserName</span>(<span class="pl-smi">id</span>) {

}

<span class="pl-c"><span class="pl-c">/*</span> Later in the page another programmer</span>
<span class="pl-c">added code <span class="pl-c">*/</span></span>
<span class="pl-k">var</span> findUserName <span class="pl-k">=</span> <span class="pl-en">$</span>(<span class="pl-s"><span class="pl-pds">'</span>#user_list<span class="pl-pds">'</span></span>);

<span class="pl-c"><span class="pl-c">/*</span> You are trying to call :( <span class="pl-c">*/</span></span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">findUserName</span>())</pre></div>
<p>One of the best ways to prevent accidentally overwriting variable is to namespace your code within a singleton object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">/*</span>  Using Namespace <span class="pl-c">*/</span></span>

<span class="pl-k">var</span> MyNameSpace <span class="pl-k">=</span> {
  <span class="pl-en">findUserName</span> <span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">id</span>) {},
  <span class="pl-c"><span class="pl-c">//</span> Other methods and attribute go here as well</span>
}

<span class="pl-c"><span class="pl-c">/*</span> Later in the page another programmer</span>
<span class="pl-c">added code <span class="pl-c">*/</span></span>
<span class="pl-k">var</span> findUserName <span class="pl-k">=</span> <span class="pl-en">$</span>(<span class="pl-s"><span class="pl-pds">'</span>#user_list<span class="pl-pds">'</span></span>);

<span class="pl-c"><span class="pl-c">/*</span> You are trying to call and you make this time workable <span class="pl-c">*/</span></span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">MyNameSpace</span>.<span class="pl-en">findUserName</span>());</pre></div>
<h3><a id="user-content-singleton-design-pattern-implementation" class="anchor" aria-hidden="true" href="#singleton-design-pattern-implementation"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Singleton Design Pattern Implementation</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">/*</span> Lazy Instantiation skeleton for a singleton pattern <span class="pl-c">*/</span></span>

<span class="pl-k">var</span> MyNameSpace <span class="pl-k">=</span> {};
<span class="pl-smi">MyNameSpace</span>.<span class="pl-smi">Singleton</span> <span class="pl-k">=</span> (<span class="pl-k">function</span>() {

  <span class="pl-c"><span class="pl-c">//</span> Private attribute that holds the single instance</span>
  <span class="pl-k">var</span> singletonInstance;  

  <span class="pl-c"><span class="pl-c">//</span> All of the normal code goes here</span>
  <span class="pl-k">function</span> <span class="pl-en">constructor</span>() {
    <span class="pl-c"><span class="pl-c">//</span> Private members</span>
    <span class="pl-k">var</span> privateVar1 <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>;
    <span class="pl-k">var</span> privateVar2 <span class="pl-k">=</span> [<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];

    <span class="pl-k">function</span> <span class="pl-en">privateMethod1</span>() {
      <span class="pl-c"><span class="pl-c">//</span> code stuff</span>
    }

    <span class="pl-k">function</span> <span class="pl-en">privateMethod1</span>() {
      <span class="pl-c"><span class="pl-c">//</span> code stuff</span>
    }

    <span class="pl-k">return</span> {
      attribute1 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>,
      <span class="pl-en">publicMethod</span><span class="pl-k">:</span> <span class="pl-k">function</span>() {
        <span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>);<span class="pl-c"><span class="pl-c">//</span> some code logic</span>
      }
    }
  }

  <span class="pl-k">return</span> {
    <span class="pl-c"><span class="pl-c">//</span> public method (Global access point to Singleton object)</span>
    <span class="pl-en">getInstance</span><span class="pl-k">:</span> <span class="pl-k">function</span>() {
      <span class="pl-c"><span class="pl-c">//</span>instance already exist then return  </span>
      <span class="pl-k">if</span>(<span class="pl-k">!</span>singletonInstance) {
        singletonInstance <span class="pl-k">=</span> <span class="pl-en">constructor</span>();
      }
      <span class="pl-k">return</span> singletonInstance;           
    }           
  }

})();   

<span class="pl-c"><span class="pl-c">//</span> getting access of publicMethod</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">MyNamespace</span>.<span class="pl-smi">Singleton</span>.<span class="pl-en">getInstance</span>().<span class="pl-en">publicMethod</span>());</pre></div>
<p>The singleton implemented above is easy to understand. The singleton class maintains a static reference to the lone singleton instance and return that reference from the static getInstance() method.</p>
<h2><a id="user-content-question-28-what-are-the-ways-of-creating-objects-in-javascript-" class="anchor" aria-hidden="true" href="#question-28-what-are-the-ways-of-creating-objects-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 28. What are the ways of creating objects in JavaScript ?</h2>
<h3><a id="user-content-answer-26" class="anchor" aria-hidden="true" href="#answer-26"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<h4><a id="user-content-method-1-function-based" class="anchor" aria-hidden="true" href="#method-1-function-based"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 1: Function based</h4>
<p>This method is useful if we want to create several similar objects. In the code sample below, we wrote the function <code>Employee</code> and used it as a constructor by calling it with the <code>new</code> operator.</p>
<div class="highlight highlight-source-js"><pre>  <span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">fName</span>, <span class="pl-smi">lName</span>, <span class="pl-smi">age</span>, <span class="pl-smi">salary</span>){
  	<span class="pl-c1">this</span>.<span class="pl-smi">firstName</span> <span class="pl-k">=</span> fName;
  	<span class="pl-c1">this</span>.<span class="pl-smi">lastName</span> <span class="pl-k">=</span> lName;
  	<span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age;
  	<span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> salary;
  }

  <span class="pl-c"><span class="pl-c">//</span> Creating multiple object which have similar property but diff value assigned to object property.</span>
  <span class="pl-k">var</span> employee1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Moto<span class="pl-pds">'</span></span>, <span class="pl-c1">24</span>, <span class="pl-s"><span class="pl-pds">'</span>5000$<span class="pl-pds">'</span></span>);
  <span class="pl-k">var</span> employee1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Ryan<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Jor<span class="pl-pds">'</span></span>, <span class="pl-c1">26</span>, <span class="pl-s"><span class="pl-pds">'</span>3000$<span class="pl-pds">'</span></span>);
  <span class="pl-k">var</span> employee1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Andre<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Salt<span class="pl-pds">'</span></span>, <span class="pl-c1">26</span>, <span class="pl-s"><span class="pl-pds">'</span>4000$<span class="pl-pds">'</span></span>);</pre></div>
<h4><a id="user-content-method-2-object-literal" class="anchor" aria-hidden="true" href="#method-2-object-literal"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 2: Object Literal</h4>
<p>Object Literal is best way to create an object and this is used frequently. Below is code sample for create employee object which contains property as well as method.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	salary <span class="pl-k">:</span> <span class="pl-c1">245678</span>,
	<span class="pl-en">getName</span> <span class="pl-k">:</span> <span class="pl-k">function</span>(){
		<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>;
	}
}</pre></div>
<p>The code sample below is Nested Object Literal, Here address is an object inside employee object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	salary <span class="pl-k">:</span> <span class="pl-c1">245678</span>,
	address <span class="pl-k">:</span> {
		addressLine1 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>BITS Pilani<span class="pl-pds">'</span></span>,
		addressLine2 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Vidya Vihar<span class="pl-pds">'</span></span>.
		phoneNumber<span class="pl-k">:</span> {
		  workPhone<span class="pl-k">:</span> <span class="pl-c1">7098889765</span>,
		  homePhone<span class="pl-k">:</span> <span class="pl-c1">1234567898</span>
		}
	}
}</pre></div>
<h4><a id="user-content-method-3-from-object-using-new-keyword" class="anchor" aria-hidden="true" href="#method-3-from-object-using-new-keyword"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 3: From <code>Object</code> using <code>new</code> keyword</h4>
<p>In the code below, a sample object has been created using <code>Object</code>'s constructor function.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Object</span>(); <span class="pl-c"><span class="pl-c">//</span> Created employee object using new keywords and Object()</span>
<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>;
<span class="pl-smi">employee</span>.<span class="pl-en">getName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
	<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>;
}</pre></div>
<h4><a id="user-content-method-4-using-objectcreate" class="anchor" aria-hidden="true" href="#method-4-using-objectcreate"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 4:** Using <code>Object.create</code></h4>
<p><code>Object.create(obj)</code> will create a new object and set the <code>obj</code> as its prototype. It’s a modern way to create objects that inherit properties from other objects. <code>Object.create</code> function doesn’t run the constructor. You can use <code>Object.create(null)</code> when you don’t want your object to inherit the properties of <code>Object</code>.</p>
<h2><a id="user-content-question-29-write-a-function-called-deepclone-which-takes-an-object-and-creates-a-object-copy-of-it" class="anchor" aria-hidden="true" href="#question-29-write-a-function-called-deepclone-which-takes-an-object-and-creates-a-object-copy-of-it"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 29. Write a function called deepClone which takes an object and creates a object copy of it.</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> newObject <span class="pl-k">=</span> <span class="pl-en">deepClone</span>(obj);</pre></div>
<p>Solution:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">deepClone</span>(<span class="pl-smi">object</span>){
	<span class="pl-k">var</span> newObject <span class="pl-k">=</span> {};
	<span class="pl-k">for</span>(<span class="pl-k">var</span> key <span class="pl-k">in</span> object){
		<span class="pl-k">if</span>(<span class="pl-k">typeof</span> object[key] <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>object<span class="pl-pds">'</span></span>  <span class="pl-k">&amp;&amp;</span> object[key] <span class="pl-k">!==</span> <span class="pl-c1">null</span> ){
		 newObject[key] <span class="pl-k">=</span> <span class="pl-en">deepClone</span>(object[key]);
		}<span class="pl-k">else</span>{
		 newObject[key] <span class="pl-k">=</span> object[key];
		}
	}
	<span class="pl-k">return</span> newObject;
}</pre></div>
<p><strong>Explanation:</strong> We have been asked to do deep copy of object so What's basically it's mean ??. Let's understand in this way you have been given an object <code>personalDetail</code> this object contains some property which again a type of object here as you can see <code>address</code> is an object and <code>phoneNumber</code> in side an <code>address</code> is also an object. In simple term <code>personalDetail</code> is nested object(object inside object). So Here deep copy means we have to copy all the property of <code>personalDetail</code> object including nested object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> personalDetail <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	address <span class="pl-k">:</span> {
	  location<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz<span class="pl-pds">'</span></span>,
	  zip <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>123456<span class="pl-pds">'</span></span>,
	  phoneNumber <span class="pl-k">:</span> {
	    homePhone<span class="pl-k">:</span> <span class="pl-c1">8797912345</span>,
	    workPhone <span class="pl-k">:</span> <span class="pl-c1">1234509876</span>
	  }
	}
}</pre></div>
<p>So when we do deep clone then we should copy every property (including the nested object).</p>
<h2><a id="user-content-question-30-best-way-to-detect-undefined-object-property-in-javascript" class="anchor" aria-hidden="true" href="#question-30-best-way-to-detect-undefined-object-property-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 30. Best way to detect <code>undefined</code> object property in JavaScript.</h2>
<blockquote>
<p>Suppose we have given an object <code>person</code></p>
</blockquote>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	age <span class="pl-k">:</span> <span class="pl-c1">24</span>
}</pre></div>
<p>Here the <code>person</code> object has a <code>name</code> and <code>age</code> property. Now we are trying to access the <strong>salary</strong> property which we haven't declared on the person object so while accessing it will return undefined. So how we will ensure whether property is undefined or not before performing some operation over it?</p>
<p><strong>Explanation:</strong></p>
<p>We can use <code>typeof</code> operator to check undefined</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-k">typeof</span> someProperty <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>something is undefined here<span class="pl-pds">'</span></span>);
}</pre></div>
<p>Now we are trying to access salary property of person object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-k">typeof</span> <span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>salary is undefined here because we haven't declared<span class="pl-pds">"</span></span>);
}</pre></div>
<h2><a id="user-content-question-31-write-a-function-called-clone-which-takes-an-object-and-creates-a-object-copy-of-it-but-not-copy-deep-property-of-object" class="anchor" aria-hidden="true" href="#question-31-write-a-function-called-clone-which-takes-an-object-and-creates-a-object-copy-of-it-but-not-copy-deep-property-of-object"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 31. Write a function called <code>Clone</code> which takes an object and creates a object copy of it but not copy deep property of object.</h2>
<div class="highlight highlight-source-js"><pre>   <span class="pl-k">var</span> objectLit <span class="pl-k">=</span> {foo <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Bar<span class="pl-pds">'</span></span>}; 
	<span class="pl-k">var</span> cloneObj <span class="pl-k">=</span> <span class="pl-en">Clone</span>(obj); <span class="pl-c"><span class="pl-c">//</span> Clone is the function which you have to write </span>
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(cloneObj <span class="pl-k">===</span> <span class="pl-en">Clone</span>(objectLit)); <span class="pl-c"><span class="pl-c">//</span> this should return false</span>
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(cloneObj <span class="pl-k">==</span> <span class="pl-en">Clone</span>(objectLit)); <span class="pl-c"><span class="pl-c">//</span> this should return true</span></pre></div>
<p><strong>solution:</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Clone</span>(<span class="pl-smi">object</span>){
  <span class="pl-k">var</span> newObject <span class="pl-k">=</span> {};
  <span class="pl-k">for</span>(<span class="pl-k">var</span> key <span class="pl-k">in</span> object){
  	newObject[key] <span class="pl-k">=</span> object[key];
  }
  <span class="pl-k">return</span> newObject;
}</pre></div>
<h2><a id="user-content-question-32-what-are-promises-and-how-they-are-useful" class="anchor" aria-hidden="true" href="#question-32-what-are-promises-and-how-they-are-useful"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 32. What are promises and how they are useful?</h2>
<p>We use promises for handling asynchronous interactions in a sequential manner. They are especially useful when we need to do an async operation and THEN do another async operation based on the results of the first one. For example, if you want to request the list of all flights and then for each flight you want to request some details about it. The promise represents the future value. It has an internal state (<code>pending</code>, <code>fulfilled</code> and <code>rejected</code>) and works like a state machine.</p>
<p>A promise object has <code>then</code> method, where you can specify what to do when the promise is fulfilled or rejected.</p>
<p>You can chain <code>then()</code> blocks, thus avoiding the callback hell. You can handle errors in the <code>catch()</code> block.  After a promise is set to fulfilled or rejected state, it becomes immutable.</p>
<p>Also mention that you know about more sophisticated concepts:</p>
<ul>
<li><code>async/await</code> which makes the code appear even more linear</li>
<li>RxJS observables can be viewed as the recyclable promises</li>
</ul>
<p>Be sure that you can implement the promise, read <a href="https://opensourceconnections.com/blog/2014/02/16/a-simple-promise-implementation-in-about-20-lines-of-javascript/" rel="nofollow">one of the articles on a topic</a>, and learn the source code of the <a href="https://gist.github.com/softwaredoug/9044640">simplest promise implementation</a>.</p>
<h2><a id="user-content-question-33-how-to-check-whether-a-key-exist-in-a-javascript-object-or-not" class="anchor" aria-hidden="true" href="#question-33-how-to-check-whether-a-key-exist-in-a-javascript-object-or-not"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 33. How to check whether a key exist in a JavaScript object or not.</h2>
<p>Let say we have <code>person</code> object with property <strong>name</strong> and <strong>age</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	age<span class="pl-k">:</span> <span class="pl-c1">24</span>
}</pre></div>
<p>Now we want to check whether <code>name</code> property exist in <code>person</code> object or not ?</p>
<p>In JavaScript object can have own property, in above example name and age is own property of person object. Object also have some of inherited property of base object like toString is inherited property of person object.</p>
<p>So how we will check whether property is own property or inherited property.</p>
<p>Method 1: We can use <code>in</code> operator on objet to check own property or inherited property.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>name<span class="pl-pds">'</span></span> <span class="pl-k">in</span> person); <span class="pl-c"><span class="pl-c">//</span> checking own property print true </span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>salary<span class="pl-pds">'</span></span> <span class="pl-k">in</span> person); <span class="pl-c"><span class="pl-c">//</span> checking undefined property print false</span></pre></div>
<p><code>in</code> operator also look into inherited property if it doesn't find property defined as own property. For instance If I check existence of toString property as we know that we haven't declared this property on person object so <code>in</code> operator look into there base property.</p>
<p>Here</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>toString<span class="pl-pds">'</span></span> <span class="pl-k">in</span> person); <span class="pl-c"><span class="pl-c">//</span> Will print true</span></pre></div>
<p>If we want to test property of object instance not inherited properties then we will use <code>hasOwnProperty</code> method of object instance.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">person</span>.<span class="pl-en">hasOwnProperty</span>(<span class="pl-s"><span class="pl-pds">'</span>toString<span class="pl-pds">'</span></span>)); <span class="pl-c"><span class="pl-c">//</span> print false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">person</span>.<span class="pl-en">hasOwnProperty</span>(<span class="pl-s"><span class="pl-pds">'</span>name<span class="pl-pds">'</span></span>)); <span class="pl-c"><span class="pl-c">//</span> print true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">person</span>.<span class="pl-en">hasOwnProperty</span>(<span class="pl-s"><span class="pl-pds">'</span>salary<span class="pl-pds">'</span></span>)); <span class="pl-c"><span class="pl-c">//</span> print false</span></pre></div>
<h2><a id="user-content-question-34-what-is-nan-why-do-we-need-it-and-when-can-it-break-the-page" class="anchor" aria-hidden="true" href="#question-34-what-is-nan-why-do-we-need-it-and-when-can-it-break-the-page"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 34. What is NaN, why do we need it, and when can it break the page?</h2>
<p><code>NaN</code> stands for “not a number.” and it can break your table of numbers when it has an arithmetic operation that is not allowed. Here are some examples of how you can get <code>NaN</code>:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Math</span>.<span class="pl-c1">sqrt</span>(<span class="pl-k">-</span><span class="pl-c1">5</span>);
<span class="pl-c1">Math</span>.<span class="pl-c1">log</span>(<span class="pl-k">-</span><span class="pl-c1">1</span>);
<span class="pl-c1">parseFloat</span>(<span class="pl-s"><span class="pl-pds">"</span>foo<span class="pl-pds">"</span></span>); <span class="pl-c"><span class="pl-c">/*</span> this is common: you get JSON from the server, convert some strings from JSON to a number and end up with NaN in your UI. <span class="pl-c">*/</span></span></pre></div>
<p><code>NaN</code> is not equal to any number, it’s not less or more than any number, also it's not equal to itself:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">NaN</span> <span class="pl-k">!==</span> <span class="pl-c1">NaN</span>
<span class="pl-c1">NaN</span> <span class="pl-k">&lt;</span> <span class="pl-c1">2</span> <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-c1">NaN</span> <span class="pl-k">&gt;</span> <span class="pl-c1">2</span> <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-c1">NaN</span> <span class="pl-k">===</span> <span class="pl-c1">2</span> <span class="pl-c"><span class="pl-c">//</span> false</span></pre></div>
<p>To check if the current value of the variable is NaN, you have to use the <code>isNaN</code> function. This is why we can often see NaN in the webpages: it requires special check which a lot of developers forget to do.</p>
<p>Further reading: <a href="https://ariya.io/2014/05/the-curious-case-of-javascript-nan" rel="nofollow">great blogpost on ariya.io</a></p>
<h2><a id="user-content-question-35-fix-the-bug-using-es5-only" class="anchor" aria-hidden="true" href="#question-35-fix-the-bug-using-es5-only"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 35. Fix the bug using ES5 only</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arr <span class="pl-k">=</span> [<span class="pl-c1">10</span>, <span class="pl-c1">32</span>, <span class="pl-c1">65</span>, <span class="pl-c1">2</span>];
<span class="pl-k">for</span> (<span class="pl-k">var</span> i <span class="pl-k">=</span> <span class="pl-c1">0</span>; i <span class="pl-k">&lt;</span> <span class="pl-smi">arr</span>.<span class="pl-c1">length</span>; i<span class="pl-k">++</span>) {
  <span class="pl-c1">setTimeout</span>(<span class="pl-k">function</span>() {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>The index of this number is: <span class="pl-pds">'</span></span> <span class="pl-k">+</span> i);
  }, <span class="pl-c1">3000</span>);
}</pre></div>
<p>For ES6, you can just replace <code>var i</code> with <code>let i</code>.</p>
<p>For ES5, you need to create a function scope like here:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arr <span class="pl-k">=</span> [<span class="pl-c1">10</span>, <span class="pl-c1">32</span>, <span class="pl-c1">65</span>, <span class="pl-c1">2</span>];
<span class="pl-k">for</span> (<span class="pl-k">var</span> i <span class="pl-k">=</span> <span class="pl-c1">0</span>; i <span class="pl-k">&lt;</span> <span class="pl-smi">arr</span>.<span class="pl-c1">length</span>; i<span class="pl-k">++</span>) {
  <span class="pl-c1">setTimeout</span>(<span class="pl-k">function</span>(<span class="pl-smi">j</span>) {
    <span class="pl-k">return</span> <span class="pl-k">function</span> () {
      <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>The index of this number is: <span class="pl-pds">'</span></span> <span class="pl-k">+</span> j)
    };
  }(i), <span class="pl-c1">3000</span>);
}</pre></div>
<h2><a id="user-content-question-36-how-to-check-if-the-value-of-a-variable-in-an-array" class="anchor" aria-hidden="true" href="#question-36-how-to-check-if-the-value-of-a-variable-in-an-array"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 36. How to check if the value of a variable in an array?</h2>
<p>We always encounter in such situation where we need to know whether value is type of array or not.</p>
<p>For instance : the code below perform some operation based value type</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span>(<span class="pl-smi">value</span>){
	<span class="pl-k">if</span>(<span class="pl-s"><span class="pl-pds">"</span>value is an array<span class="pl-pds">"</span></span>){
		<span class="pl-c"><span class="pl-c">//</span> Then perform some operation</span>
	}<span class="pl-k">else</span>{
		<span class="pl-c"><span class="pl-c">//</span> otherwise</span>
	}
}</pre></div>
<p>Let's discuss some way to detect an array in JavaScript.</p>
<p><strong>Method 1:</strong></p>
<p>Juriy Zaytsev (Also known as kangax) proposed an elegant solution to this.</p>
<div class="highlight highlight-source-js"><pre>	<span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>){
		<span class="pl-k">return</span> <span class="pl-c1">Object</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">toString</span>.<span class="pl-c1">call</span>(value) <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>[object Array]<span class="pl-pds">'</span></span>;
	}</pre></div>
<p>This approach is most popular way to detecting a value of type array in JavaScript and recommended to use. This approach relies on the fact that, native toString() method on a given value produce a standard string in all browser.</p>
<p><strong>Method 2:</strong></p>
<p>Duck typing test for array type detection</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-c"><span class="pl-c">//</span> Duck typing arrays</span>
 <span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>){
 	<span class="pl-k">return</span> <span class="pl-k">typeof</span> <span class="pl-smi">value</span>.<span class="pl-smi">sort</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>function<span class="pl-pds">'</span></span>;
 }</pre></div>
<p>As we can see above isArray method will return true if value object have <code>sort</code> method of type <code>function</code>. Now assume you have created a object with sort method</p>
<div class="highlight highlight-source-js"><pre>	<span class="pl-k">var</span> bar <span class="pl-k">=</span> {
		<span class="pl-en">sort</span><span class="pl-k">:</span> <span class="pl-k">function</span>(){
			<span class="pl-c"><span class="pl-c">//</span> Some code </span>
		}
	}</pre></div>
<p>Now when you check <code>isArray(bar)</code> then it will return true because bar object has sort method, But the fact is bar is not an array.</p>
<p>So this method is not a best way to detect an array as you can see it's not handle the case when some object has sort method.</p>
<p><strong>Method 3:</strong></p>
<p>ECMAScript 5 has introduced <strong>Array.isArray()</strong> method to detect an array type value. The sole purpose of this method is accurately detecting whether a value is an array or not.</p>
<p>In many JavaScript libraries you may see the code below for detecting an value of type array.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span>(<span class="pl-smi">value</span>){
   <span class="pl-c"><span class="pl-c">//</span> ECMAScript 5 feature</span>
	<span class="pl-k">if</span>(<span class="pl-k">typeof</span> <span class="pl-c1">Array</span>.<span class="pl-smi">isArray</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>function<span class="pl-pds">'</span></span>){
		<span class="pl-k">return</span> <span class="pl-c1">Array</span>.<span class="pl-en">isArray</span>(value);
	}<span class="pl-k">else</span>{
	   <span class="pl-k">return</span> <span class="pl-c1">Object</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">toString</span>.<span class="pl-c1">call</span>(value) <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>[object Array]<span class="pl-pds">'</span></span>;
	}
}</pre></div>
<p><strong>Method 4:</strong></p>
<p>You can query the constructor name:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>) {
	<span class="pl-k">return</span> <span class="pl-smi">value</span>.<span class="pl-c1">constructor</span>.<span class="pl-c1">name</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">"</span>Array<span class="pl-pds">"</span></span>;
}
</pre></div>
<p><strong>Method 5:</strong></p>
<p>You check  if a given value is an <code>instanceof Array</code>:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>) {
	<span class="pl-k">return</span> value <span class="pl-k">instanceof</span> <span class="pl-c1">Array</span>;
}</pre></div>
<h2><a id="user-content-question-37-best-way-to-detect-reference-values-of-any-type-in-javascript-" class="anchor" aria-hidden="true" href="#question-37-best-way-to-detect-reference-values-of-any-type-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 37. Best way to detect reference values of any type in JavaScript ?</h2>
<p>In Javascript Object are called as reference type, Any value other then primitive is definitely a reference type. There are several built-in reference type such as <strong>Object</strong>, <strong>Array</strong>, <strong>Function</strong>, <strong>Date</strong>, <strong>null</strong> and <strong>Error</strong>.</p>
<p>Detecting object using <code>typeof</code> operator</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> {});           <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> []);           <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>());  <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-c1">null</span>);         <span class="pl-c"><span class="pl-c">//</span> object </span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-k">new</span> <span class="pl-en">RegExp</span>()); <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-k">new</span> <span class="pl-en">Date</span>());   <span class="pl-c"><span class="pl-c">//</span> object</span></pre></div>
<p>But the downside of using typeof operator to detect an object is that typeof returns <code>object</code> for <code>null</code> (However this is fact that null is an object in JavaScript).</p>
<p>The best way to detect an object of specific reference type using <code>instanceof</code> operator.</p>
<blockquote>
<p>Syntax : <strong>value</strong> instanceof <strong>constructor</strong></p>
</blockquote>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>Detecting an array</span>
<span class="pl-k">if</span>(value <span class="pl-k">instanceof</span> <span class="pl-c1">Array</span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>value is type of array<span class="pl-pds">"</span></span>);
}</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Employee constructor function</span>
<span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">name</span>){
	<span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name; <span class="pl-c"><span class="pl-c">//</span> Public property</span>
}

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> Employee); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<p><code>instanceof</code> not only check the constructor which is used to create an object but also check it's prototype chain see below example.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> <span class="pl-c1">Object</span>); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<h2><a id="user-content-question-38-how-does-objectcreate-method-works-javascript" class="anchor" aria-hidden="true" href="#question-38-how-does-objectcreate-method-works-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 38. How does Object.create method works JavaScript?</h2>
<p>The ECMAScript 5 <strong>Object.create()</strong> method is the easiest way for one object to inherit from another, without invoking a constructor function.</p>
<p><strong>For instance:</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
  name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
  <span class="pl-en">displayName</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
  }
};

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(employee);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span>());  <span class="pl-c"><span class="pl-c">//</span> output "Nishant"</span></pre></div>
<p>In the example above, we create a new object <code>emp1</code> that inherits from <code>employee</code>. In other words <code>emp1</code>'s prototype is set to <code>employee</code>. After this emp1 is able to access the same properties and method on employee until new properties or method with the same name are defined.</p>
<p><strong>For instance:</strong> Defining <code>displayName()</code> method on <code>emp1</code> will not automatically override the employee <code>displayName</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>xyz-Anonymous<span class="pl-pds">'</span></span>);
};

<span class="pl-smi">employee</span>.<span class="pl-en">displayName</span>(); <span class="pl-c"><span class="pl-c">//</span>Nishant</span>
<span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span>();<span class="pl-c"><span class="pl-c">//</span>xyz-Anonymous</span></pre></div>
<p>In addition to this <strong><code>Object.create(</code>)</strong> method also allows to specify a second argument which is an object containing additional properties and methods to add to the new object.</p>
<p><strong>For example</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(employee, {
	name<span class="pl-k">:</span> {
		value<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>
	}
});

<span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span>(); <span class="pl-c"><span class="pl-c">//</span> "John"</span>
<span class="pl-smi">employee</span>.<span class="pl-en">displayName</span>(); <span class="pl-c"><span class="pl-c">//</span> "Nishant"</span></pre></div>
<p>In the example above, <code>emp1</code> is created with it's own value for name, so calling <strong>displayName()</strong> method will display <code>"John"</code> instead of <code>"Nishant"</code>.</p>
<p>Object created in this manner give you full control over newly created object. You are free to add, remove any properties and method you want.</p>
<h2><a id="user-content-question-39-how-to-use-constructor-functions-for-inheritance-in-javascript" class="anchor" aria-hidden="true" href="#question-39-how-to-use-constructor-functions-for-inheritance-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 39. How to use constructor functions for inheritance in JavaScript?</h2>
<p>Let say we have <code>Person</code> class which has name, age, salary properties and <strong>incrementSalary()</strong> method.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Person</span>(<span class="pl-smi">name</span>, <span class="pl-smi">age</span>, <span class="pl-smi">salary</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name;
  <span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age;
  <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> salary;
  <span class="pl-c1">this</span>.<span class="pl-en">incrementSalary</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">byValue</span>) {
    <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">+</span> byValue;
  };
}</pre></div>
<p>Now we wish to create Employee class which contains all the properties of Person class and wanted to add some additional properties into Employee class.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">company</span>){
	<span class="pl-c1">this</span>.<span class="pl-smi">company</span> <span class="pl-k">=</span> company;
}

<span class="pl-c"><span class="pl-c">//</span>Prototypal Inheritance </span>
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span> <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Person</span>(<span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>, <span class="pl-c1">24</span>,<span class="pl-c1">5000</span>);</pre></div>
<p>In the example above, <strong>Employee</strong> type inherits from <strong>Person</strong>. It does so by assigning a new instance of <code>Person</code> to <code>Employee</code> prototype. After that, every instance of <code>Employee</code> inherits its properties and methods from <code>Person</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>Prototypal Inheritance </span>
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span> <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Person</span>(<span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>, <span class="pl-c1">24</span>,<span class="pl-c1">5000</span>);

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">"</span>Google<span class="pl-pds">"</span></span>);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> Person); <span class="pl-c"><span class="pl-c">//</span> true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> Employee); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<p>Let's understand Constructor inheritance</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>Defined Person class</span>
<span class="pl-k">function</span> <span class="pl-en">Person</span>(<span class="pl-smi">name</span>){
	<span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>;
}

<span class="pl-k">var</span> obj <span class="pl-k">=</span> {};

<span class="pl-c"><span class="pl-c">//</span> obj inherit Person class properties and method </span>
<span class="pl-smi">Person</span>.<span class="pl-c1">call</span>(obj); <span class="pl-c"><span class="pl-c">//</span> constructor inheritance</span>

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(obj); <span class="pl-c"><span class="pl-c">//</span> Object {name: "Nishant"}</span></pre></div>
<p>Here we saw calling <strong>Person.call(obj)</strong> define the name properties from <code>Person</code> to <code>obj</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(name <span class="pl-k">in</span> obj); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<p>Type-based inheritance is best used with developer defined constructor function rather than natively in JavaScript. In addition to this also allows flexibility in how we create similar type of object.</p>
<h2><a id="user-content-question-40-how-we-can-prevent-modification-of-object-in-javascript-" class="anchor" aria-hidden="true" href="#question-40-how-we-can-prevent-modification-of-object-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 40. How we can prevent modification of object in JavaScript ?.</h2>
<p>ECMAScript 5 introduce several methods to prevent modification of object which lock down object to ensure that no one, accidentally or otherwise, change functionality of Object.</p>
<p>There are three levels of preventing modification:</p>
<p><strong>1: Prevent extensions :</strong></p>
<p>No new properties or methods can be added to the object, but one can change the existing properties and method.</p>
<p>For example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span> lock the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">preventExtensions</span>(employee);

<span class="pl-c"><span class="pl-c">//</span> Now try to change the employee object property name</span>
<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>; <span class="pl-c"><span class="pl-c">//</span> work fine </span>

<span class="pl-c"><span class="pl-c">//</span>Now try to add some new property to the object</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">24</span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's inside the strict mode</span></pre></div>
<p><strong>2: Seal :</strong></p>
<p>It is same as prevent extension, in addition to this also prevent existing properties and methods from being deleted.</p>
<p>To seal an object, we use <strong>Object.seal()</strong> method. you can check whether an object is sealed or not using <strong>Object.isSealed();</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span> Seal the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">seal</span>(employee);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isExtensible</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isSealed</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> true</span>

<span class="pl-k">delete</span> <span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's in strict mode</span>

<span class="pl-c"><span class="pl-c">//</span> Trying to add new property will give an error</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">30</span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span></pre></div>
<p>when an object is sealed, its existing properties and methods can't be removed. Sealed object are also non-extensible.</p>
<p><strong>3: Freeze :</strong></p>
<p>Same as seal, In addition to this prevent existing properties methods from being modified (All properties and methods are read only).</p>
<p>To freeze an object, use Object.freeze() method. We can also determine whether an object is frozen using Object.isFrozen();</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span>Freeze the object</span>
<span class="pl-c1">Object</span>.<span class="pl-en">freeze</span>(employee); 

<span class="pl-c"><span class="pl-c">//</span> Seal the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">seal</span>(employee);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isExtensible</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isSealed</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isFrozen</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>


<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">30</span>;     <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-k">delete</span> <span class="pl-smi">employee</span>.<span class="pl-c1">name</span>   <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's in strict mode</span></pre></div>
<p>Frozen objects are considered both non-extensible and sealed.</p>
<p><strong>Recommended:</strong></p>
<p>If you are decided to prevent modification, sealed, freeze the object then use in strict mode so that you can catch the error.</p>
<p>For example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-s"><span class="pl-pds">"</span>use strict<span class="pl-pds">"</span></span>;

<span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span>Freeze the object</span>
<span class="pl-c1">Object</span>.<span class="pl-en">freeze</span>(employee); 

<span class="pl-c"><span class="pl-c">//</span> Seal the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">seal</span>(employee);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isExtensible</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isSealed</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isFrozen</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>


<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">30</span>;     <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-k">delete</span> <span class="pl-smi">employee</span>.<span class="pl-c1">name</span>;  <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's in strict mode</span></pre></div>
<h2><a id="user-content-question-44-write-a-log-function-which-will-add-prefix-your-message-to-every-message-you-log-using-consolelog-" class="anchor" aria-hidden="true" href="#question-44-write-a-log-function-which-will-add-prefix-your-message-to-every-message-you-log-using-consolelog-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 44. Write a log function which will add prefix <code>(your message)</code> to every message you log using console.log ?</h2>
<p>For example, If you log <code>console.log("Some message")</code> then output should be <strong>(your message) Some message</strong></p>
<p>Logging error message or some informative message is always required when you dealing with client side JavaScript using console.log method. Some time you want to add some prefix to identify message generated log from your application hence you would like to prefix your app name in every console.log.</p>
<p>A general way to do this keep adding your app name in every console.log message like</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>your app name<span class="pl-pds">'</span></span> <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">'</span>some error message<span class="pl-pds">'</span></span>);</pre></div>
<p>But doing in this way you have to write your app name everytime when you log message using console.</p>
<p>There are some best way we can achieve this</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">appLog</span>() {
  <span class="pl-k">var</span> args <span class="pl-k">=</span> <span class="pl-c1">Array</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">slice</span>.<span class="pl-c1">call</span>(<span class="pl-c1">arguments</span>);
  <span class="pl-smi">args</span>.<span class="pl-c1">unshift</span>(<span class="pl-s"><span class="pl-pds">'</span>your app name<span class="pl-pds">'</span></span>);
  <span class="pl-en">console</span>.<span class="pl-smi">log</span>.<span class="pl-c1">apply</span>(<span class="pl-en">console</span>, args);
}

<span class="pl-en">appLog</span>(<span class="pl-s"><span class="pl-pds">"</span>Some error message<span class="pl-pds">"</span></span>); 
<span class="pl-c"><span class="pl-c">//</span>output of above console: 'your app name Some error message'</span></pre></div>
<h2><a id="user-content-question-45--write-a-function-which-will-test-string-as-a-literal-and-as-an-object-" class="anchor" aria-hidden="true" href="#question-45--write-a-function-which-will-test-string-as-a-literal-and-as-an-object-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 45 . Write a function which will test string as a literal and as an object ?</h2>
<p>For example: We can create string using string literal and using String constructor function.</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-c"><span class="pl-c">//</span> using string literal</span>
 <span class="pl-k">var</span> ltrlStr <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi I am string literal<span class="pl-pds">"</span></span>;
 <span class="pl-c"><span class="pl-c">//</span> using String constructor function </span>
 <span class="pl-k">var</span> objStr <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">String</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am string object<span class="pl-pds">"</span></span>);</pre></div>
<p>We can use typeof operator to test string literal and instanceof operator to test String object.</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-k">function</span> <span class="pl-en">isString</span>(<span class="pl-smi">str</span>) {
 	<span class="pl-k">return</span> <span class="pl-k">typeof</span>(str) <span class="pl-k">==</span> <span class="pl-s"><span class="pl-pds">'</span>string<span class="pl-pds">'</span></span> <span class="pl-k">||</span> str <span class="pl-k">instanceof</span> <span class="pl-c1">String</span>;
 }
 
 <span class="pl-k">var</span> ltrlStr <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi I am string literal<span class="pl-pds">"</span></span>;
 <span class="pl-k">var</span> objStr <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">String</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am string object<span class="pl-pds">"</span></span>);
 <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">isString</span>(ltrlStr)); <span class="pl-c"><span class="pl-c">//</span> true</span>
 <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">isString</span>(objStr)); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<h2><a id="user-content-question-46--what-is-typical-use-case-for-anonymous-function-in-javascript-" class="anchor" aria-hidden="true" href="#question-46--what-is-typical-use-case-for-anonymous-function-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 46 . What is typical use case for anonymous function in JavaScript ?</h2>
<p>Anonymous functions basically used in following scenario.</p>
<ol>
<li>
<p>No name is needed if function is only used in one place, then there is no need to add a name to function.</p>
<p>Let's take the example of setTimeout function</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">setTimeout</span>(<span class="pl-k">function</span>(){
	<span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Hello<span class="pl-pds">"</span></span>);
},<span class="pl-c1">1000</span>);</pre></div>
<p>Here there is no need of using named function when we are sure 	that function which will alert <code>hello</code> would use only once in 	application.</p>
</li>
<li>
<p>Anonymous functions are declared inline and inline functions have advantages in the case that they can access variable in the parent scopes.</p>
<p>Let's take a example of event handler. Notify event of particular 	type (such as click) for a given object.</p>
<p>Let say we have HTML element (button) on which we want to add click event and when user do click on button we would like to execute some logic.</p>
<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span> <span class="pl-e">id</span>=<span class="pl-s"><span class="pl-pds">"</span>myBtn<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
<p>Add Event Listener</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> btn <span class="pl-k">=</span> <span class="pl-c1">document</span>.<span class="pl-c1">getElementById</span>(<span class="pl-s"><span class="pl-pds">'</span>myBtn<span class="pl-pds">'</span></span>);
<span class="pl-smi">btn</span>.<span class="pl-c1">addEventListener</span>(<span class="pl-s"><span class="pl-pds">'</span>click<span class="pl-pds">'</span></span>, <span class="pl-k">function</span> () {
  <span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">'</span>button clicked<span class="pl-pds">'</span></span>);
});</pre></div>
<p>Above example shows used of anonymous function as a callback function in event handler.</p>
</li>
<li>
<p>Passing anonymous function as a parameter to calling function.</p>
<p>Example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Function which will execute callback function</span>
<span class="pl-k">function</span> <span class="pl-en">processCallback</span>(<span class="pl-smi">callback</span>){
	<span class="pl-k">if</span>(<span class="pl-k">typeof</span> callback <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>function<span class="pl-pds">'</span></span>){
		<span class="pl-en">callback</span>();
	}
}

<span class="pl-c"><span class="pl-c">//</span> Call function and pass anonymous function as callback </span>
<span class="pl-en">processCallback</span>(<span class="pl-k">function</span>(){
	<span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am anonymous callback function<span class="pl-pds">"</span></span>);
});</pre></div>
</li>
</ol>
<p>The best way to make a decision for using anonymous function is to ask the following question:</p>
<p>Will the function which I am going to define, be used anywhere else?</p>
<p>If your answer is yes then go and create named function rather anonymous function.</p>
<p><strong>Advantage of using anonymous function:</strong></p>
<ol>
<li>It can reduce a bit of code, particularly in recursive function and in callback function.</li>
<li>Avoid needless global namespace pollutions.</li>
</ol>
<h2><a id="user-content-question-47--how-to-set-a-default-parameter-value-" class="anchor" aria-hidden="true" href="#question-47--how-to-set-a-default-parameter-value-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 47 . How to set a default parameter value ?</h2>
<p>If you are coming from python/c# you might be using default value for function parameter incase value(formal parameter) has not been passed. For instance :</p>
<div class="highlight highlight-source-python"><pre><span class="pl-k">//</span> Define sentEmail function 
<span class="pl-k">//</span> configuration : Configuration <span class="pl-c1">object</span>
<span class="pl-k">//</span> provider : Email Service provider, Default would be gmail
<span class="pl-k">def</span> <span class="pl-en">sentEmail</span>(<span class="pl-smi">configuration</span>, <span class="pl-smi">provider</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Gmail<span class="pl-pds">'</span></span>):
	<span class="pl-c"><span class="pl-c">#</span> Your code logic</span></pre></div>
<p><strong>In Pre ES6/ES2015</strong></p>
<p>There are a lot of ways by which you can achieve this in pre ES2015.</p>
<p>Let's understand the code below by which we achieved setting default parameter value.</p>
<p><strong>Method 1: Setting default parameter value</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">sentEmail</span>(<span class="pl-smi">configuration</span>, <span class="pl-smi">provider</span>) {
  <span class="pl-c"><span class="pl-c">//</span> Set default value if user has not passed value for provider</span>
  provider <span class="pl-k">=</span> <span class="pl-k">typeof</span> provider <span class="pl-k">!==</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span> <span class="pl-k">?</span> provider <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Gmail<span class="pl-pds">'</span></span>  
  <span class="pl-c"><span class="pl-c">//</span> Your code logic</span>
;
}
<span class="pl-c"><span class="pl-c">//</span> In this call we are not passing provider parameter value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
});
<span class="pl-c"><span class="pl-c">//</span> Here we are passing Yahoo Mail as a provider value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
}, <span class="pl-s"><span class="pl-pds">'</span>Yahoo Mail<span class="pl-pds">'</span></span>);</pre></div>
<p><strong>Method 2: Setting default parameter value</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">sentEmail</span>(<span class="pl-smi">configuration</span>, <span class="pl-smi">provider</span>) {
  <span class="pl-c"><span class="pl-c">//</span> Set default value if user has not passed value for provider</span>
  provider <span class="pl-k">=</span> provider <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">'</span>Gmail<span class="pl-pds">'</span></span>  
  <span class="pl-c"><span class="pl-c">//</span> Your code logic</span>
;
}
<span class="pl-c"><span class="pl-c">//</span> In this call we are not passing provider parameter value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
});
<span class="pl-c"><span class="pl-c">//</span> Here we are passing Yahoo Mail as a provider value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
}, <span class="pl-s"><span class="pl-pds">'</span>Yahoo Mail<span class="pl-pds">'</span></span>);</pre></div>
<h2><a id="user-content-question-48-write-code-for-merge-two-javascript-object-dynamically" class="anchor" aria-hidden="true" href="#question-48-write-code-for-merge-two-javascript-object-dynamically"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 48. Write code for merge two JavaScript Object dynamically.</h2>
<p>Let say you have two objects</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
	age  <span class="pl-k">:</span> <span class="pl-c1">24</span>
}

<span class="pl-k">var</span> address <span class="pl-k">=</span> {
	addressLine1 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Some Location x<span class="pl-pds">'</span></span>,
	addressLine2 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Some Location y<span class="pl-pds">'</span></span>,
	city <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>NewYork<span class="pl-pds">'</span></span>
} </pre></div>
<p>Write merge function which will take two object and add all the own property of second object into first object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">merge</span>(person , address); 
 
<span class="pl-c"><span class="pl-c">/*</span> Now person should have 5 properties </span>
<span class="pl-c">name , age , addressLine1 , addressLine2 , city <span class="pl-c">*/</span></span></pre></div>
<p><strong>Method 1: Using ES6, Object.assign method</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">const</span> <span class="pl-c1">merge</span> <span class="pl-k">=</span> (<span class="pl-smi">toObj</span>, <span class="pl-smi">fromObj</span>) <span class="pl-k">=&gt;</span> <span class="pl-c1">Object</span>.<span class="pl-en">assign</span>(toObj, fromObj);</pre></div>
<p><strong>Method 2: Without using built-in function</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">merge</span>(<span class="pl-smi">toObj</span>, <span class="pl-smi">fromObj</span>) {
  <span class="pl-c"><span class="pl-c">//</span> Make sure both of the parameter is an object</span>
  <span class="pl-k">if</span> (<span class="pl-k">typeof</span> toObj <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>object<span class="pl-pds">'</span></span> <span class="pl-k">&amp;&amp;</span> <span class="pl-k">typeof</span> fromObj <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>object<span class="pl-pds">'</span></span>) {
    <span class="pl-k">for</span> (<span class="pl-k">var</span> pro <span class="pl-k">in</span> fromObj) {
      <span class="pl-c"><span class="pl-c">//</span> Assign only own properties not inherited properties</span>
      <span class="pl-k">if</span> (<span class="pl-smi">fromObj</span>.<span class="pl-en">hasOwnProperty</span>(pro)) {
        <span class="pl-c"><span class="pl-c">//</span> Assign property and value</span>
        toObj[pro] <span class="pl-k">=</span> fromObj[pro];
      }
    }
  }<span class="pl-k">else</span>{
  	<span class="pl-k">throw</span> <span class="pl-s"><span class="pl-pds">"</span>Merge function can apply only on object<span class="pl-pds">"</span></span>;
  }
}</pre></div>
<h2><a id="user-content-question-49-what-is-non-enumerable-property-in-javascript-and-how-you-can-create-one" class="anchor" aria-hidden="true" href="#question-49-what-is-non-enumerable-property-in-javascript-and-how-you-can-create-one"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 49. What is non-enumerable property in JavaScript and how you can create one?</h2>
<p>Object can have properties that don't show up when you iterate through object using for...in loop or using Object.keys() to get an array of property names. This properties is know as non-enumerable properties.</p>
<p>Let say we have following object</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
};
<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person)); <span class="pl-c"><span class="pl-c">//</span> ['name', 'salary', 'country']</span></pre></div>
<p>As we know that person object properties <code>name</code>, <code>salary</code> ,<code>country</code> are enumerable hence it's shown up when we called Object.keys(person).</p>
<p>To create a non-enumerable property we have to use <strong>Object.defineProperty()</strong>. This is a special method for creating non-enumerable property in JavaScript.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
};
<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

<span class="pl-c"><span class="pl-c">//</span> Create non-enumerable property</span>
<span class="pl-c1">Object</span>.<span class="pl-en">defineProperty</span>(person, <span class="pl-s"><span class="pl-pds">'</span>phoneNo<span class="pl-pds">'</span></span>,{
	value <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>8888888888<span class="pl-pds">'</span></span>,
	enumerable<span class="pl-k">:</span> <span class="pl-c1">false</span>
})

<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person); <span class="pl-c"><span class="pl-c">//</span> ['name', 'salary', 'country']</span></pre></div>
<p>In the example above <code>phoneNo</code> property didn't show up because we made it non-enumerable by setting <strong>enumerable:false</strong></p>
<p><strong>Bonus</strong></p>
<p>Now let's try to change value of <code>phoneNo</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">person</span>.<span class="pl-smi">phoneNo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>7777777777<span class="pl-pds">'</span></span>; </pre></div>
<p><strong>Object.defineProperty()</strong> also lets you create read-only properties as we saw above, we are not able to modify phoneNo value of a person object. This is because descriptor has <strong>writable</strong> property, which is <code>false</code> by default. Changing non-writable property value will return error in strict mode. In non-strict mode it won't through any error but it won't change the value of phoneNo.</p>
<h2><a id="user-content-question-50-what-is-function-binding-" class="anchor" aria-hidden="true" href="#question-50-what-is-function-binding-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 50. What is Function binding ?</h2>
<p>Function binding falls in advance JavaScript category and this is very popular technique to use in conjunction with event handler and callback function to preserve code execution context while passing function as a parameter.</p>
<p>Let's consider the following example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> clickHandler <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>click event handler<span class="pl-pds">'</span></span>,
	<span class="pl-en">handleClick</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-c1">event</span>) {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
	}
};

<span class="pl-k">var</span> btn <span class="pl-k">=</span> <span class="pl-c1">document</span>.<span class="pl-c1">getElementById</span>(<span class="pl-s"><span class="pl-pds">'</span>myBtn<span class="pl-pds">'</span></span>);
<span class="pl-c"><span class="pl-c">//</span> Add click event to btn</span>
<span class="pl-smi">btn</span>.<span class="pl-c1">addEventListener</span>(<span class="pl-s"><span class="pl-pds">'</span>click<span class="pl-pds">'</span></span>, <span class="pl-smi">clickHandler</span>.<span class="pl-smi">handleClick</span>);</pre></div>
<p>Here in this example clickHandler object is created which contain message properties and handleClick method.</p>
<p>We have assigned handleClick method to a DOM button, which will be executed in response of click. When the button is clicked, then handleClick method is being called and console message. Here console.log should log the <code>click event handler</code> message but it actually log <code>undefined</code>.</p>
<p>The problem of displaying <code>undefined</code> is because of the execution context of clickHandler.handleClick method is not being saved hence <code>this</code> pointing to button <code>btn</code> object. We can fix this issue using bind method.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> clickHandler <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>click event handler<span class="pl-pds">'</span></span>,
	<span class="pl-en">handleClick</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-c1">event</span>) {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
	}
};

<span class="pl-k">var</span> btn <span class="pl-k">=</span> <span class="pl-c1">document</span>.<span class="pl-c1">getElementById</span>(<span class="pl-s"><span class="pl-pds">'</span>myBtn<span class="pl-pds">'</span></span>);
<span class="pl-c"><span class="pl-c">//</span> Add click event to btn and bind the clickHandler object</span>
<span class="pl-smi">btn</span>.<span class="pl-c1">addEventListener</span>(<span class="pl-s"><span class="pl-pds">'</span>click<span class="pl-pds">'</span></span>, <span class="pl-smi">clickHandler</span>.<span class="pl-smi">handleClick</span>.<span class="pl-en">bind</span>(clickHandler));</pre></div>
<p><code>bind</code> method is available to all the function similar to call and apply method which take argument value of <code>this</code>.</p>
<h1><a id="user-content-coding-questions" class="anchor" aria-hidden="true" href="#coding-questions"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Coding Questions</h1>
<h2><a id="user-content-passing-values-by-reference-vs-by-value" class="anchor" aria-hidden="true" href="#passing-values-by-reference-vs-by-value"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Passing values by reference vs by value</h2>
<p>For a JS developer, it's crucially important to understand which values are passed by reference,
and which ones are passed by value. Remember that objects, including arrays are passed by reference
while strings, booleans and numbers are passed by value.</p>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> strA <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>hi there<span class="pl-pds">"</span></span>;
<span class="pl-k">var</span> strB <span class="pl-k">=</span> strA;
strB<span class="pl-k">=</span><span class="pl-s"><span class="pl-pds">"</span>bye there!<span class="pl-pds">"</span></span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span> (strA)</pre></div>
<p>The output will <code>'hi there'</code> because we're dealing with strings here. Strings are
passed by value, that is, copied.</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> objA <span class="pl-k">=</span> {prop1<span class="pl-k">:</span> <span class="pl-c1">42</span>};
<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA; 
<span class="pl-smi">objB</span>.<span class="pl-smi">prop1</span> <span class="pl-k">=</span> <span class="pl-c1">90</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA) </pre></div>
<p>The output will <code>{prop1: 90}</code> because we're dealing with objects here. Objects are
passed by reference, that is, <code>objA</code> and <code>objB</code> point to the same object in memory.</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> objA <span class="pl-k">=</span> {prop1<span class="pl-k">:</span> <span class="pl-c1">42</span>};
<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
objB <span class="pl-k">=</span> {};
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA)</pre></div>
<p>The output will <code>{prop1: 42}</code>.</p>
<p>When we assign <code>objA</code> to <code>objB</code>, the <code>objB</code> variable will point
to the same object as the <code>objB</code> variable.</p>
<p>However, when we reassign <code>objB</code> to an empty object, we simply change where <code>objB</code> variable references to.
This doesn't affect where <code>objA</code> variable references to.</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [<span class="pl-c1">0</span>,<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> arrA;
arrB[<span class="pl-c1">0</span>]<span class="pl-k">=</span><span class="pl-c1">42</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA)</pre></div>
<p>The output will be <code>[42,1,2,3,4,5]</code>.</p>
<p>Arrays are object in JavaScript and they are passed and assigned by reference. This is why
both <code>arrA</code> and <code>arrB</code> point to the same array <code>[0,1,2,3,4,5]</code>. That's why changing the first
element of the <code>arrB</code> will also modify <code>arrA</code>: it's the same array in the memory.</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [<span class="pl-c1">0</span>,<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> <span class="pl-smi">arrA</span>.<span class="pl-c1">slice</span>();
arrB[<span class="pl-c1">0</span>]<span class="pl-k">=</span><span class="pl-c1">42</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA)</pre></div>
<p>The output will be <code>[0,1,2,3,4,5]</code>.</p>
<p>The <code>slice</code> function copies all the elements of the array returning the new array. That's why
<code>arrA</code> and <code>arrB</code> reference two completely different arrays.</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [{prop1<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>value of array A!!<span class="pl-pds">"</span></span>},  {someProp<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>also value of array A!<span class="pl-pds">"</span></span>}, <span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> arrA;
arrB[<span class="pl-c1">0</span>].<span class="pl-smi">prop1</span><span class="pl-k">=</span><span class="pl-c1">42</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA);</pre></div>
<p>The output will be <code>[{prop1: 42},  {someProp: "also value of array A!"}, 3,4,5]</code>.</p>
<p>Arrays are object in JS, so both varaibles arrA and arrB point to the same array. Changing
<code>arrB[0]</code> is the same as changing <code>arrA[0]</code></p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [{prop1<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>value of array A!!<span class="pl-pds">"</span></span>}, {someProp<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>also value of array A!<span class="pl-pds">"</span></span>},<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> <span class="pl-smi">arrA</span>.<span class="pl-c1">slice</span>();
arrB[<span class="pl-c1">0</span>].<span class="pl-smi">prop1</span><span class="pl-k">=</span><span class="pl-c1">42</span>;
arrB[<span class="pl-c1">3</span>] <span class="pl-k">=</span> <span class="pl-c1">20</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA);</pre></div>
<p>The output will be <code>[{prop1: 42},  {someProp: "also value of array A!"}, 3,4,5]</code>.</p>
<p>The <code>slice</code> function copies all the elements of the array returning the new array. However,
it doesn't do deep copying. Instead it does shallow copying. You can imagine slice implemented like this:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">slice</span>(<span class="pl-smi">arr</span>) {
   <span class="pl-k">var</span> result <span class="pl-k">=</span> [];
   <span class="pl-k">for</span> (i <span class="pl-k">=</span> <span class="pl-c1">0</span>; i<span class="pl-k">&lt;</span> <span class="pl-smi">arr</span>.<span class="pl-c1">length</span>; i<span class="pl-k">++</span>) {
       <span class="pl-smi">result</span>.<span class="pl-c1">push</span>(arr[i]);
   }
   <span class="pl-k">return</span> result; 
}</pre></div>
<p>Look at the line with <code>result.push(arr[i])</code>. If <code>arr[i]</code> happens to be a number or string,
it will be passed by value, in other words, copied. If <code>arr[i]</code> is an object, it will be passed by reference.</p>
<p>In case of our array <code>arr[0]</code> is an object <code>{prop1: "value of array A!!"}</code>. Only the reference
to this object will be copied. This effectively means that arrays arrA and arrB share first
two elements.</p>
<p>This is why changing the property of <code>arrB[0]</code> in <code>arrB</code> will also change the <code>arrA[0]</code>.</p>
<h2><a id="user-content-hoisting" class="anchor" aria-hidden="true" href="#hoisting"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hoisting</h2>
<h3><a id="user-content-1-consolelogemployeeid" class="anchor" aria-hidden="true" href="#1-consolelogemployeeid"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. console.log(employeeId);</h3>
<ol>
<li>Some Value</li>
<li>Undefined</li>
<li>Type Error</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 4) ReferenceError: employeeId is not defined</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>19000<span class="pl-pds">'</span></span>;</pre></div>
<ol>
<li>Some Value</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>1234abe<span class="pl-pds">'</span></span>;
(<span class="pl-k">function</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
	<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>122345<span class="pl-pds">'</span></span>;
})();</pre></div>
<ol>
<li>'122345'</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>1234abe<span class="pl-pds">'</span></span>;
(<span class="pl-k">function</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
	<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>122345<span class="pl-pds">'</span></span>;
	(<span class="pl-k">function</span>() {
		<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc1234<span class="pl-pds">'</span></span>;
	}());
}());</pre></div>
<ol>
<li>'122345'</li>
<li>undefined</li>
<li>'1234abe'</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> displayFunc);
	<span class="pl-k">var</span> <span class="pl-en">displayFunc</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am inside displayFunc<span class="pl-pds">"</span></span>);
	}
}());</pre></div>
<ol>
<li>undefined</li>
<li>function</li>
<li>'Hi I am inside displayFunc'</li>
<li>ReferenceError: displayFunc is not defined</li>
</ol>
<p>Answer: 1) undefined</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc123<span class="pl-pds">'</span></span>;
<span class="pl-k">function</span> <span class="pl-en">foo</span>(){
	employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>123bcd<span class="pl-pds">'</span></span>;
	<span class="pl-k">return</span>;
}
<span class="pl-en">foo</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);</pre></div>
<ol>
<li>undefined</li>
<li>'123bcd'</li>
<li>'abc123'</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) '123bcd'</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc123<span class="pl-pds">'</span></span>;

<span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>123bcd<span class="pl-pds">'</span></span>;
	<span class="pl-k">return</span>;

	<span class="pl-k">function</span> <span class="pl-en">employeeId</span>() {}
}
<span class="pl-en">foo</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);</pre></div>
<ol>
<li>undefined</li>
<li>'123bcd'</li>
<li>'abc123'</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 3) 'abc123'</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc123<span class="pl-pds">'</span></span>;

<span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	<span class="pl-en">employeeId</span>();
	<span class="pl-k">return</span>;

	<span class="pl-k">function</span> <span class="pl-en">employeeId</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> employeeId);
	}
}
<span class="pl-en">foo</span>();</pre></div>
<ol>
<li>undefined</li>
<li>function</li>
<li>string</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) 'function'</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	<span class="pl-en">employeeId</span>();
	<span class="pl-k">var</span> product <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Car<span class="pl-pds">'</span></span>; 
	<span class="pl-k">return</span>;

	<span class="pl-k">function</span> <span class="pl-en">employeeId</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(product);
	}
}
<span class="pl-en">foo</span>();</pre></div>
<ol>
<li>undefined</li>
<li>Type Error</li>
<li>'Car'</li>
<li>ReferenceError: product is not defined</li>
</ol>
<p>Answer: 1) undefined</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	<span class="pl-en">bar</span>();

	<span class="pl-k">function</span> <span class="pl-en">bar</span>() {
		<span class="pl-en">abc</span>();
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> abc);
	}

	<span class="pl-k">function</span> <span class="pl-en">abc</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> bar);
	}
}());</pre></div>
<ol>
<li>undefined undefined</li>
<li>Type Error</li>
<li>function function</li>
<li>ReferenceError: bar is not defined</li>
</ol>
<p>Answer: 3) function function</p>
<h2><a id="user-content-objects" class="anchor" aria-hidden="true" href="#objects"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Objects</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-s"><span class="pl-pds">'</span>use strict<span class="pl-pds">'</span></span>;

	<span class="pl-k">var</span> person <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
	};
	<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
	person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

	<span class="pl-c1">Object</span>.<span class="pl-en">defineProperty</span>(person, <span class="pl-s"><span class="pl-pds">'</span>phoneNo<span class="pl-pds">'</span></span>, {
		value<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>8888888888<span class="pl-pds">'</span></span>,
		enumerable<span class="pl-k">:</span> <span class="pl-c1">true</span>
	})

	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person)); 
})();</pre></div>
<ol>
<li>Type Error</li>
<li>undefined</li>
<li>["name", "salary", "country", "phoneNo"]</li>
<li>["name", "salary", "country"]</li>
</ol>
<p>Answer: 3) ["name", "salary", "country", "phoneNo"]</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-s"><span class="pl-pds">'</span>use strict<span class="pl-pds">'</span></span>;

	<span class="pl-k">var</span> person <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
	};
	<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
	person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

	<span class="pl-c1">Object</span>.<span class="pl-en">defineProperty</span>(person, <span class="pl-s"><span class="pl-pds">'</span>phoneNo<span class="pl-pds">'</span></span>, {
		value<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>8888888888<span class="pl-pds">'</span></span>,
		enumerable<span class="pl-k">:</span> <span class="pl-c1">false</span>
	})

	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person)); 
})();</pre></div>
<ol>
<li>Type Error</li>
<li>undefined</li>
<li>["name", "salary", "country", "phoneNo"]</li>
<li>["name", "salary", "country"]</li>
</ol>
<p>Answer: 4) ["name", "salary", "country"]</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> {
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,
		bar<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>
	};
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> {
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,
		bar<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Object</span>({foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>foo<span class="pl-pds">"</span></span>});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Object</span>({foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>foo<span class="pl-pds">"</span></span>});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(objA);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(objA);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">==</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">===</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 4) true true</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">==</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">===</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
}());</pre></div>
<ol>
<li>true true true false</li>
<li>true false true true</li>
<li>true true true true</li>
<li>true true false false</li>
</ol>
<p>Answer: 3) true true true true</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span>);
}());</pre></div>
<ol>
<li>foo bar</li>
<li>bar bar</li>
<li>foo foo</li>
<li>bar foo</li>
</ol>
<p>Answer: 2) bar bar</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>;

	<span class="pl-k">delete</span> <span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span>);
}());</pre></div>
<ol>
<li>foo bar</li>
<li>bar bar</li>
<li>foo foo</li>
<li>bar foo</li>
</ol>
<p>Answer: 3) foo foo</p>
<h3><a id="user-content-11-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#11-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>11. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> {
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	};
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>;

	<span class="pl-k">delete</span> <span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span>);
}());</pre></div>
<ol>
<li>foo bar</li>
<li>undefined undefined</li>
<li>foo foo</li>
<li>undefined bar</li>
</ol>
<p>Answer: 2) undefined undefined</p>
<h2><a id="user-content-arrays" class="anchor" aria-hidden="true" href="#arrays"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Arrays</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> array <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>(<span class="pl-s"><span class="pl-pds">'</span>100<span class="pl-pds">'</span></span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">length</span>);
}());</pre></div>
<ol>
<li>undefined undefined</li>
<li>[undefined × 100] 100</li>
<li>["100"] 1</li>
<li>ReferenceError: array is not defined</li>
</ol>
<p>Answer: 3) ["100"] 1</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> array1 <span class="pl-k">=</span> [];
	<span class="pl-k">var</span> array2 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>(<span class="pl-c1">100</span>);
	<span class="pl-k">var</span> array3 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>([<span class="pl-s"><span class="pl-pds">'</span>1<span class="pl-pds">'</span></span>,<span class="pl-c1">2</span>,<span class="pl-s"><span class="pl-pds">'</span>3<span class="pl-pds">'</span></span>,<span class="pl-c1">4</span>,<span class="pl-c1">5.6</span>]);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array1);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array2);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array3);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array3</span>.<span class="pl-c1">length</span>);
}());</pre></div>
<ol>
<li>[] [] [Array[5]] 1</li>
<li>[] [undefined × 100] Array[5] 1</li>
<li>[] [] ['1',2,'3',4,5.6] 5</li>
<li>[] [] [Array[5]] 5</li>
</ol>
<p>Answer: 1) [] [] [Array[5]] 1</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> () {
  <span class="pl-k">var</span> array <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>(<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>);
  array[<span class="pl-c1">10</span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>;
  <span class="pl-k">delete</span> array[<span class="pl-c1">10</span>];
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">length</span>);
}());</pre></div>
<ol>
<li>11</li>
<li>5</li>
<li>6</li>
<li>undefined</li>
</ol>
<p>Answer: 1) 11</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> animal <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>cow<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>horse<span class="pl-pds">'</span></span>];
		<span class="pl-smi">animal</span>.<span class="pl-c1">push</span>(<span class="pl-s"><span class="pl-pds">'</span>cat<span class="pl-pds">'</span></span>);
		<span class="pl-smi">animal</span>.<span class="pl-c1">push</span>(<span class="pl-s"><span class="pl-pds">'</span>dog<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>rat<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>goat<span class="pl-pds">'</span></span>);
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">animal</span>.<span class="pl-c1">length</span>);
})();</pre></div>
<ol>
<li>4</li>
<li>5</li>
<li>6</li>
<li>undefined</li>
</ol>
<p>Answer: 3) 6</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-3" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> animal <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>cow<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>horse<span class="pl-pds">'</span></span>];
		<span class="pl-smi">animal</span>.<span class="pl-c1">push</span>(<span class="pl-s"><span class="pl-pds">'</span>cat<span class="pl-pds">'</span></span>);
		<span class="pl-smi">animal</span>.<span class="pl-c1">unshift</span>(<span class="pl-s"><span class="pl-pds">'</span>dog<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>rat<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>goat<span class="pl-pds">'</span></span>);
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(animal);
})();</pre></div>
<ol>
<li>[ 'dog', 'rat', 'goat', 'cow', 'horse', 'cat' ]</li>
<li>[ 'cow', 'horse', 'cat', 'dog', 'rat', 'goat' ]</li>
<li>Type Error</li>
<li>undefined</li>
</ol>
<p>Answer: 1) [ 'dog', 'rat', 'goat', 'cow', 'horse', 'cat' ]</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> array <span class="pl-k">=</span> [<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>([{name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>},{name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>}].<span class="pl-c1">indexOf</span>({name<span class="pl-k">:</span><span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>}));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>([[<span class="pl-c1">1</span>],[<span class="pl-c1">2</span>],[<span class="pl-c1">3</span>],[<span class="pl-c1">4</span>]].<span class="pl-c1">indexOf</span>([<span class="pl-c1">3</span>]));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>abcdefgh<span class="pl-pds">"</span></span>.<span class="pl-c1">indexOf</span>(<span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>));
})();</pre></div>
<ol>
<li>1 -1 -1 4</li>
<li>1 0 -1 4</li>
<li>1 -1 -1 -1</li>
<li>1 undefined -1 4</li>
</ol>
<p>Answer: 1) 1 -1 -1 4</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> array <span class="pl-k">=</span> [<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>,<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>,<span class="pl-c1">6</span>];
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>,<span class="pl-c1">3</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>,<span class="pl-c1">10</span>));
})();</pre></div>
<ol>
<li>1 -1 -1</li>
<li>1 6 -1</li>
<li>1 1 -1</li>
<li>1 undefined undefined</li>
</ol>
<p>Answer: 2) 1 6 -1</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> numbers <span class="pl-k">=</span> [<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">8</span>,<span class="pl-c1">9</span>,<span class="pl-c1">11</span>,<span class="pl-c1">13</span>,<span class="pl-c1">12</span>,<span class="pl-c1">16</span>];
	<span class="pl-k">var</span> even <span class="pl-k">=</span> <span class="pl-smi">numbers</span>.<span class="pl-en">filter</span>(<span class="pl-k">function</span>(<span class="pl-smi">element</span>, <span class="pl-smi">index</span>){
		<span class="pl-k">return</span> element <span class="pl-k">%</span> <span class="pl-c1">2</span> <span class="pl-k">===</span> <span class="pl-c1">0</span>; 
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(even);

	<span class="pl-k">var</span> containsDivisibleby3 <span class="pl-k">=</span> <span class="pl-smi">numbers</span>.<span class="pl-en">some</span>(<span class="pl-k">function</span>(<span class="pl-smi">element</span>, <span class="pl-smi">index</span>){
		<span class="pl-k">return</span> element <span class="pl-k">%</span> <span class="pl-c1">3</span> <span class="pl-k">===</span> <span class="pl-c1">0</span>;
	});

	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containsDivisibleby3);	
})();</pre></div>
<ol>
<li>[ 2, 4, 8, 12, 16 ] [ 0, 3, 0, 0, 9, 0, 12]</li>
<li>[ 2, 4, 8, 12, 16 ] [ 3, 9, 12]</li>
<li>[ 2, 4, 8, 12, 16 ] true</li>
<li>[ 2, 4, 8, 12, 16 ] false</li>
</ol>
<p>Answer: 3) [ 2, 4, 8, 12, 16 ] true</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> [<span class="pl-c1">2</span>,<span class="pl-c1">0</span>,<span class="pl-c1">false</span>,<span class="pl-s"><span class="pl-pds">"</span><span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">'</span>12<span class="pl-pds">'</span></span>, <span class="pl-c1">true</span>];
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">Boolean</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">Number</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">String</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">Object</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);		
})();</pre></div>
<ol>
<li>[ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]</li>
<li>[false, true]
[ 2 ]
['12']
[ ]</li>
<li>[2,0,false,"", '12', true]
[2,0,false,"", '12', true]
[2,0,false,"", '12', true]
[2,0,false,"", '12', true]</li>
<li>[ 2, '12', true ]
[ 2, '12', true, false ]
[ 2, '12', true,false ]
[ 2, '12', true,false]</li>
</ol>
<p>Answer: 1) [ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> list <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>john<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>ritz<span class="pl-pds">'</span></span>];
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>(<span class="pl-c1">1</span>));	
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>(<span class="pl-c1">1</span>,<span class="pl-c1">3</span>));
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>());
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>(<span class="pl-c1">2</span>,<span class="pl-c1">2</span>));
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(list);				
})();</pre></div>
<ol>
<li>[ 'bar', 'john', 'ritz' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
<li>[ 'bar', 'john', 'ritz' ]
[ 'bar', 'john','ritz ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
<li>[ 'john', 'ritz' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
<li>[ 'foo' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
</ol>
<p>Answer: 1) [ 'bar', 'john', 'ritz' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</p>
<h3><a id="user-content-11-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#11-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>11. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> list <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>john<span class="pl-pds">'</span></span>];
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">1</span>));		
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">1</span>,<span class="pl-c1">2</span>));
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(list);			
})();</pre></div>
<ol>
<li>[ 'bar', 'john' ] [] [ 'foo' ]</li>
<li>[ 'bar', 'john' ] [] [ 'bar', 'john' ]</li>
<li>[ 'bar', 'john' ] [ 'bar', 'john' ] [ 'bar', 'john' ]</li>
<li>[ 'bar', 'john' ] [] []</li>
</ol>
<p>Answer: 1.  [ 'bar', 'john' ] [] [ 'foo' ]</p>
<h3><a id="user-content-12-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#12-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>12. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> arrayNumb <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-smi">arrayNumb</span>.<span class="pl-c1">sort</span>();
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrayNumb);
})();</pre></div>
<ol>
<li>[2, 8, 15, 16, 23, 42]</li>
<li>[42, 23, 26, 15, 8, 2]</li>
<li>[ 15, 16, 2, 23, 42, 8 ]</li>
<li>[ 2, 8, 15, 16, 23, 42 ]</li>
</ol>
<p>Answer: 3.  [ 15, 16, 2, 23, 42, 8 ]</p>
<h2><a id="user-content-functions" class="anchor" aria-hidden="true" href="#functions"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Functions</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">funcA</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>funcA <span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
	(<span class="pl-k">function</span> <span class="pl-en">innerFuncA1</span>(){
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>innerFunc1<span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
		(<span class="pl-k">function</span> <span class="pl-en">innerFunA11</span>(){
			<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>innerFunA11<span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
		})();
	})();
}
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">funcA</span>());</pre></div>
<ol>
<li>funcA  Window {...}
innerFunc1 Window {...}
innerFunA11 Window {...}</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: this is not defined</li>
</ol>
<p>Answer: 1)</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Hello<span class="pl-pds">"</span></span>,
	innerMessage<span class="pl-k">:</span> <span class="pl-k">!</span>(<span class="pl-k">function</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
	})()
};
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-smi">innerMessage</span>);</pre></div>
<ol>
<li>ReferenceError: this.message is not defined</li>
<li>undefined</li>
<li>Type Error</li>
<li>undefined true</li>
</ol>
<p>Answer: 4) undefined true</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Hello<span class="pl-pds">"</span></span>,
	<span class="pl-en">innerMessage</span><span class="pl-k">:</span> <span class="pl-k">function</span>() {
		<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-smi">message</span>;
	}
};
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-en">innerMessage</span>());</pre></div>
<ol>
<li>Hello</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 1) Hello</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
  message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Hello<span class="pl-pds">'</span></span>,
  <span class="pl-en">innerMessage</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {
    (<span class="pl-k">function</span> () {
      <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
    }());
  }
};
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-en">innerMessage</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>Hello</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 3) undefined</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
  message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Hello<span class="pl-pds">'</span></span>,
  <span class="pl-en">innerMessage</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {
  	<span class="pl-k">var</span> self <span class="pl-k">=</span> <span class="pl-c1">this</span>;
    (<span class="pl-k">function</span> () {
      <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">self</span>.<span class="pl-smi">message</span>);
    }());
  }
};
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-en">innerMessage</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hello'</li>
<li>undefined</li>
<li>ReferenceError: self.message is not defined</li>
</ol>
<p>Answer: 2) 'Hello'</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
}
<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi John<span class="pl-pds">"</span></span>;
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hi John'</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 3) undefined</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span>);
}
<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi John<span class="pl-pds">"</span></span>;
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hi John'</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 2) 'Hi John'</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>() {
  <span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Hi John<span class="pl-pds">'</span></span>;
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span>);
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hi John'</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 2) 'Hi John'</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>(<span class="pl-smi">param1</span>,<span class="pl-smi">param2</span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">myFunc</span>.<span class="pl-c1">length</span>);
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>));
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>c<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>d<span class="pl-pds">"</span></span>));</pre></div>
<ol>
<li>2 2 2</li>
<li>0 2 4</li>
<li>undefined</li>
<li>ReferenceError</li>
</ol>
<p>Answer: a) 2 2 2</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">arguments</span>.<span class="pl-c1">length</span>);
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>));
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>c<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>d<span class="pl-pds">"</span></span>));</pre></div>
<ol>
<li>2 2 2</li>
<li>0 2 4</li>
<li>undefined</li>
<li>ReferenceError</li>
</ol>
<p>Answer: 2) 0 2 4</p>
<h2><a id="user-content-object-oriented" class="anchor" aria-hidden="true" href="#object-oriented"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Object Oriented</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Person</span>(<span class="pl-smi">name</span>, <span class="pl-smi">age</span>){
	<span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>;
	<span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age <span class="pl-k">||</span> <span class="pl-c1">24</span>;
	<span class="pl-c1">this</span>.<span class="pl-en">displayName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
	}
}

<span class="pl-smi">Person</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>;
<span class="pl-smi">Person</span>.<span class="pl-en">displayName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
}

<span class="pl-k">var</span> person1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Person</span>(<span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>);
	<span class="pl-smi">person1</span>.<span class="pl-en">displayName</span>();
	<span class="pl-smi">Person</span>.<span class="pl-en">displayName</span>();</pre></div>
<ol>
<li>John Person</li>
<li>John John</li>
<li>John undefined</li>
<li>John John</li>
</ol>
<p>Answer: 1) John Person</p>
<h2><a id="user-content-scopes" class="anchor" aria-hidden="true" href="#scopes"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Scopes</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">passWordMngr</span>() {
	<span class="pl-k">var</span> password <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>12345678<span class="pl-pds">'</span></span>;
	<span class="pl-c1">this</span>.<span class="pl-smi">userName</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>;
	<span class="pl-k">return</span> {
		pwd<span class="pl-k">:</span> password
	};
}
<span class="pl-c"><span class="pl-c">//</span> Block End</span>
<span class="pl-k">var</span> userInfo <span class="pl-k">=</span> <span class="pl-en">passWordMngr</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">userInfo</span>.<span class="pl-smi">pwd</span>);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">userInfo</span>.<span class="pl-smi">userName</span>);</pre></div>
<ol>
<li>12345678 Window</li>
<li>12345678 John</li>
<li>12345678 undefined</li>
<li>undefined undefined</li>
</ol>
<p>Answer: 3) 12345678 undefined</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>aq123<span class="pl-pds">'</span></span>;
<span class="pl-k">function</span> <span class="pl-en">Employee</span>() {
  <span class="pl-c1">this</span>.<span class="pl-smi">employeeId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bq1uy<span class="pl-pds">'</span></span>;
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">Employee</span>.<span class="pl-smi">employeeId</span>);</pre></div>
<ol>
<li>Reference Error</li>
<li>aq123</li>
<li>bq1uy</li>
<li>undefined</li>
</ol>
<p>Answer: 4) undefined</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>aq123<span class="pl-pds">'</span></span>;

<span class="pl-k">function</span> <span class="pl-en">Employee</span>() {
	<span class="pl-c1">this</span>.<span class="pl-smi">employeeId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bq1uy<span class="pl-pds">'</span></span>;
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">new</span> <span class="pl-en">Employee</span>().<span class="pl-smi">employeeId</span>);
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">employeeId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>kj182<span class="pl-pds">'</span></span>;
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">JobId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>1BJKSJ<span class="pl-pds">'</span></span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">new</span> <span class="pl-en">Employee</span>().<span class="pl-smi">JobId</span>);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">new</span> <span class="pl-en">Employee</span>().<span class="pl-smi">employeeId</span>);</pre></div>
<ol>
<li>bq1uy 1BJKSJ bq1uy undefined</li>
<li>bq1uy 1BJKSJ bq1uy</li>
<li>bq1uy 1BJKSJ kj182</li>
<li>undefined 1BJKSJ kj182</li>
</ol>
<p>Answer: 2) bq1uy 1BJKSJ bq1uy</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>aq123<span class="pl-pds">'</span></span>;
(<span class="pl-k">function</span> <span class="pl-en">Employee</span>() {
	<span class="pl-k">try</span> {
		<span class="pl-k">throw</span> <span class="pl-s"><span class="pl-pds">'</span>foo123<span class="pl-pds">'</span></span>;
	} <span class="pl-k">catch</span> (employeeId) {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
	}
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
}());</pre></div>
<ol>
<li>foo123 aq123</li>
<li>foo123 foo123</li>
<li>aq123 aq123</li>
<li>foo123 undefined</li>
</ol>
<p>Answer: 1) foo123 aq123</p>
<h2><a id="user-content-call-apply-bind" class="anchor" aria-hidden="true" href="#call-apply-bind"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Call, Apply, Bind</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> greet <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Hello World<span class="pl-pds">'</span></span>;
	<span class="pl-k">var</span> toGreet <span class="pl-k">=</span> [].<span class="pl-smi">filter</span>.<span class="pl-c1">call</span>(greet, <span class="pl-k">function</span>(<span class="pl-smi">element</span>, <span class="pl-smi">index</span>) {
		<span class="pl-k">return</span> index <span class="pl-k">&gt;</span> <span class="pl-c1">5</span>;
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(toGreet);
}());</pre></div>
<ol>
<li>Hello World</li>
<li>undefined</li>
<li>World</li>
<li>[ 'W', 'o', 'r', 'l', 'd' ]</li>
</ol>
<p>Answer: 4) [ 'W', 'o', 'r', 'l', 'd' ]</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> fooAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">4000</span>,
		<span class="pl-en">deductAmount</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">amount</span>) {
			<span class="pl-c1">this</span>.<span class="pl-smi">amount</span> <span class="pl-k">-=</span> amount;
			<span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">'</span>Total amount left in account: <span class="pl-pds">'</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-smi">amount</span>;
		}
	};
	<span class="pl-k">var</span> barAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">6000</span>
	};
	<span class="pl-k">var</span> <span class="pl-en">withdrawAmountBy</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">totalAmount</span>) {
		<span class="pl-k">return</span> <span class="pl-smi">fooAccount</span>.<span class="pl-smi">deductAmount</span>.<span class="pl-en">bind</span>(barAccount, totalAmount);
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">400</span>)());
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">300</span>)());
}());</pre></div>
<ol>
<li>Total amount left in account: 5600 Total amount left in account: 5300</li>
<li>undefined undefined</li>
<li>Total amount left in account: 3600 Total amount left in account: 3300</li>
<li>Total amount left in account: 5600 Total amount left in account: 5600</li>
</ol>
<p>Answer: 1) Total amount left in account: 5600 Total amount left in account: 5300</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> fooAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">4000</span>,
		<span class="pl-en">deductAmount</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">amount</span>) {
			<span class="pl-c1">this</span>.<span class="pl-smi">amount</span> <span class="pl-k">-=</span> amount;
			<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-smi">amount</span>;
		}
	};
	<span class="pl-k">var</span> barAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">6000</span>
	};
	<span class="pl-k">var</span> <span class="pl-en">withdrawAmountBy</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">totalAmount</span>) {
		<span class="pl-k">return</span> <span class="pl-smi">fooAccount</span>.<span class="pl-smi">deductAmount</span>.<span class="pl-c1">apply</span>(barAccount, [totalAmount]);
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">400</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">300</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">200</span>));
}());</pre></div>
<ol>
<li>5600 5300 5100</li>
<li>3600 3300 3100</li>
<li>5600 3300 5100</li>
<li>undefined undefined undefined</li>
</ol>
<p>Answer: 1) 5600 5300 5100</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> fooAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">6000</span>,
		<span class="pl-en">deductAmount</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">amount</span>) {
			<span class="pl-c1">this</span>.<span class="pl-smi">amount</span> <span class="pl-k">-=</span> amount;
			<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-smi">amount</span>;
		}
	};
	<span class="pl-k">var</span> barAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">4000</span>
	};
	<span class="pl-k">var</span> <span class="pl-en">withdrawAmountBy</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">totalAmount</span>) {
		<span class="pl-k">return</span> <span class="pl-smi">fooAccount</span>.<span class="pl-smi">deductAmount</span>.<span class="pl-c1">call</span>(barAccount, totalAmount);
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">400</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">300</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">200</span>));
}());</pre></div>
<ol>
<li>5600 5300 5100</li>
<li>3600 3300 3100</li>
<li>5600 3300 5100</li>
<li>undefined undefined undefined</li>
</ol>
<p>Answer: 2) 3600 3300 3100</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">greetNewCustomer</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Hello <span class="pl-pds">'</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
}.<span class="pl-en">bind</span>({
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
})());</pre></div>
<ol>
<li>Hello John</li>
<li>Reference Error</li>
<li>Window</li>
<li>undefined</li>
</ol>
<p>Answer: 1) Hello John</p>
<h3><a id="user-content-6-suggest-your-question" class="anchor" aria-hidden="true" href="#6-suggest-your-question"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. Suggest your question!</h3>
<h2><a id="user-content-callback-functions" class="anchor" aria-hidden="true" href="#callback-functions"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callback Functions</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--5" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--5"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getDataFromServer</span>(<span class="pl-smi">apiUrl</span>){
    <span class="pl-k">var</span> name <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>;
	<span class="pl-k">return</span> {
		<span class="pl-en">then</span> <span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">fn</span>){
			<span class="pl-en">fn</span>(name);
		}
	}
}

<span class="pl-en">getDataFromServer</span>(<span class="pl-s"><span class="pl-pds">'</span>www.google.com<span class="pl-pds">'</span></span>).<span class="pl-c1">then</span>(<span class="pl-k">function</span>(<span class="pl-smi">name</span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(name);
});
</pre></div>
<ol>
<li>John</li>
<li>undefined</li>
<li>Reference Error</li>
<li>fn is not defined</li>
</ol>
<p>Answer: 1) John</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> arrayNumb <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-c1">Array</span>.<span class="pl-c1">prototype</span>.<span class="pl-en">sort</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">a</span>,<span class="pl-smi">b</span>){
		<span class="pl-k">return</span> a <span class="pl-k">-</span> b;
	};
	<span class="pl-smi">arrayNumb</span>.<span class="pl-c1">sort</span>();
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrayNumb);
})();

(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> numberArray <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-smi">numberArray</span>.<span class="pl-c1">sort</span>(<span class="pl-k">function</span>(<span class="pl-smi">a</span>,<span class="pl-smi">b</span>){
		<span class="pl-k">if</span>(a <span class="pl-k">==</span> b){
			<span class="pl-k">return</span> <span class="pl-c1">0</span>;
		}<span class="pl-k">else</span>{
			<span class="pl-k">return</span> a <span class="pl-k">&lt;</span> b <span class="pl-k">?</span> <span class="pl-k">-</span><span class="pl-c1">1</span> <span class="pl-k">:</span> <span class="pl-c1">1</span>;
		}
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numberArray);
})();

(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> numberArray <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-smi">numberArray</span>.<span class="pl-c1">sort</span>(<span class="pl-k">function</span>(<span class="pl-smi">a</span>,<span class="pl-smi">b</span>){
		<span class="pl-k">return</span> a<span class="pl-k">-</span>b;
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numberArray);
})();</pre></div>
<ol>
<li>[ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]</li>
<li>undefined undefined undefined</li>
<li>[42, 23, 16, 15, 8, 2]
[42, 23, 16, 15, 8, 2]
[42, 23, 16, 15, 8, 2]</li>
<li>Reference Error</li>
</ol>
<p>Answer: 1) [ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]</p>
<h2><a id="user-content-return-statement" class="anchor" aria-hidden="true" href="#return-statement"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Return Statement</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--6" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--6"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">function</span> <span class="pl-en">sayHello</span>(){
		<span class="pl-k">var</span> name <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi John<span class="pl-pds">"</span></span>;
		<span class="pl-k">return</span> 
		{
			fullName<span class="pl-k">:</span> name
		}
	}
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">sayHello</span>().<span class="pl-smi">fullName</span>);
})();</pre></div>
<ol>
<li>Hi John</li>
<li>undefined</li>
<li>Reference Error</li>
<li>Uncaught TypeError: Cannot read property 'fullName' of undefined</li>
</ol>
<p>Answer: 4) Uncaught TypeError: Cannot read property 'fullName' of undefined</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--5" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--5"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getNumber</span>(){
	<span class="pl-k">return</span> (<span class="pl-c1">2</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>);
}

<span class="pl-k">var</span> numb <span class="pl-k">=</span> <span class="pl-en">getNumber</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numb);</pre></div>
<ol>
<li>5</li>
<li>undefined</li>
<li>2</li>
<li>(2,4,5)</li>
</ol>
<p>Answer: 1) 5</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getNumber</span>(){
	<span class="pl-k">return</span>;
}

<span class="pl-k">var</span> numb <span class="pl-k">=</span> <span class="pl-en">getNumber</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numb);</pre></div>
<ol>
<li>null</li>
<li>undefined</li>
<li>""</li>
<li>0</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4**. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span>(<span class="pl-smi">x</span>){
	<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">y</span>){
		<span class="pl-k">return</span> [x<span class="pl-k">*</span>y, <span class="pl-k">function</span>(<span class="pl-smi">z</span>){
			<span class="pl-k">return</span> x<span class="pl-k">*</span>y <span class="pl-k">+</span> z;
		}];
	}
}

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)[<span class="pl-c1">0</span>]);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)[<span class="pl-c1">1</span>](<span class="pl-c1">4</span>));</pre></div>
<ol>
<li>6, 10</li>
<li>undefined undefined</li>
<li>Reference Error</li>
<li>10, 6</li>
</ol>
<p>Answer: 1) 6, 10</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5**. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span>(<span class="pl-smi">x</span>) {
	<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">y</span>) {
		<span class="pl-k">return</span> {
			result<span class="pl-k">:</span> x <span class="pl-k">*</span> y,
			<span class="pl-en">sum</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">z</span>) {
				<span class="pl-k">return</span> x <span class="pl-k">*</span> y <span class="pl-k">+</span> z;
			}
		};
	};
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>).<span class="pl-smi">result</span>);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>).<span class="pl-en">sum</span>(<span class="pl-c1">4</span>));</pre></div>
<ol>
<li>6, 10</li>
<li>undefined undefined</li>
<li>Reference Error</li>
<li>10, 6</li>
</ol>
<p>Answer: 1) 6, 10</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span>(<span class="pl-smi">x</span>) {
	<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">y</span>) {
		<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">z</span>) {
			<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">w</span>) {
				<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">p</span>) {
					<span class="pl-k">return</span> x <span class="pl-k">*</span> y <span class="pl-k">*</span> z <span class="pl-k">*</span> w <span class="pl-k">*</span> p;
				};
			};
		};
	};
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)(<span class="pl-c1">4</span>)(<span class="pl-c1">5</span>)(<span class="pl-c1">6</span>));</pre></div>
<ol>
<li>720</li>
<li>undefined</li>
<li>Reference Error</li>
<li>Type Error</li>
</ol>
<p>Answer: 1) 720</p>






</article>
      </div><div class="Box-body">
        <article class="markdown-body entry-content p-5" itemprop="text">




<h2><a id="user-content-question-1-whats-the-difference-between-undefined-and-not-defined-in-javascript" class="anchor" aria-hidden="true" href="#question-1-whats-the-difference-between-undefined-and-not-defined-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 1. What's the difference between <code>undefined</code> and <code>not defined</code> in JavaScript</h2>
<h3><a id="user-content-answer" class="anchor" aria-hidden="true" href="#answer"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>In JavaScript if you try to use a variable that doesn't exist and has not been declared, then JavaScript will throw an error <code>var name is not defined</code> and the script will stop executing thereafter. But If you use <code>typeof undeclared_variable</code> then it will return <code>undefined</code>.</p>
<p>Before starting further discussion let's understand the difference between declaration and definition.</p>
<p><code>var x</code> is a declaration because you are not defining what value it holds yet, but you are declaring its existence and the need for memory allocation.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x; <span class="pl-c"><span class="pl-c">//</span> declaring x</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(x); <span class="pl-c"><span class="pl-c">//</span> output: undefined</span></pre></div>
<p><code>var x = 1</code> is both declaration and definition (also we can say we are doing initialisation), Here declaration and assignment of value happen inline for variable x, In JavaScript every variable declaration and function declaration brings to the top of its current scope in which it's declared then assignment happen in order this term is called <code>hoisting</code>.</p>
<p>A variable can be declared but not defined. When we try to access it, It will result <code>undefined</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x; <span class="pl-c"><span class="pl-c">//</span> Declaration</span>
<span class="pl-k">typeof</span> x <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span>; <span class="pl-c"><span class="pl-c">//</span> Will return true</span></pre></div>
<p>A variable can be neither declared nor defined. When we try to reference such variable then the result will be <code>not defined</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(y);  <span class="pl-c"><span class="pl-c">//</span> Output: ReferenceError: y is not defined</span></pre></div>
<h3><a id="user-content-ref-link" class="anchor" aria-hidden="true" href="#ref-link"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Ref Link:</h3>
<p><a href="http://stackoverflow.com/questions/20822022/javascript-variable-definition-declaration" rel="nofollow">http://stackoverflow.com/questions/20822022/javascript-variable-definition-declaration</a></p>
<h2><a id="user-content-question-2-for-which-value-of-x-the-results-of-the-following-statements-are-not-the-same" class="anchor" aria-hidden="true" href="#question-2-for-which-value-of-x-the-results-of-the-following-statements-are-not-the-same"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 2. For which value of <code>x</code> the results of the following statements are not the same?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>  if( x &lt;= 100 ) {...}</span>
<span class="pl-k">if</span>( <span class="pl-k">!</span>(x <span class="pl-k">&gt;</span> <span class="pl-c1">100</span>) ) {<span class="pl-k">...</span>}</pre></div>
<h3><a id="user-content-answer-1" class="anchor" aria-hidden="true" href="#answer-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p><code>NaN &lt;= 100</code> is <code>false</code> and <code>NaN &gt; 100</code> is also <code>false</code>, so if the
value of <code>x</code> is <code>NaN</code>, the statements are not the same.</p>
<p>The same holds true for any value of x that being converted to Number, returns NaN, e.g.: <code>undefined</code>, <code>[1,2,5]</code>, <code>{a:22}</code> , etc.</p>
<p>This is why you need to pay attention when you deal with numeric variables. <code>NaN</code> can’t be equal, less than or more than any other numeric value, so the only reliable way to check if the value is <code>NaN</code>, is to use <code>isNaN()</code> function.</p>
<h2><a id="user-content-question-3-what-is-the-drawback-of-declaring-methods-directly-in-javascript-objects" class="anchor" aria-hidden="true" href="#question-3-what-is-the-drawback-of-declaring-methods-directly-in-javascript-objects"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 3. What is the drawback of declaring methods directly in JavaScript objects?</h2>
<h3><a id="user-content-answer-2" class="anchor" aria-hidden="true" href="#answer-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>One of the drawback 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. Let's see it on example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">Employee</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">name</span>, <span class="pl-smi">company</span>, <span class="pl-smi">salary</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-pds">"</span></span>;       
  <span class="pl-c1">this</span>.<span class="pl-smi">company</span> <span class="pl-k">=</span> company <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-pds">"</span></span>;
  <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> salary <span class="pl-k">||</span> <span class="pl-c1">5000</span>;

  <span class="pl-c"><span class="pl-c">//</span> We can create a method like this:</span>
  <span class="pl-c1">this</span>.<span class="pl-en">formatSalary</span> <span class="pl-k">=</span> <span class="pl-k">function</span> () {
      <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>$ <span class="pl-pds">"</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-smi">salary</span>;
  };
};

<span class="pl-c"><span class="pl-c">//</span> we can also create method in Employee's prototype:</span>
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span>.<span class="pl-en">formatSalary2</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
    <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>$ <span class="pl-pds">"</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-smi">salary</span>;
}

<span class="pl-c"><span class="pl-c">//</span>creating objects</span>
<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Yuri Garagin<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Company 1<span class="pl-pds">'</span></span>, <span class="pl-c1">1000000</span>);
<span class="pl-k">var</span> emp2 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Dinesh Gupta<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Company 2<span class="pl-pds">'</span></span>, <span class="pl-c1">1039999</span>);
<span class="pl-k">var</span> emp3 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Erich Fromm<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Company 3<span class="pl-pds">'</span></span>, <span class="pl-c1">1299483</span>);</pre></div>
<p>Here each instance variable <code>emp1</code>, <code>emp2</code>, <code>emp3</code> has own copy of <code>formatSalary</code> method. However the <code>formatSalary2</code> will only be added once to an object <code>Employee.prototype</code>.</p>
<h2><a id="user-content-question-4-what-is-closure-in-javascript-can-you-provide-an-example" class="anchor" aria-hidden="true" href="#question-4-what-is-closure-in-javascript-can-you-provide-an-example"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 4. What is “closure” in javascript? Can you provide an example?</h2>
<h3><a id="user-content-answer-3" class="anchor" aria-hidden="true" href="#answer-3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>A closure is a function defined inside another function (called parent function) and has access to the variable which is declared and defined in parent function scope.</p>

<ul>
<li>Variable declared in his own scope</li>
<li>Variable declared in parent function scope</li>
<li>Variable declared in the global namespace</li>
</ul>
<p>The closure has access to the variable in three scopes:</p><div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> globalVar <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>abc<span class="pl-pds">"</span></span>;

<span class="pl-c"><span class="pl-c">//</span> Parent self invoking function</span>
(<span class="pl-k">function</span> <span class="pl-en">outerFunction</span> (<span class="pl-smi">outerArg</span>) { <span class="pl-c"><span class="pl-c">//</span> begin of scope outerFunction</span>
  <span class="pl-c"><span class="pl-c">//</span> Variable declared in outerFunction function scope</span>
  <span class="pl-k">var</span> outerFuncVar <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>x<span class="pl-pds">'</span></span>;    
  <span class="pl-c"><span class="pl-c">//</span> Closure self-invoking function</span>
  (<span class="pl-k">function</span> <span class="pl-en">innerFunction</span> (<span class="pl-smi">innerArg</span>) { <span class="pl-c"><span class="pl-c">//</span> begin of scope innerFunction</span>
    <span class="pl-c"><span class="pl-c">//</span> variable declared in innerFunction function scope</span>
    <span class="pl-k">var</span> innerFuncVar <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>y<span class="pl-pds">"</span></span>;
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(         
      <span class="pl-s"><span class="pl-pds">"</span>outerArg = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> outerArg <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>outerFuncVar = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> outerFuncVar <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>innerArg = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> innerArg <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>innerFuncVar = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> innerFuncVar <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span><span class="pl-cce">\n</span><span class="pl-pds">"</span></span> <span class="pl-k">+</span>
      <span class="pl-s"><span class="pl-pds">"</span>globalVar = <span class="pl-pds">"</span></span> <span class="pl-k">+</span> globalVar);
  <span class="pl-c"><span class="pl-c">//</span> end of scope innerFunction</span>
  })(<span class="pl-c1">5</span>); <span class="pl-c"><span class="pl-c">//</span> Pass 5 as parameter</span>
<span class="pl-c"><span class="pl-c">//</span> end of scope outerFunction</span>
})(<span class="pl-c1">7</span>); <span class="pl-c"><span class="pl-c">//</span> Pass 7 as parameter</span></pre></div>
<p><code>innerFunction</code> is closure which is defined inside <code>outerFunction</code> and has access to all variable which is declared and defined in outerFunction scope. In addition to this function defined inside the function as closure has access to the variable which is declared in <code>global namespace</code>.</p>
<p>Output of above code would be:</p>
<div class="highlight highlight-source-js"><pre>outerArg <span class="pl-k">=</span> <span class="pl-c1">7</span>
outerFuncVar <span class="pl-k">=</span> x
innerArg <span class="pl-k">=</span> <span class="pl-c1">5</span>
innerFuncVar <span class="pl-k">=</span> y
globalVar <span class="pl-k">=</span> abc</pre></div>
<h2><a id="user-content-question-5-write-a-mul-function-which-will-work-properly-when-invoked-with-following-syntax" class="anchor" aria-hidden="true" href="#question-5-write-a-mul-function-which-will-work-properly-when-invoked-with-following-syntax"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 5. Write a mul function which will work properly when invoked with following syntax.</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)(<span class="pl-c1">4</span>)); <span class="pl-c"><span class="pl-c">//</span> output : 24</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">4</span>)(<span class="pl-c1">3</span>)(<span class="pl-c1">4</span>)); <span class="pl-c"><span class="pl-c">//</span> output : 48</span></pre></div>
<h3><a id="user-content-answer-4" class="anchor" aria-hidden="true" href="#answer-4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>Below is the code followed by the explanation of how it works:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span> (<span class="pl-smi">x</span>) {
  <span class="pl-k">return</span> <span class="pl-k">function</span> (<span class="pl-smi">y</span>) { <span class="pl-c"><span class="pl-c">//</span> anonymous function</span>
    <span class="pl-k">return</span> <span class="pl-k">function</span> (<span class="pl-smi">z</span>) { <span class="pl-c"><span class="pl-c">//</span> anonymous function</span>
      <span class="pl-k">return</span> x <span class="pl-k">*</span> y <span class="pl-k">*</span> z;
    };
  };
}</pre></div>
<p>Here the <code>mul</code> function accepts the first argument and returns the anonymous function which takes the second parameter and returns the anonymous function which takes the third parameter and returns the multiplication of arguments which is being passed in successive</p>
<p>In Javascript function defined inside has access to outer function variable and function is the first class object so it can be returned by the function as well and passed as an argument in another function.</p>
<ul>
<li>A function is an instance of the Object type</li>
<li>A function can have properties and has a link back to its constructor method</li>
<li>A function can be stored as variable</li>
<li>A function can be pass as a parameter to another function</li>
<li>A function can be returned from another function</li>
</ul>
<h2><a id="user-content-question-6-how-to-empty-an-array-in-javascript" class="anchor" aria-hidden="true" href="#question-6-how-to-empty-an-array-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 6. How to empty an array in JavaScript?</h2>
<p>For instance:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span>  [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>];</pre></div>
<p>How can we empty the array above?</p>
<h3><a id="user-content-answer-5" class="anchor" aria-hidden="true" href="#answer-5"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>There are a couple of ways by which we can empty an array, So let's discuss all the possible way by which we can empty an array.</p>
<h4><a id="user-content-method-1" class="anchor" aria-hidden="true" href="#method-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 1</h4>
<div class="highlight highlight-source-js"><pre>arrayList <span class="pl-k">=</span> [];</pre></div>
<p>The code above will set the variable <code>arrayList</code> to a new empty array. This is recommended if you don't have <strong>references to the original array</strong> <code>arrayList</code> 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 <code>arrayList</code>.</p>
<p>For instance:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>]; <span class="pl-c"><span class="pl-c">//</span> Created array</span>
<span class="pl-k">var</span> anotherArrayList <span class="pl-k">=</span> arrayList;  <span class="pl-c"><span class="pl-c">//</span> Referenced arrayList by another variable</span>
arrayList <span class="pl-k">=</span> []; <span class="pl-c"><span class="pl-c">//</span> Empty the array</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(anotherArrayList); <span class="pl-c"><span class="pl-c">//</span> Output ['a', 'b', 'c', 'd', 'e', 'f']</span></pre></div>
<h4><a id="user-content-method-2" class="anchor" aria-hidden="true" href="#method-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 2</h4>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span> <span class="pl-k">=</span> <span class="pl-c1">0</span>;</pre></div>
<p>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.</p>
<p>For instance:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>]; <span class="pl-c"><span class="pl-c">//</span> Created array</span>
<span class="pl-k">var</span> anotherArrayList <span class="pl-k">=</span> arrayList;  <span class="pl-c"><span class="pl-c">//</span> Referenced arrayList by another variable</span>
<span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span> <span class="pl-k">=</span> <span class="pl-c1">0</span>; <span class="pl-c"><span class="pl-c">//</span> Empty the array by setting length to 0</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(anotherArrayList); <span class="pl-c"><span class="pl-c">//</span> Output []</span></pre></div>
<h4><a id="user-content-method-3" class="anchor" aria-hidden="true" href="#method-3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 3</h4>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">arrayList</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">0</span>, <span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span>);</pre></div>
<p>Above implementation will also work perfectly. This way of empty the array will also update all the references of the original array.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>]; <span class="pl-c"><span class="pl-c">//</span> Created array</span>
<span class="pl-k">var</span> anotherArrayList <span class="pl-k">=</span> arrayList;  <span class="pl-c"><span class="pl-c">//</span> Referenced arrayList by another variable</span>
<span class="pl-smi">arrayList</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">0</span>, <span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span>); <span class="pl-c"><span class="pl-c">//</span> Empty the array by setting length to 0</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(anotherArrayList); <span class="pl-c"><span class="pl-c">//</span> Output []</span></pre></div>
<h4><a id="user-content-method-4" class="anchor" aria-hidden="true" href="#method-4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 4</h4>
<div class="highlight highlight-source-js"><pre><span class="pl-k">while</span>(<span class="pl-smi">arrayList</span>.<span class="pl-c1">length</span>) {
  <span class="pl-smi">arrayList</span>.<span class="pl-c1">pop</span>();
}</pre></div>
<p>Above implementation can also empty the array. But not recommended to use often.</p>
<h2><a id="user-content-question-7-how-to-check-if-an-object-is-an-array-or-not" class="anchor" aria-hidden="true" href="#question-7-how-to-check-if-an-object-is-an-array-or-not"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 7. How to check if an object is an array or not?</h2>
<h3><a id="user-content-answer-6" class="anchor" aria-hidden="true" href="#answer-6"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The best way to find whether an object is instance of a particular class or not using <code>toString</code> method from <code>Object.prototype</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrayList <span class="pl-k">=</span> [<span class="pl-c1">1</span> , <span class="pl-c1">2</span>, <span class="pl-c1">3</span>];</pre></div>
<p>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 <code>greet</code> which can take a single string and also a list of strings. To make our <code>greet</code> method workable in both situation we need to know what kind of parameter is being passed: is it single value or list of values?</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">greet</span>(<span class="pl-smi">param</span>) {
  <span class="pl-k">if</span>() {
    <span class="pl-c"><span class="pl-c">//</span> here have to check whether param is array or not</span>
  }
  <span class="pl-k">else</span> {
  }
}</pre></div>
<p>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.</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-k">function</span> <span class="pl-en">greet</span>(<span class="pl-smi">param</span>) {
   <span class="pl-k">if</span>(<span class="pl-k">typeof</span> param <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>string<span class="pl-pds">'</span></span>) {
   }
   <span class="pl-k">else</span> {
     <span class="pl-c"><span class="pl-c">//</span> If param is of type array then this block of code would execute</span>
   }
 }</pre></div>
<p>Now it's fine we can go with the previous two implementations, but when we have a situation like a parameter can be <code>single value</code>, <code>array</code>, and <code>object</code> type then we will be in trouble.</p>
<p>Coming back to checking the type of an object, As we mentioned that we can use <code>Object.prototype.toString</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">toString</span>.<span class="pl-c1">call</span>(arrayList) <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>[object Array]<span class="pl-pds">'</span></span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Array!<span class="pl-pds">'</span></span>);
}</pre></div>
<p>If you are using <code>jQuery</code> then you can also used jQuery <code>isArray</code> method:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-smi">$</span>.<span class="pl-en">isArray</span>(arrayList)) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Array<span class="pl-pds">'</span></span>);
} <span class="pl-k">else</span> {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Not an array<span class="pl-pds">'</span></span>);
}</pre></div>
<p>FYI jQuery uses <code>Object.prototype.toString.call</code> internally to check whether an object is an array or not.</p>
<p>In modern browser, you can also use:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Array</span>.<span class="pl-en">isArray</span>(arrayList);</pre></div>
<p><code>Array.isArray</code> is supported by Chrome 5, Firefox 4.0, IE 9, Opera 10.5 and Safari 5</p>
<h2><a id="user-content-question-8-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-8-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 8. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> output <span class="pl-k">=</span> (<span class="pl-k">function</span>(<span class="pl-smi">x</span>) {
  <span class="pl-k">delete</span> x;
  <span class="pl-k">return</span> x;
})(<span class="pl-c1">0</span>);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(output);</pre></div>
<h3><a id="user-content-answer-7" class="anchor" aria-hidden="true" href="#answer-7"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>0</code> as output. <code>delete</code> operator is used to delete a property from an object. Here <code>x</code> is not an object it's <strong>local variable</strong>. <code>delete</code> operator doesn't affect local variables.</p>
<h2><a id="user-content-question-9-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-9-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 9. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x <span class="pl-k">=</span> <span class="pl-c1">1</span>;
<span class="pl-k">var</span> output <span class="pl-k">=</span> (<span class="pl-k">function</span>() {
  <span class="pl-k">delete</span> x;
  <span class="pl-k">return</span> x;
})();

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(output);</pre></div>
<h3><a id="user-content-answer-8" class="anchor" aria-hidden="true" href="#answer-8"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>1</code> as output. <code>delete</code> operator is used to delete a property from an object. Here <code>x</code> is not an object it's <strong>global variable</strong> of type <code>number</code>.</p>
<h2><a id="user-content-question-10-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-10-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 10. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> x <span class="pl-k">=</span> { foo <span class="pl-k">:</span> <span class="pl-c1">1</span>};
<span class="pl-k">var</span> output <span class="pl-k">=</span> (<span class="pl-k">function</span>() {
  <span class="pl-k">delete</span> <span class="pl-smi">x</span>.<span class="pl-smi">foo</span>;
  <span class="pl-k">return</span> <span class="pl-smi">x</span>.<span class="pl-smi">foo</span>;
})();

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(output);</pre></div>
<h3><a id="user-content-answer-9" class="anchor" aria-hidden="true" href="#answer-9"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>undefined</code> as output. <code>delete</code> operator is used to delete a property from an object. Here <code>x</code> is an object which has foo as a property and from a self-invoking function, we are deleting the <code>foo</code> property of object <code>x</code> and after deletion, we are trying to reference deleted property <code>foo</code> which result <code>undefined</code>.</p>
<h2><a id="user-content-question-11-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-11-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 11. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> Employee <span class="pl-k">=</span> {
  company<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz<span class="pl-pds">'</span></span>
}
<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(Employee);
<span class="pl-k">delete</span> <span class="pl-smi">emp1</span>.<span class="pl-smi">company</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">emp1</span>.<span class="pl-smi">company</span>);</pre></div>
<h3><a id="user-content-answer-10" class="anchor" aria-hidden="true" href="#answer-10"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>xyz</code> as output. Here <code>emp1</code> object got company as <strong>prototype</strong> property. delete operator doesn't delete prototype property.</p>
<p><code>emp1</code> object doesn't have <strong>company</strong> as its own property. you can test it <code>console.log(emp1.hasOwnProperty('company')); //output : false</code> However, we can delete company property directly from <code>Employee</code> object using <code>delete Employee.company</code> or we can also delete from <code>emp1</code> object using <code>__proto__</code> property <code>delete emp1.__proto__.company</code>.</p>
<h2><a id="user-content-question-12-what-is-undefined-x-1-in-javascript" class="anchor" aria-hidden="true" href="#question-12-what-is-undefined-x-1-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 12. What is <code>undefined x 1</code> in JavaScript</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> trees <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">"</span>redwood<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>bay<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>cedar<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>oak<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>maple<span class="pl-pds">"</span></span>];
<span class="pl-k">delete</span> trees[<span class="pl-c1">3</span>];</pre></div>
<h3><a id="user-content-answer-11" class="anchor" aria-hidden="true" href="#answer-11"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<ul>
<li>When you run the code above and do <code>console.log(trees);</code> in chrome developer console then you will get <code>["redwood", "bay", "cedar", undefined × 1, "maple"]</code>.</li>
<li>In the recent versions of Chrome you will see the word <code>empty</code> of <code>undefined x 1</code>.</li>
<li>When you run the same code in Firefox browser console then you will get <code>["redwood", "bay", "cedar", undefined, "maple"]</code></li>
</ul>
<p>Clearly we can see that Chrome has its own way of displaying uninitialized index in arrays. However when you check <code>trees[3] === undefined</code> in any browser you will get similar output as <code>true</code>.</p>
<p><strong>Note:</strong> Please remember that you need not check for the uninitialized index of the array in  <code>trees[3] === 'undefined × 1'</code> it will give an error because <code>'undefined × 1'</code> this is just way of displaying an uninitialized index of an array in chrome.</p>
<h2><a id="user-content-question-13-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-13-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 13. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> trees <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>xxxx<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>test<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>ryan<span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>apple<span class="pl-pds">"</span></span>];
<span class="pl-k">delete</span> trees[<span class="pl-c1">3</span>];
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">trees</span>.<span class="pl-c1">length</span>);</pre></div>
<h3><a id="user-content-answer-12" class="anchor" aria-hidden="true" href="#answer-12"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>5</code> as output. When we used <code>delete</code> 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 <code>delete</code> operator.</p>
<p>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 <code>undefined x 1</code> in <strong>chrome</strong> and <code>undefined</code> is placed at the index. If you do <code>console.log(trees)</code> output <code>["xyz", "xxxx", "test", undefined × 1, "apple"]</code> in Chrome and in Firefox <code>["xyz", "xxxx", "test", undefined, "apple"]</code>.</p>
<h2><a id="user-content-question-14-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-14-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 14. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> bar <span class="pl-k">=</span> <span class="pl-c1">true</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-c1">0</span>);   
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>);  
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-c1">true</span>);  
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(bar <span class="pl-k">+</span> <span class="pl-c1">false</span>);</pre></div>
<h3><a id="user-content-answer-13" class="anchor" aria-hidden="true" href="#answer-13"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output <code>1, "truexyz", 2, 1</code> as output. Here's a general guideline  for the plus operator:</p>
<ul>
<li>Number + Number  -&gt; Addition</li>
<li>Boolean + Number -&gt; Addition</li>
<li>Boolean + Boolean -&gt; Addition</li>
<li>Number + String  -&gt; Concatenation</li>
<li>String + Boolean -&gt; Concatenation</li>
<li>String + String  -&gt; Concatenation</li>
</ul>
<h2><a id="user-content-question-15-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-15-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 15. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> z <span class="pl-k">=</span> <span class="pl-c1">1</span>, y <span class="pl-k">=</span> z <span class="pl-k">=</span> <span class="pl-k">typeof</span> y;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(y);</pre></div>
<h3><a id="user-content-answer-14" class="anchor" aria-hidden="true" href="#answer-14"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will print string <code>"undefined"</code> 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 <code>Right to Left</code> so first <code>typeof y</code> will evaluate first which is string <code>"undefined"</code> and assigned to <code>z</code> and then <code>y</code> would be assigned the value of z. The overall sequence will look like that:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> z;
z <span class="pl-k">=</span> <span class="pl-c1">1</span>;
<span class="pl-k">var</span> y;
z <span class="pl-k">=</span> <span class="pl-k">typeof</span> y;
y <span class="pl-k">=</span> z;</pre></div>
<h2><a id="user-content-question-16-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-16-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 16. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> NFE (Named Function Expression)</span>
<span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">bar</span>() { <span class="pl-k">return</span> <span class="pl-c1">12</span>; };
<span class="pl-k">typeof</span> <span class="pl-en">bar</span>();</pre></div>
<h3><a id="user-content-answer-15" class="anchor" aria-hidden="true" href="#answer-15"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The output will be <code>Reference Error</code>. To fix the bug we can try to rewrite the code a little bit:</p>
<p><strong>Sample 1</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">bar</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() { <span class="pl-k">return</span> <span class="pl-c1">12</span>; };
<span class="pl-k">typeof</span> <span class="pl-en">bar</span>();</pre></div>
<p>or</p>
<p><strong>Sample 2</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">bar</span>() { <span class="pl-k">return</span> <span class="pl-c1">12</span>; };
<span class="pl-k">typeof</span> <span class="pl-en">bar</span>();</pre></div>
<p>The function definition can have only one reference variable as a function name, In <strong>sample 1</strong> <code>bar</code> is reference variable which is pointing to <code>anonymous function</code> and in <strong>sample 2</strong> we have function statement and <code>bar</code> is the function name.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">bar</span>() {
  <span class="pl-c"><span class="pl-c">//</span> foo is visible here</span>
  <span class="pl-c"><span class="pl-c">//</span> bar is visible here</span>
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-en">bar</span>()); <span class="pl-c"><span class="pl-c">//</span> Works here :)</span>
};
<span class="pl-c"><span class="pl-c">//</span> foo is visible here</span>
<span class="pl-c"><span class="pl-c">//</span> bar is undefined here</span></pre></div>
<h2><a id="user-content-question-17a-what-is-the-difference-between-declaring-a-function-in-the-formats-listed-below" class="anchor" aria-hidden="true" href="#question-17a-what-is-the-difference-between-declaring-a-function-in-the-formats-listed-below"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 17a. What is the difference between declaring a function in the formats listed below?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Some code</span>
}</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">bar</span> () {
  <span class="pl-c"><span class="pl-c">//</span> Some code</span>
}</pre></div>
<h3><a id="user-content-answer-16" class="anchor" aria-hidden="true" href="#answer-16"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The main difference is that function <code>foo</code> is defined at <code>run-time</code> and is called a function expression, whereas function <code>bar</code> is defined at <code>parse time</code> and is called a function statement. To understand it better, let's take a look at the code below :</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Run-Time function declaration</span>
  <span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Call foo function here, It will give an error</span>
  <span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am inside Foo<span class="pl-pds">"</span></span>);
  };</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Parse-Time function declaration</span>
<span class="pl-en">bar</span>(); <span class="pl-c"><span class="pl-c">//</span> Call bar function here, It will not give an Error</span>
<span class="pl-k">function</span> <span class="pl-en">bar</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am inside Foo<span class="pl-pds">"</span></span>);
}</pre></div>
<h2><a id="user-content-question-17b-what-is-the-output-of-the-following" class="anchor" aria-hidden="true" href="#question-17b-what-is-the-output-of-the-following"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 17b. What is the output of the following?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-en">bar</span>();
(<span class="pl-k">function</span> <span class="pl-en">abc</span>(){<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>something<span class="pl-pds">'</span></span>)})();
<span class="pl-k">function</span> <span class="pl-en">bar</span>(){<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>bar got called<span class="pl-pds">'</span></span>)};</pre></div>
<h3><a id="user-content-answer-17" class="anchor" aria-hidden="true" href="#answer-17"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The output will be :</p>
<pre><code>bar got called
something
</code></pre>
<p>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.</p>
<h2><a id="user-content-question-18-in-which-case-the-function-definition-is-not-hoisted-in-javascript" class="anchor" aria-hidden="true" href="#question-18-in-which-case-the-function-definition-is-not-hoisted-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 18. In which case the function definition is not hoisted in JavaScript?</h2>
<h3><a id="user-content-answer-18" class="anchor" aria-hidden="true" href="#answer-18"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>Let's take the following <strong>function expression</strong></p>
<div class="highlight highlight-source-js"><pre> <span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
     <span class="pl-k">return</span> <span class="pl-c1">12</span>;
 }</pre></div>
<p>In JavaScript <code>var</code>-declared variables and functions are <code>hoisted</code>. Let's take function <code>hoisting</code> 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:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Here foo is still undefined</span>
<span class="pl-k">var</span> <span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
  <span class="pl-k">return</span> <span class="pl-c1">12</span>;
};</pre></div>
<p>The code above behind the scene look something like this:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> foo <span class="pl-k">=</span> <span class="pl-c1">undefined</span>;
<span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Here foo is undefined</span>
<span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Some code stuff</span>
}</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> foo <span class="pl-k">=</span> <span class="pl-c1">undefined</span>;
<span class="pl-en">foo</span> <span class="pl-k">=</span> <span class="pl-k">function</span> <span class="pl-en">foo</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Some code stuff</span>
}
<span class="pl-en">foo</span>(); <span class="pl-c"><span class="pl-c">//</span> Now foo is defined here</span></pre></div>
<h2><a id="user-content-question-19-what-will-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-19-what-will-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 19. What will be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>1000$<span class="pl-pds">"</span></span>;

(<span class="pl-k">function</span> () {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Original salary was <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);

  <span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>5000$<span class="pl-pds">"</span></span>;

  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>My New Salary <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);
})();</pre></div>
<h3><a id="user-content-answer-19" class="anchor" aria-hidden="true" href="#answer-19"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The code above will output: <code>undefined, 5000$</code> because of hoisting. In the code presented above, you might be expecting <code>salary</code> to retain it values from outer scope until the point that <code>salary</code> was re-declared in the inner scope. But due to <code>hoisting</code> salary value was <code>undefined</code> instead. To understand it better have a look of the following code, here <code>salary</code> variable is hoisted and declared at the top in function scope. When we print its value using <code>console.log</code> the result is <code>undefined</code>. Afterwards the variable is redeclared and the new value <code>"5000$"</code> is assigned to it.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>1000$<span class="pl-pds">"</span></span>;

(<span class="pl-k">function</span> () {
  <span class="pl-k">var</span> salary <span class="pl-k">=</span> <span class="pl-c1">undefined</span>;
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Original salary was <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);

  salary <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>5000$<span class="pl-pds">"</span></span>;

  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>My New Salary <span class="pl-pds">"</span></span> <span class="pl-k">+</span> salary);
})();</pre></div>
<h2><a id="user-content-question-20-whats-the-difference-between-typeof-and-instanceof" class="anchor" aria-hidden="true" href="#question-20-whats-the-difference-between-typeof-and-instanceof"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 20. What’s the difference between <code>typeof</code> and <code>instanceof</code>?</h2>
<h3><a id="user-content-answer-20" class="anchor" aria-hidden="true" href="#answer-20"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p><code>typeof</code> is an operator that returns a string with the type of whatever you pass.</p>
<p>The <code>typeof</code> operator checks if a value belongs to one of the seven basic types: <code>number</code>, <code>string</code>, <code>boolean</code>, <code>object</code>, <code>function</code>, <code>undefined</code> or <code>Symbol</code>.</p>
<p><code>typeof(null)</code> will return <code>object</code>.</p>
<p><code>instanceof</code> 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. <code>instanceof</code> doesn’t work with primitive types. It <code>instanceof</code> operator checks the current object and returns true if the object is of the specified type, for example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> dog <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Animal</span>();
dog <span class="pl-k">instanceof</span> Animal; <span class="pl-c"><span class="pl-c">//</span> Output : true</span></pre></div>
<p>Here <code>dog instanceof Animal</code> is true since <code>dog</code> inherits from <code>Animal.prototype</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> name <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">String</span>(<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>);
name <span class="pl-k">instanceof</span> <span class="pl-c1">String</span>; <span class="pl-c"><span class="pl-c">//</span> Output : true</span></pre></div>
<p>Ref Link: <a href="http://stackoverflow.com/questions/2449254/what-is-the-instanceof-operator-in-javascript" rel="nofollow">http://stackoverflow.com/questions/2449254/what-is-the-instanceof-operator-in-javascript</a></p>
<h2><a id="user-content-question-21-calculate-the-length-of-the-associative-array" class="anchor" aria-hidden="true" href="#question-21-calculate-the-length-of-the-associative-array"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 21. Calculate the length of the associative array</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> counterArray <span class="pl-k">=</span> {
  <span class="pl-c1">A</span> <span class="pl-k">:</span> <span class="pl-c1">3</span>,
  <span class="pl-c1">B</span> <span class="pl-k">:</span> <span class="pl-c1">4</span>
};
counterArray[<span class="pl-s"><span class="pl-pds">"</span>C<span class="pl-pds">"</span></span>] <span class="pl-k">=</span> <span class="pl-c1">1</span>;</pre></div>
<h3><a id="user-content-answer-21" class="anchor" aria-hidden="true" href="#answer-21"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>First of all, in case of JavaScript an associative array is the same as an object. Secondly, even though is no built-in function or property available to calculate the length/size an object, we can write such function ourselves.</p>
<h4><a id="user-content-method-1-1" class="anchor" aria-hidden="true" href="#method-1-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 1</h4>
<p><code>Object</code> has <code>keys</code> method which can we used to calculate the length of object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(counterArray).<span class="pl-c1">length</span>; <span class="pl-c"><span class="pl-c">//</span> Output 3</span></pre></div>
<h4><a id="user-content-method-2-1" class="anchor" aria-hidden="true" href="#method-2-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 2</h4>
<p>We can also calculate the length of object by iterating through the object and by doing a count of own property of object. This way we will ignoge the properties that came from the object's prototype chain:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getLength</span>(<span class="pl-smi">object</span>) {
  <span class="pl-k">var</span> count <span class="pl-k">=</span> <span class="pl-c1">0</span>;
  <span class="pl-k">for</span>(key <span class="pl-k">in</span> object) {
    <span class="pl-c"><span class="pl-c">//</span> hasOwnProperty method check own property of object</span>
    <span class="pl-k">if</span>(<span class="pl-smi">object</span>.<span class="pl-en">hasOwnProperty</span>(key)) count<span class="pl-k">++</span>;
  }
  <span class="pl-k">return</span> count;
}</pre></div>
<h4><a id="user-content-method-3-1" class="anchor" aria-hidden="true" href="#method-3-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 3</h4>
<p>All modern browsers (including IE9+) support the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames" rel="nofollow"><code>getOwnPropertyNames</code></a> method, so we can calculate the length using the following code:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Object</span>.<span class="pl-en">getOwnPropertyNames</span>(counterArray).<span class="pl-c1">length</span>; <span class="pl-c"><span class="pl-c">//</span> Output 3</span></pre></div>
<h4><a id="user-content-method-4-1" class="anchor" aria-hidden="true" href="#method-4-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 4</h4>
<p><a href="https://underscorejs.org/#size" rel="nofollow">Underscore</a> and <a href="https://lodash.com/docs/4.17.10#size" rel="nofollow">lodash</a> libraries have the method <code>size</code> dedicated to calculate the object length. We don't recommend to include one of these libraries just to use the <code>size</code> method, but if it's already used in your project - why not?</p>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">_</span>.<span class="pl-c1">size</span>({one<span class="pl-k">:</span> <span class="pl-c1">1</span>, two<span class="pl-k">:</span> <span class="pl-c1">2</span>, three<span class="pl-k">:</span> <span class="pl-c1">3</span>});
<span class="pl-k">=&gt;</span> <span class="pl-c1">3</span></pre></div>
<h2><a id="user-content-question-22-difference-between-function-method-and-constructor-calls-in-javascript" class="anchor" aria-hidden="true" href="#question-22-difference-between-function-method-and-constructor-calls-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 22. Difference between <code>Function</code>, <code>Method</code> and <code>Constructor</code> calls in JavaScript.</h2>
<p>If your are familiar with Object-oriented programming, More likely familiar to thinking of functions, methods, and class constructors as three separate things. But In JavaScript, these are just three different usage patterns of one single construct.</p>
<p>functions : The simplest usages of function call:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">helloWorld</span>(<span class="pl-smi">name</span>) {
  <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>hello world, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> name;
}

<span class="pl-en">helloWorld</span>(<span class="pl-s"><span class="pl-pds">"</span>JS Geeks<span class="pl-pds">"</span></span>); <span class="pl-c"><span class="pl-c">//</span> "hello world JS Geeks"</span></pre></div>
<p>Methods in JavaScript are nothing more than object properties that are functions.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
  <span class="pl-en">helloWorld</span> <span class="pl-k">:</span> <span class="pl-k">function</span>() {
    <span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">"</span>hello world, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>;
  },
  name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John Carter<span class="pl-pds">'</span></span>
}
<span class="pl-smi">obj</span>.<span class="pl-en">helloWorld</span>(); <span class="pl-c"><span class="pl-c">//</span> // "hello world John Carter"</span></pre></div>
<p>Notice how <code>helloWorld</code> refer to <code>this</code> properties of obj. Here it's clear or you might have already understood that <code>this</code> gets bound to <code>obj</code>. But the interesting point that we can copy a reference to the same function <code>helloWorld</code> in another object and get a difference answer. Let see:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj2 <span class="pl-k">=</span> {
  helloWorld <span class="pl-k">:</span> <span class="pl-smi">obj</span>.<span class="pl-smi">helloWorld</span>,
  name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John Doe<span class="pl-pds">'</span></span>
}
<span class="pl-smi">obj2</span>.<span class="pl-en">helloWorld</span>(); <span class="pl-c"><span class="pl-c">//</span> "hello world John Doe"</span></pre></div>
<p>You might be wonder what exactly happens in a method call here. Here we call the expression itself determine the binding of this <code>this</code>, The expression <code>obj2.helloWorld()</code> looks up the <code>helloWorld</code> property of obj and calls it with receiver object <code>obj2</code>.</p>
<p>The third use of functions is as constructors. Like function and method, <code>constructors</code> are defined with function.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">name</span>, <span class="pl-smi">age</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name;
  <span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age;
}

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>John Doe<span class="pl-pds">'</span></span>, <span class="pl-c1">28</span>);
<span class="pl-smi">emp1</span>.<span class="pl-c1">name</span>; <span class="pl-c"><span class="pl-c">//</span> "John Doe"</span>
<span class="pl-smi">emp1</span>.<span class="pl-smi">age</span>; <span class="pl-c"><span class="pl-c">//</span> 28</span></pre></div>
<p>Unlike function calls and method calls, a constructor call <code>new Employee('John Doe', 28)</code> creates a brand new object and passes it as the value of <code>this</code>, and implicitly returns the new object as its result.</p>
<p>The primary role of the constructor function is to initialize the object.</p>
<h2><a id="user-content-question-23-what-would-be-the-output-of-the-following-code" class="anchor" aria-hidden="true" href="#question-23-what-would-be-the-output-of-the-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 23. What would be the output of the following code?</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">User</span>(<span class="pl-smi">name</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>JsGeeks<span class="pl-pds">"</span></span>;
}

<span class="pl-k">var</span> person <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">User</span>(<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>)[<span class="pl-s"><span class="pl-pds">"</span>location<span class="pl-pds">"</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>USA<span class="pl-pds">"</span></span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(person);</pre></div>
<h3><a id="user-content-answer-22" class="anchor" aria-hidden="true" href="#answer-22"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The output of above code would be <code>"USA"</code>. Here <code>new User("xyz")</code> creates a brand new object and created property <code>location</code> on that and <code>USA</code> has been assigned to object property location and that has been referenced by the person.</p>
<p>Let say <code>new User("xyz")</code> created a object called <code>foo</code>. The value <code>"USA"</code> will be assigned to <code>foo["location"]</code>, but according to <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-assignment-operators-runtime-semantics-evaluation" rel="nofollow">ECMAScript Specification</a> , pt 12.14.4 the assignment will itself return the rightmost value: in our case it's <code>"USA"</code>.
Then it will be assigned to person.</p>
<p>To better understand what's going on here, try to execute this code in console, line by line:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">User</span>(<span class="pl-smi">name</span>) {
 <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>JsGeeks<span class="pl-pds">"</span></span>;
}

<span class="pl-k">var</span> person;
<span class="pl-k">var</span> foo <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">User</span>(<span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>);
foo[<span class="pl-s"><span class="pl-pds">"</span>location<span class="pl-pds">"</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>USA<span class="pl-pds">"</span></span>;
<span class="pl-c"><span class="pl-c">//</span> the console will show you that the result of this is "USA"</span>
</pre></div>
<h2><a id="user-content-question-24-what-are-service-workers-and-when-can-you-use-them" class="anchor" aria-hidden="true" href="#question-24-what-are-service-workers-and-when-can-you-use-them"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 24. What are Service Workers and when can you use them?</h2>
<h3><a id="user-content-answer-23" class="anchor" aria-hidden="true" href="#answer-23"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>It’s a technology that allows your web application to use cached resources first, and provide default experience offline, before getting more data from the network later. This principle is commonly known as Offline First.</p>
<p>Service Workers actively use promises. A Service Worker has to be installed,activated and then it can react on fetch, push and sync events.</p>
<p>As of 2017, Service Workers are not supported in IE and Safari.</p>
<h2><a id="user-content-question-25-what-is-the-difference-between-a-method-and-a-function-in-javascript" class="anchor" aria-hidden="true" href="#question-25-what-is-the-difference-between-a-method-and-a-function-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 25. What is the difference between a method and a function in javascript?</h2>
<p>In JS, that difference is quite subtle. A function is a piece of code that is called by name and function itself not associated with any object and not defined inside any object. It can be passed data to operate on (i.e. parameter) and can optionally return data (the return value).</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Function statement</span>
<span class="pl-k">function</span> <span class="pl-en">myFunc</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Do some stuff;</span>
}

<span class="pl-c"><span class="pl-c">//</span> Calling the function</span>
<span class="pl-en">myFunc</span>();</pre></div>
<p>Here myFunc() function call is not associated with object hence not invoked through any object.</p>
<p>A function can take a form of immediately invoked function expression (IIFE):</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Anonymous Self-invoking Function</span>
(<span class="pl-k">function</span>() {
  <span class="pl-c"><span class="pl-c">//</span> Do some stuff;</span>
})();</pre></div>
<p>Finally there are also arrow functions:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">const</span> <span class="pl-c1">myFunc</span> <span class="pl-k">=</span> <span class="pl-smi">arg</span> <span class="pl-k">=&gt;</span> {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>hello<span class="pl-pds">"</span></span>, arg)
} </pre></div>
<p>A method is a piece of code that is called by its name and that is associated with the object. Methods are functions. When you call a method like this <code>obj1.myMethod()</code>, the reference to <code>obj1</code> gets assigned (bound) to <code>this</code> variable. In other words, the value of <code>this</code> will be <code>obj1</code> inside <code>myMethod</code>.</p>
<p>Here are some examples of methods:</p>
<h5><a id="user-content-example-1" class="anchor" aria-hidden="true" href="#example-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example 1</h5>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj1 <span class="pl-k">=</span> {
  attribute<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>,
  <span class="pl-en">myMethod</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {  <span class="pl-c"><span class="pl-c">//</span> Method</span>
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">attribute</span>);
  }
};

<span class="pl-c"><span class="pl-c">//</span> Call the method</span>
<span class="pl-smi">obj1</span>.<span class="pl-en">myMethod</span>();</pre></div>
<p>Here <code>obj1</code> is an object and <code>myMethod</code> is a method which is associated with <code>obj1</code>.</p>
<h5><a id="user-content-example-2" class="anchor" aria-hidden="true" href="#example-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example 2</h5>
<p>In ES6 we have classes. There the methods will look like this:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">class</span> <span class="pl-en">MyAwesomeClass</span> {
  <span class="pl-en">myMethod</span>() {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>hi there<span class="pl-pds">"</span></span>);
  }
}

<span class="pl-k">const</span> <span class="pl-c1">obj1</span> <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">MyAwesomeClass</span>();
<span class="pl-smi">obj1</span>.<span class="pl-en">myMethod</span>();</pre></div>
<p>Understand: the method is not some kind of special type of a function, and it's not about how you declare a function. It's the way we <strong>call</strong> a function. Look at that:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj1 <span class="pl-k">=</span> {
  prop1<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>buddy<span class="pl-pds">"</span></span>
}; 
<span class="pl-k">var</span> <span class="pl-en">myFunc</span> <span class="pl-k">=</span> <span class="pl-k">function</span> () {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi there<span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
};
<span class="pl-c"><span class="pl-c">//</span> let's call myFunc as a function: </span>
<span class="pl-en">myFunc</span>(); <span class="pl-c"><span class="pl-c">//</span> will output "Hi there undefined" or "Hi there Window"</span>
 
<span class="pl-smi">obj1</span>.<span class="pl-smi">myMethod</span> <span class="pl-k">=</span> myFunc;
<span class="pl-c"><span class="pl-c">//</span>now we're calling myFunc as a method of obj1, so this will point to obj1</span>
<span class="pl-smi">obj1</span>.<span class="pl-en">myMethod</span>(); <span class="pl-c"><span class="pl-c">//</span> will print "Hi there" following with obj1. </span>
</pre></div>
<h2><a id="user-content-question-26-what-is-iife-immediately-invoked-function-expression-and-how-it-can-be-useful" class="anchor" aria-hidden="true" href="#question-26-what-is-iife-immediately-invoked-function-expression-and-how-it-can-be-useful"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 26. What is IIFE (Immediately Invoked Function Expression) and how it can be useful?</h2>
<h3><a id="user-content-answer-24" class="anchor" aria-hidden="true" href="#answer-24"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<h4><a id="user-content-definition" class="anchor" aria-hidden="true" href="#definition"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Definition</h4>
<p>IIFE a function that runs as soon as it's defined. Usually it's anonymous (doesn't have a function name), but it also can be named. Here's an example of IIFE:</p>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE!<span class="pl-pds">"</span></span>);
})();
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE!"</span></pre></div>
<h4><a id="user-content-explanation" class="anchor" aria-hidden="true" href="#explanation"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Explanation</h4>
<p>So, here's how it works. Remember the difference between function statements (<code>function a () {}</code>) and function expressions (<code>var a = function() {}</code>)? So, IIFE is a function expression. To make it an expression we surround our function declaration into the parens. We do it to explicitly tell the parser that it's an expression, not a statement (JS doesn't allow statements in parens).</p>
<p>After the function you can see the two <code>()</code> braces, this is how we run the function we just declared.</p>
<p>That's it. The rest is details.</p>
<ul>
<li>
<p>The function inside IIFE doesn't have to be anonymous. This one will work perfectly fine and will help to detect your function in a stacktrace during debugging:</p>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">myIIFEFunc</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE!<span class="pl-pds">"</span></span>);
})();
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE!"</span></pre></div>
</li>
<li>
<p>It can take some parameters:</p>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">myIIFEFunc</span>(<span class="pl-smi">param1</span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> param1);
})(<span class="pl-s"><span class="pl-pds">"</span>Yuri<span class="pl-pds">"</span></span>);
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE, Yuri!"</span></pre></div>
<p>Here there value <code>"Yuri"</code> is passed to the <code>param1</code> of the function.</p>
</li>
<li>
<p>It can return a value:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> result <span class="pl-k">=</span> (<span class="pl-k">function</span> <span class="pl-en">myIIFEFunc</span>(<span class="pl-smi">param1</span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi, I'm IIFE, <span class="pl-pds">"</span></span> <span class="pl-k">+</span> param1);
  <span class="pl-k">return</span> <span class="pl-c1">1</span>;
})(<span class="pl-s"><span class="pl-pds">"</span>Yuri<span class="pl-pds">"</span></span>);
<span class="pl-c"><span class="pl-c">//</span> outputs "Hi, I'm IIFE, Yuri!"</span>
<span class="pl-c"><span class="pl-c">//</span> result variable will contain 1</span></pre></div>
</li>
<li>
<p>You don't have to surround the function declaration into parens, although it's the most common way to define IIFE. Instead you can use any of the following forms:</p>
<ul>
<li><code>~function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>!function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>+function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>-function(){console.log("hi I'm IIFE")}()</code></li>
<li><code>(function(){console.log("hi I'm IIFE")}());</code></li>
<li><code>var i = function(){console.log("hi I'm IIFE")}();</code></li>
<li><code>true &amp;&amp; function(){ console.log("hi I'm IIFE") }();</code></li>
<li><code>0, function(){ console.log("hi I'm IIFE") }();</code></li>
<li><code>new function(){ console.log("hi I'm IIFE") }</code></li>
<li><code>new function(){ console.log("hi I'm IIFE") }()</code></li>
</ul>
<p>Please don't use all these forms to impress colleagues, but be prepared that you can encounter them in someone's code.</p>
</li>
</ul>
<h4><a id="user-content-applications-and-usefulness" class="anchor" aria-hidden="true" href="#applications-and-usefulness"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Applications and usefulness</h4>
<p>Variables and functions that you declare inside an IIFE are not visible to the outside world, so you can:</p>
<ul>
<li>Use the IIFE for isolating parts of the code to hide details of implementation.</li>
<li>Specify the input interface of your code by passing commonly used global objects (window, document, jQuery, etc.) IIFE’s parameters, and then reference these global objects within the IIFE via a local scope.</li>
<li>Use it in closures, when you use closures in loops.</li>
<li>IIFE is the basis of in the module pattern in ES5
code, it helps to prevent polluting the global scope and provide the module interface to the outside.</li>
</ul>
<h2><a id="user-content-question-27-describe-singleton-pattern-in-javascript" class="anchor" aria-hidden="true" href="#question-27-describe-singleton-pattern-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 27. Describe Singleton Pattern In JavaScript</h2>
<h3><a id="user-content-answer-25" class="anchor" aria-hidden="true" href="#answer-25"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<p>The singleton pattern is an often used JavaScript design pattern. It provides a way to wrap the code into a logical unit that can be accessed through a single variable. The Singleton design pattern is used when only one instance of an object is needed throughout the lifetime of an application. In JavaScript, Singleton pattern have many uses, they can be used for NameSpacing, which reduce the number of global variables in your page (prevent from polluting global space), organizing the code in a consistent manner, which increase the readability and maintainability of your pages.</p>
<p>There are two important points in the traditional definition of Singleton pattern:</p>
<ul>
<li>There should be only one instance allowed for a class and</li>
<li>We should allow global point of access to that single instance</li>
</ul>
<p>Let me define singleton pattern in JavaScript context:</p>
<blockquote>
<p>It is an object that is used to create namespace and group together a related set of methods and attributes (encapsulation) and if we allow to initiate then it can be initiated only once.</p>
</blockquote>
<p>In JavaScript, we can create singleton though object literal. However, there is some another way but that I will cover in next post.</p>
<p>A singleton object consists of two parts: The object itself, containing the members (Both methods and attributes) within it, and global variable used to access it. The variable is global so that object can be accessed anywhere in the page, this is a key feature of the singleton pattern.</p>
<p><strong>JavaScript: A Singleton as a Namespace</strong></p>
<p>As I have already stated above that singleton can be used to declare Namespace in JavaScript. NameSpacing is a large part of responsible programming in JavaScript. Because everything can be overwritten, and it is very easy to wipe out variable by mistake or a function, or even a class without even knowing it. A common example which happens frequently when you are working with another team member parallel,</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">findUserName</span>(<span class="pl-smi">id</span>) {

}

<span class="pl-c"><span class="pl-c">/*</span> Later in the page another programmer</span>
<span class="pl-c">added code <span class="pl-c">*/</span></span>
<span class="pl-k">var</span> findUserName <span class="pl-k">=</span> <span class="pl-en">$</span>(<span class="pl-s"><span class="pl-pds">'</span>#user_list<span class="pl-pds">'</span></span>);

<span class="pl-c"><span class="pl-c">/*</span> You are trying to call :( <span class="pl-c">*/</span></span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">findUserName</span>())</pre></div>
<p>One of the best ways to prevent accidentally overwriting variable is to namespace your code within a singleton object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">/*</span>  Using Namespace <span class="pl-c">*/</span></span>

<span class="pl-k">var</span> MyNameSpace <span class="pl-k">=</span> {
  <span class="pl-en">findUserName</span> <span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">id</span>) {},
  <span class="pl-c"><span class="pl-c">//</span> Other methods and attribute go here as well</span>
}

<span class="pl-c"><span class="pl-c">/*</span> Later in the page another programmer</span>
<span class="pl-c">added code <span class="pl-c">*/</span></span>
<span class="pl-k">var</span> findUserName <span class="pl-k">=</span> <span class="pl-en">$</span>(<span class="pl-s"><span class="pl-pds">'</span>#user_list<span class="pl-pds">'</span></span>);

<span class="pl-c"><span class="pl-c">/*</span> You are trying to call and you make this time workable <span class="pl-c">*/</span></span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">MyNameSpace</span>.<span class="pl-en">findUserName</span>());</pre></div>
<h3><a id="user-content-singleton-design-pattern-implementation" class="anchor" aria-hidden="true" href="#singleton-design-pattern-implementation"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Singleton Design Pattern Implementation</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">/*</span> Lazy Instantiation skeleton for a singleton pattern <span class="pl-c">*/</span></span>

<span class="pl-k">var</span> MyNameSpace <span class="pl-k">=</span> {};
<span class="pl-smi">MyNameSpace</span>.<span class="pl-smi">Singleton</span> <span class="pl-k">=</span> (<span class="pl-k">function</span>() {

  <span class="pl-c"><span class="pl-c">//</span> Private attribute that holds the single instance</span>
  <span class="pl-k">var</span> singletonInstance;  

  <span class="pl-c"><span class="pl-c">//</span> All of the normal code goes here</span>
  <span class="pl-k">function</span> <span class="pl-en">constructor</span>() {
    <span class="pl-c"><span class="pl-c">//</span> Private members</span>
    <span class="pl-k">var</span> privateVar1 <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>;
    <span class="pl-k">var</span> privateVar2 <span class="pl-k">=</span> [<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];

    <span class="pl-k">function</span> <span class="pl-en">privateMethod1</span>() {
      <span class="pl-c"><span class="pl-c">//</span> code stuff</span>
    }

    <span class="pl-k">function</span> <span class="pl-en">privateMethod1</span>() {
      <span class="pl-c"><span class="pl-c">//</span> code stuff</span>
    }

    <span class="pl-k">return</span> {
      attribute1 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>,
      <span class="pl-en">publicMethod</span><span class="pl-k">:</span> <span class="pl-k">function</span>() {
        <span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>);<span class="pl-c"><span class="pl-c">//</span> some code logic</span>
      }
    }
  }

  <span class="pl-k">return</span> {
    <span class="pl-c"><span class="pl-c">//</span> public method (Global access point to Singleton object)</span>
    <span class="pl-en">getInstance</span><span class="pl-k">:</span> <span class="pl-k">function</span>() {
      <span class="pl-c"><span class="pl-c">//</span>instance already exist then return  </span>
      <span class="pl-k">if</span>(<span class="pl-k">!</span>singletonInstance) {
        singletonInstance <span class="pl-k">=</span> <span class="pl-en">constructor</span>();
      }
      <span class="pl-k">return</span> singletonInstance;           
    }           
  }

})();   

<span class="pl-c"><span class="pl-c">//</span> getting access of publicMethod</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">MyNamespace</span>.<span class="pl-smi">Singleton</span>.<span class="pl-en">getInstance</span>().<span class="pl-en">publicMethod</span>());</pre></div>
<p>The singleton implemented above is easy to understand. The singleton class maintains a static reference to the lone singleton instance and return that reference from the static getInstance() method.</p>
<h2><a id="user-content-question-28-what-are-the-ways-of-creating-objects-in-javascript-" class="anchor" aria-hidden="true" href="#question-28-what-are-the-ways-of-creating-objects-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 28. What are the ways of creating objects in JavaScript ?</h2>
<h3><a id="user-content-answer-26" class="anchor" aria-hidden="true" href="#answer-26"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Answer</h3>
<h4><a id="user-content-method-1-function-based" class="anchor" aria-hidden="true" href="#method-1-function-based"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 1: Function based</h4>
<p>This method is useful if we want to create several similar objects. In the code sample below, we wrote the function <code>Employee</code> and used it as a constructor by calling it with the <code>new</code> operator.</p>
<div class="highlight highlight-source-js"><pre>  <span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">fName</span>, <span class="pl-smi">lName</span>, <span class="pl-smi">age</span>, <span class="pl-smi">salary</span>){
  	<span class="pl-c1">this</span>.<span class="pl-smi">firstName</span> <span class="pl-k">=</span> fName;
  	<span class="pl-c1">this</span>.<span class="pl-smi">lastName</span> <span class="pl-k">=</span> lName;
  	<span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age;
  	<span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> salary;
  }

  <span class="pl-c"><span class="pl-c">//</span> Creating multiple object which have similar property but diff value assigned to object property.</span>
  <span class="pl-k">var</span> employee1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Moto<span class="pl-pds">'</span></span>, <span class="pl-c1">24</span>, <span class="pl-s"><span class="pl-pds">'</span>5000$<span class="pl-pds">'</span></span>);
  <span class="pl-k">var</span> employee1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Ryan<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Jor<span class="pl-pds">'</span></span>, <span class="pl-c1">26</span>, <span class="pl-s"><span class="pl-pds">'</span>3000$<span class="pl-pds">'</span></span>);
  <span class="pl-k">var</span> employee1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>Andre<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>Salt<span class="pl-pds">'</span></span>, <span class="pl-c1">26</span>, <span class="pl-s"><span class="pl-pds">'</span>4000$<span class="pl-pds">'</span></span>);</pre></div>
<h4><a id="user-content-method-2-object-literal" class="anchor" aria-hidden="true" href="#method-2-object-literal"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 2: Object Literal</h4>
<p>Object Literal is best way to create an object and this is used frequently. Below is code sample for create employee object which contains property as well as method.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	salary <span class="pl-k">:</span> <span class="pl-c1">245678</span>,
	<span class="pl-en">getName</span> <span class="pl-k">:</span> <span class="pl-k">function</span>(){
		<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>;
	}
}</pre></div>
<p>The code sample below is Nested Object Literal, Here address is an object inside employee object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	salary <span class="pl-k">:</span> <span class="pl-c1">245678</span>,
	address <span class="pl-k">:</span> {
		addressLine1 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>BITS Pilani<span class="pl-pds">'</span></span>,
		addressLine2 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Vidya Vihar<span class="pl-pds">'</span></span>.
		phoneNumber<span class="pl-k">:</span> {
		  workPhone<span class="pl-k">:</span> <span class="pl-c1">7098889765</span>,
		  homePhone<span class="pl-k">:</span> <span class="pl-c1">1234567898</span>
		}
	}
}</pre></div>
<h4><a id="user-content-method-3-from-object-using-new-keyword" class="anchor" aria-hidden="true" href="#method-3-from-object-using-new-keyword"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 3: From <code>Object</code> using <code>new</code> keyword</h4>
<p>In the code below, a sample object has been created using <code>Object</code>'s constructor function.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Object</span>(); <span class="pl-c"><span class="pl-c">//</span> Created employee object using new keywords and Object()</span>
<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>;
<span class="pl-smi">employee</span>.<span class="pl-en">getName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
	<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>;
}</pre></div>
<h4><a id="user-content-method-4-using-objectcreate" class="anchor" aria-hidden="true" href="#method-4-using-objectcreate"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Method 4:** Using <code>Object.create</code></h4>
<p><code>Object.create(obj)</code> will create a new object and set the <code>obj</code> as its prototype. It’s a modern way to create objects that inherit properties from other objects. <code>Object.create</code> function doesn’t run the constructor. You can use <code>Object.create(null)</code> when you don’t want your object to inherit the properties of <code>Object</code>.</p>
<h2><a id="user-content-question-29-write-a-function-called-deepclone-which-takes-an-object-and-creates-a-object-copy-of-it" class="anchor" aria-hidden="true" href="#question-29-write-a-function-called-deepclone-which-takes-an-object-and-creates-a-object-copy-of-it"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 29. Write a function called deepClone which takes an object and creates a object copy of it.</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> newObject <span class="pl-k">=</span> <span class="pl-en">deepClone</span>(obj);</pre></div>
<p>Solution:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">deepClone</span>(<span class="pl-smi">object</span>){
	<span class="pl-k">var</span> newObject <span class="pl-k">=</span> {};
	<span class="pl-k">for</span>(<span class="pl-k">var</span> key <span class="pl-k">in</span> object){
		<span class="pl-k">if</span>(<span class="pl-k">typeof</span> object[key] <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>object<span class="pl-pds">'</span></span>  <span class="pl-k">&amp;&amp;</span> object[key] <span class="pl-k">!==</span> <span class="pl-c1">null</span> ){
		 newObject[key] <span class="pl-k">=</span> <span class="pl-en">deepClone</span>(object[key]);
		}<span class="pl-k">else</span>{
		 newObject[key] <span class="pl-k">=</span> object[key];
		}
	}
	<span class="pl-k">return</span> newObject;
}</pre></div>
<p><strong>Explanation:</strong> We have been asked to do deep copy of object so What's basically it's mean ??. Let's understand in this way you have been given an object <code>personalDetail</code> this object contains some property which again a type of object here as you can see <code>address</code> is an object and <code>phoneNumber</code> in side an <code>address</code> is also an object. In simple term <code>personalDetail</code> is nested object(object inside object). So Here deep copy means we have to copy all the property of <code>personalDetail</code> object including nested object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> personalDetail <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	address <span class="pl-k">:</span> {
	  location<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz<span class="pl-pds">'</span></span>,
	  zip <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>123456<span class="pl-pds">'</span></span>,
	  phoneNumber <span class="pl-k">:</span> {
	    homePhone<span class="pl-k">:</span> <span class="pl-c1">8797912345</span>,
	    workPhone <span class="pl-k">:</span> <span class="pl-c1">1234509876</span>
	  }
	}
}</pre></div>
<p>So when we do deep clone then we should copy every property (including the nested object).</p>
<h2><a id="user-content-question-30-best-way-to-detect-undefined-object-property-in-javascript" class="anchor" aria-hidden="true" href="#question-30-best-way-to-detect-undefined-object-property-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 30. Best way to detect <code>undefined</code> object property in JavaScript.</h2>
<blockquote>
<p>Suppose we have given an object <code>person</code></p>
</blockquote>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	age <span class="pl-k">:</span> <span class="pl-c1">24</span>
}</pre></div>
<p>Here the <code>person</code> object has a <code>name</code> and <code>age</code> property. Now we are trying to access the <strong>salary</strong> property which we haven't declared on the person object so while accessing it will return undefined. So how we will ensure whether property is undefined or not before performing some operation over it?</p>
<p><strong>Explanation:</strong></p>
<p>We can use <code>typeof</code> operator to check undefined</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-k">typeof</span> someProperty <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>something is undefined here<span class="pl-pds">'</span></span>);
}</pre></div>
<p>Now we are trying to access salary property of person object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">if</span>(<span class="pl-k">typeof</span> <span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>salary is undefined here because we haven't declared<span class="pl-pds">"</span></span>);
}</pre></div>
<h2><a id="user-content-question-31-write-a-function-called-clone-which-takes-an-object-and-creates-a-object-copy-of-it-but-not-copy-deep-property-of-object" class="anchor" aria-hidden="true" href="#question-31-write-a-function-called-clone-which-takes-an-object-and-creates-a-object-copy-of-it-but-not-copy-deep-property-of-object"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 31. Write a function called <code>Clone</code> which takes an object and creates a object copy of it but not copy deep property of object.</h2>
<div class="highlight highlight-source-js"><pre>   <span class="pl-k">var</span> objectLit <span class="pl-k">=</span> {foo <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Bar<span class="pl-pds">'</span></span>}; 
	<span class="pl-k">var</span> cloneObj <span class="pl-k">=</span> <span class="pl-en">Clone</span>(obj); <span class="pl-c"><span class="pl-c">//</span> Clone is the function which you have to write </span>
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(cloneObj <span class="pl-k">===</span> <span class="pl-en">Clone</span>(objectLit)); <span class="pl-c"><span class="pl-c">//</span> this should return false</span>
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(cloneObj <span class="pl-k">==</span> <span class="pl-en">Clone</span>(objectLit)); <span class="pl-c"><span class="pl-c">//</span> this should return true</span></pre></div>
<p><strong>solution:</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Clone</span>(<span class="pl-smi">object</span>){
  <span class="pl-k">var</span> newObject <span class="pl-k">=</span> {};
  <span class="pl-k">for</span>(<span class="pl-k">var</span> key <span class="pl-k">in</span> object){
  	newObject[key] <span class="pl-k">=</span> object[key];
  }
  <span class="pl-k">return</span> newObject;
}</pre></div>
<h2><a id="user-content-question-32-what-are-promises-and-how-they-are-useful" class="anchor" aria-hidden="true" href="#question-32-what-are-promises-and-how-they-are-useful"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 32. What are promises and how they are useful?</h2>
<p>We use promises for handling asynchronous interactions in a sequential manner. They are especially useful when we need to do an async operation and THEN do another async operation based on the results of the first one. For example, if you want to request the list of all flights and then for each flight you want to request some details about it. The promise represents the future value. It has an internal state (<code>pending</code>, <code>fulfilled</code> and <code>rejected</code>) and works like a state machine.</p>
<p>A promise object has <code>then</code> method, where you can specify what to do when the promise is fulfilled or rejected.</p>
<p>You can chain <code>then()</code> blocks, thus avoiding the callback hell. You can handle errors in the <code>catch()</code> block.  After a promise is set to fulfilled or rejected state, it becomes immutable.</p>
<p>Also mention that you know about more sophisticated concepts:</p>
<ul>
<li><code>async/await</code> which makes the code appear even more linear</li>
<li>RxJS observables can be viewed as the recyclable promises</li>
</ul>
<p>Be sure that you can implement the promise, read <a href="https://opensourceconnections.com/blog/2014/02/16/a-simple-promise-implementation-in-about-20-lines-of-javascript/" rel="nofollow">one of the articles on a topic</a>, and learn the source code of the <a href="https://gist.github.com/softwaredoug/9044640">simplest promise implementation</a>.</p>
<h2><a id="user-content-question-33-how-to-check-whether-a-key-exist-in-a-javascript-object-or-not" class="anchor" aria-hidden="true" href="#question-33-how-to-check-whether-a-key-exist-in-a-javascript-object-or-not"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 33. How to check whether a key exist in a JavaScript object or not.</h2>
<p>Let say we have <code>person</code> object with property <strong>name</strong> and <strong>age</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
	age<span class="pl-k">:</span> <span class="pl-c1">24</span>
}</pre></div>
<p>Now we want to check whether <code>name</code> property exist in <code>person</code> object or not ?</p>
<p>In JavaScript object can have own property, in above example name and age is own property of person object. Object also have some of inherited property of base object like toString is inherited property of person object.</p>
<p>So how we will check whether property is own property or inherited property.</p>
<p>Method 1: We can use <code>in</code> operator on objet to check own property or inherited property.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>name<span class="pl-pds">'</span></span> <span class="pl-k">in</span> person); <span class="pl-c"><span class="pl-c">//</span> checking own property print true </span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>salary<span class="pl-pds">'</span></span> <span class="pl-k">in</span> person); <span class="pl-c"><span class="pl-c">//</span> checking undefined property print false</span></pre></div>
<p><code>in</code> operator also look into inherited property if it doesn't find property defined as own property. For instance If I check existence of toString property as we know that we haven't declared this property on person object so <code>in</code> operator look into there base property.</p>
<p>Here</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>toString<span class="pl-pds">'</span></span> <span class="pl-k">in</span> person); <span class="pl-c"><span class="pl-c">//</span> Will print true</span></pre></div>
<p>If we want to test property of object instance not inherited properties then we will use <code>hasOwnProperty</code> method of object instance.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">person</span>.<span class="pl-en">hasOwnProperty</span>(<span class="pl-s"><span class="pl-pds">'</span>toString<span class="pl-pds">'</span></span>)); <span class="pl-c"><span class="pl-c">//</span> print false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">person</span>.<span class="pl-en">hasOwnProperty</span>(<span class="pl-s"><span class="pl-pds">'</span>name<span class="pl-pds">'</span></span>)); <span class="pl-c"><span class="pl-c">//</span> print true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">person</span>.<span class="pl-en">hasOwnProperty</span>(<span class="pl-s"><span class="pl-pds">'</span>salary<span class="pl-pds">'</span></span>)); <span class="pl-c"><span class="pl-c">//</span> print false</span></pre></div>
<h2><a id="user-content-question-34-what-is-nan-why-do-we-need-it-and-when-can-it-break-the-page" class="anchor" aria-hidden="true" href="#question-34-what-is-nan-why-do-we-need-it-and-when-can-it-break-the-page"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 34. What is NaN, why do we need it, and when can it break the page?</h2>
<p><code>NaN</code> stands for “not a number.” and it can break your table of numbers when it has an arithmetic operation that is not allowed. Here are some examples of how you can get <code>NaN</code>:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">Math</span>.<span class="pl-c1">sqrt</span>(<span class="pl-k">-</span><span class="pl-c1">5</span>);
<span class="pl-c1">Math</span>.<span class="pl-c1">log</span>(<span class="pl-k">-</span><span class="pl-c1">1</span>);
<span class="pl-c1">parseFloat</span>(<span class="pl-s"><span class="pl-pds">"</span>foo<span class="pl-pds">"</span></span>); <span class="pl-c"><span class="pl-c">/*</span> this is common: you get JSON from the server, convert some strings from JSON to a number and end up with NaN in your UI. <span class="pl-c">*/</span></span></pre></div>
<p><code>NaN</code> is not equal to any number, it’s not less or more than any number, also it's not equal to itself:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">NaN</span> <span class="pl-k">!==</span> <span class="pl-c1">NaN</span>
<span class="pl-c1">NaN</span> <span class="pl-k">&lt;</span> <span class="pl-c1">2</span> <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-c1">NaN</span> <span class="pl-k">&gt;</span> <span class="pl-c1">2</span> <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-c1">NaN</span> <span class="pl-k">===</span> <span class="pl-c1">2</span> <span class="pl-c"><span class="pl-c">//</span> false</span></pre></div>
<p>To check if the current value of the variable is NaN, you have to use the <code>isNaN</code> function. This is why we can often see NaN in the webpages: it requires special check which a lot of developers forget to do.</p>
<p>Further reading: <a href="https://ariya.io/2014/05/the-curious-case-of-javascript-nan" rel="nofollow">great blogpost on ariya.io</a></p>
<h2><a id="user-content-question-35-fix-the-bug-using-es5-only" class="anchor" aria-hidden="true" href="#question-35-fix-the-bug-using-es5-only"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 35. Fix the bug using ES5 only</h2>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arr <span class="pl-k">=</span> [<span class="pl-c1">10</span>, <span class="pl-c1">32</span>, <span class="pl-c1">65</span>, <span class="pl-c1">2</span>];
<span class="pl-k">for</span> (<span class="pl-k">var</span> i <span class="pl-k">=</span> <span class="pl-c1">0</span>; i <span class="pl-k">&lt;</span> <span class="pl-smi">arr</span>.<span class="pl-c1">length</span>; i<span class="pl-k">++</span>) {
  <span class="pl-c1">setTimeout</span>(<span class="pl-k">function</span>() {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>The index of this number is: <span class="pl-pds">'</span></span> <span class="pl-k">+</span> i);
  }, <span class="pl-c1">3000</span>);
}</pre></div>
<p>For ES6, you can just replace <code>var i</code> with <code>let i</code>.</p>
<p>For ES5, you need to create a function scope like here:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arr <span class="pl-k">=</span> [<span class="pl-c1">10</span>, <span class="pl-c1">32</span>, <span class="pl-c1">65</span>, <span class="pl-c1">2</span>];
<span class="pl-k">for</span> (<span class="pl-k">var</span> i <span class="pl-k">=</span> <span class="pl-c1">0</span>; i <span class="pl-k">&lt;</span> <span class="pl-smi">arr</span>.<span class="pl-c1">length</span>; i<span class="pl-k">++</span>) {
  <span class="pl-c1">setTimeout</span>(<span class="pl-k">function</span>(<span class="pl-smi">j</span>) {
    <span class="pl-k">return</span> <span class="pl-k">function</span> () {
      <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>The index of this number is: <span class="pl-pds">'</span></span> <span class="pl-k">+</span> j)
    };
  }(i), <span class="pl-c1">3000</span>);
}</pre></div>
<h2><a id="user-content-question-36-how-to-check-if-the-value-of-a-variable-in-an-array" class="anchor" aria-hidden="true" href="#question-36-how-to-check-if-the-value-of-a-variable-in-an-array"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 36. How to check if the value of a variable in an array?</h2>
<p>We always encounter in such situation where we need to know whether value is type of array or not.</p>
<p>For instance : the code below perform some operation based value type</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span>(<span class="pl-smi">value</span>){
	<span class="pl-k">if</span>(<span class="pl-s"><span class="pl-pds">"</span>value is an array<span class="pl-pds">"</span></span>){
		<span class="pl-c"><span class="pl-c">//</span> Then perform some operation</span>
	}<span class="pl-k">else</span>{
		<span class="pl-c"><span class="pl-c">//</span> otherwise</span>
	}
}</pre></div>
<p>Let's discuss some way to detect an array in JavaScript.</p>
<p><strong>Method 1:</strong></p>
<p>Juriy Zaytsev (Also known as kangax) proposed an elegant solution to this.</p>
<div class="highlight highlight-source-js"><pre>	<span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>){
		<span class="pl-k">return</span> <span class="pl-c1">Object</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">toString</span>.<span class="pl-c1">call</span>(value) <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>[object Array]<span class="pl-pds">'</span></span>;
	}</pre></div>
<p>This approach is most popular way to detecting a value of type array in JavaScript and recommended to use. This approach relies on the fact that, native toString() method on a given value produce a standard string in all browser.</p>
<p><strong>Method 2:</strong></p>
<p>Duck typing test for array type detection</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-c"><span class="pl-c">//</span> Duck typing arrays</span>
 <span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>){
 	<span class="pl-k">return</span> <span class="pl-k">typeof</span> <span class="pl-smi">value</span>.<span class="pl-smi">sort</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>function<span class="pl-pds">'</span></span>;
 }</pre></div>
<p>As we can see above isArray method will return true if value object have <code>sort</code> method of type <code>function</code>. Now assume you have created a object with sort method</p>
<div class="highlight highlight-source-js"><pre>	<span class="pl-k">var</span> bar <span class="pl-k">=</span> {
		<span class="pl-en">sort</span><span class="pl-k">:</span> <span class="pl-k">function</span>(){
			<span class="pl-c"><span class="pl-c">//</span> Some code </span>
		}
	}</pre></div>
<p>Now when you check <code>isArray(bar)</code> then it will return true because bar object has sort method, But the fact is bar is not an array.</p>
<p>So this method is not a best way to detect an array as you can see it's not handle the case when some object has sort method.</p>
<p><strong>Method 3:</strong></p>
<p>ECMAScript 5 has introduced <strong>Array.isArray()</strong> method to detect an array type value. The sole purpose of this method is accurately detecting whether a value is an array or not.</p>
<p>In many JavaScript libraries you may see the code below for detecting an value of type array.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span>(<span class="pl-smi">value</span>){
   <span class="pl-c"><span class="pl-c">//</span> ECMAScript 5 feature</span>
	<span class="pl-k">if</span>(<span class="pl-k">typeof</span> <span class="pl-c1">Array</span>.<span class="pl-smi">isArray</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>function<span class="pl-pds">'</span></span>){
		<span class="pl-k">return</span> <span class="pl-c1">Array</span>.<span class="pl-en">isArray</span>(value);
	}<span class="pl-k">else</span>{
	   <span class="pl-k">return</span> <span class="pl-c1">Object</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">toString</span>.<span class="pl-c1">call</span>(value) <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>[object Array]<span class="pl-pds">'</span></span>;
	}
}</pre></div>
<p><strong>Method 4:</strong></p>
<p>You can query the constructor name:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>) {
	<span class="pl-k">return</span> <span class="pl-smi">value</span>.<span class="pl-c1">constructor</span>.<span class="pl-c1">name</span> <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">"</span>Array<span class="pl-pds">"</span></span>;
}
</pre></div>
<p><strong>Method 5:</strong></p>
<p>You check  if a given value is an <code>instanceof Array</code>:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">isArray</span>(<span class="pl-smi">value</span>) {
	<span class="pl-k">return</span> value <span class="pl-k">instanceof</span> <span class="pl-c1">Array</span>;
}</pre></div>
<h2><a id="user-content-question-37-best-way-to-detect-reference-values-of-any-type-in-javascript-" class="anchor" aria-hidden="true" href="#question-37-best-way-to-detect-reference-values-of-any-type-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 37. Best way to detect reference values of any type in JavaScript ?</h2>
<p>In Javascript Object are called as reference type, Any value other then primitive is definitely a reference type. There are several built-in reference type such as <strong>Object</strong>, <strong>Array</strong>, <strong>Function</strong>, <strong>Date</strong>, <strong>null</strong> and <strong>Error</strong>.</p>
<p>Detecting object using <code>typeof</code> operator</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> {});           <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> []);           <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>());  <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-c1">null</span>);         <span class="pl-c"><span class="pl-c">//</span> object </span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-k">new</span> <span class="pl-en">RegExp</span>()); <span class="pl-c"><span class="pl-c">//</span> object</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> <span class="pl-k">new</span> <span class="pl-en">Date</span>());   <span class="pl-c"><span class="pl-c">//</span> object</span></pre></div>
<p>But the downside of using typeof operator to detect an object is that typeof returns <code>object</code> for <code>null</code> (However this is fact that null is an object in JavaScript).</p>
<p>The best way to detect an object of specific reference type using <code>instanceof</code> operator.</p>
<blockquote>
<p>Syntax : <strong>value</strong> instanceof <strong>constructor</strong></p>
</blockquote>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>Detecting an array</span>
<span class="pl-k">if</span>(value <span class="pl-k">instanceof</span> <span class="pl-c1">Array</span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>value is type of array<span class="pl-pds">"</span></span>);
}</pre></div>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Employee constructor function</span>
<span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">name</span>){
	<span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name; <span class="pl-c"><span class="pl-c">//</span> Public property</span>
}

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> Employee); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<p><code>instanceof</code> not only check the constructor which is used to create an object but also check it's prototype chain see below example.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> <span class="pl-c1">Object</span>); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<h2><a id="user-content-question-38-how-does-objectcreate-method-works-javascript" class="anchor" aria-hidden="true" href="#question-38-how-does-objectcreate-method-works-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 38. How does Object.create method works JavaScript?</h2>
<p>The ECMAScript 5 <strong>Object.create()</strong> method is the easiest way for one object to inherit from another, without invoking a constructor function.</p>
<p><strong>For instance:</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
  name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Nishant<span class="pl-pds">'</span></span>,
  <span class="pl-en">displayName</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {
    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
  }
};

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(employee);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span>());  <span class="pl-c"><span class="pl-c">//</span> output "Nishant"</span></pre></div>
<p>In the example above, we create a new object <code>emp1</code> that inherits from <code>employee</code>. In other words <code>emp1</code>'s prototype is set to <code>employee</code>. After this emp1 is able to access the same properties and method on employee until new properties or method with the same name are defined.</p>
<p><strong>For instance:</strong> Defining <code>displayName()</code> method on <code>emp1</code> will not automatically override the employee <code>displayName</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>xyz-Anonymous<span class="pl-pds">'</span></span>);
};

<span class="pl-smi">employee</span>.<span class="pl-en">displayName</span>(); <span class="pl-c"><span class="pl-c">//</span>Nishant</span>
<span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span>();<span class="pl-c"><span class="pl-c">//</span>xyz-Anonymous</span></pre></div>
<p>In addition to this <strong><code>Object.create(</code>)</strong> method also allows to specify a second argument which is an object containing additional properties and methods to add to the new object.</p>
<p><strong>For example</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(employee, {
	name<span class="pl-k">:</span> {
		value<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>
	}
});

<span class="pl-smi">emp1</span>.<span class="pl-en">displayName</span>(); <span class="pl-c"><span class="pl-c">//</span> "John"</span>
<span class="pl-smi">employee</span>.<span class="pl-en">displayName</span>(); <span class="pl-c"><span class="pl-c">//</span> "Nishant"</span></pre></div>
<p>In the example above, <code>emp1</code> is created with it's own value for name, so calling <strong>displayName()</strong> method will display <code>"John"</code> instead of <code>"Nishant"</code>.</p>
<p>Object created in this manner give you full control over newly created object. You are free to add, remove any properties and method you want.</p>
<h2><a id="user-content-question-39-how-to-use-constructor-functions-for-inheritance-in-javascript" class="anchor" aria-hidden="true" href="#question-39-how-to-use-constructor-functions-for-inheritance-in-javascript"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 39. How to use constructor functions for inheritance in JavaScript?</h2>
<p>Let say we have <code>Person</code> class which has name, age, salary properties and <strong>incrementSalary()</strong> method.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Person</span>(<span class="pl-smi">name</span>, <span class="pl-smi">age</span>, <span class="pl-smi">salary</span>) {
  <span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name;
  <span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age;
  <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> salary;
  <span class="pl-c1">this</span>.<span class="pl-en">incrementSalary</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">byValue</span>) {
    <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-c1">this</span>.<span class="pl-smi">salary</span> <span class="pl-k">+</span> byValue;
  };
}</pre></div>
<p>Now we wish to create Employee class which contains all the properties of Person class and wanted to add some additional properties into Employee class.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Employee</span>(<span class="pl-smi">company</span>){
	<span class="pl-c1">this</span>.<span class="pl-smi">company</span> <span class="pl-k">=</span> company;
}

<span class="pl-c"><span class="pl-c">//</span>Prototypal Inheritance </span>
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span> <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Person</span>(<span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>, <span class="pl-c1">24</span>,<span class="pl-c1">5000</span>);</pre></div>
<p>In the example above, <strong>Employee</strong> type inherits from <strong>Person</strong>. It does so by assigning a new instance of <code>Person</code> to <code>Employee</code> prototype. After that, every instance of <code>Employee</code> inherits its properties and methods from <code>Person</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>Prototypal Inheritance </span>
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span> <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Person</span>(<span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>, <span class="pl-c1">24</span>,<span class="pl-c1">5000</span>);

<span class="pl-k">var</span> emp1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Employee</span>(<span class="pl-s"><span class="pl-pds">"</span>Google<span class="pl-pds">"</span></span>);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> Person); <span class="pl-c"><span class="pl-c">//</span> true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(emp1 <span class="pl-k">instanceof</span> Employee); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<p>Let's understand Constructor inheritance</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span>Defined Person class</span>
<span class="pl-k">function</span> <span class="pl-en">Person</span>(<span class="pl-smi">name</span>){
	<span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>;
}

<span class="pl-k">var</span> obj <span class="pl-k">=</span> {};

<span class="pl-c"><span class="pl-c">//</span> obj inherit Person class properties and method </span>
<span class="pl-smi">Person</span>.<span class="pl-c1">call</span>(obj); <span class="pl-c"><span class="pl-c">//</span> constructor inheritance</span>

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(obj); <span class="pl-c"><span class="pl-c">//</span> Object {name: "Nishant"}</span></pre></div>
<p>Here we saw calling <strong>Person.call(obj)</strong> define the name properties from <code>Person</code> to <code>obj</code>.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(name <span class="pl-k">in</span> obj); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<p>Type-based inheritance is best used with developer defined constructor function rather than natively in JavaScript. In addition to this also allows flexibility in how we create similar type of object.</p>
<h2><a id="user-content-question-40-how-we-can-prevent-modification-of-object-in-javascript-" class="anchor" aria-hidden="true" href="#question-40-how-we-can-prevent-modification-of-object-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 40. How we can prevent modification of object in JavaScript ?.</h2>
<p>ECMAScript 5 introduce several methods to prevent modification of object which lock down object to ensure that no one, accidentally or otherwise, change functionality of Object.</p>
<p>There are three levels of preventing modification:</p>
<p><strong>1: Prevent extensions :</strong></p>
<p>No new properties or methods can be added to the object, but one can change the existing properties and method.</p>
<p>For example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span> lock the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">preventExtensions</span>(employee);

<span class="pl-c"><span class="pl-c">//</span> Now try to change the employee object property name</span>
<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>; <span class="pl-c"><span class="pl-c">//</span> work fine </span>

<span class="pl-c"><span class="pl-c">//</span>Now try to add some new property to the object</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">24</span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's inside the strict mode</span></pre></div>
<p><strong>2: Seal :</strong></p>
<p>It is same as prevent extension, in addition to this also prevent existing properties and methods from being deleted.</p>
<p>To seal an object, we use <strong>Object.seal()</strong> method. you can check whether an object is sealed or not using <strong>Object.isSealed();</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span> Seal the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">seal</span>(employee);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isExtensible</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isSealed</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> true</span>

<span class="pl-k">delete</span> <span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's in strict mode</span>

<span class="pl-c"><span class="pl-c">//</span> Trying to add new property will give an error</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">30</span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span></pre></div>
<p>when an object is sealed, its existing properties and methods can't be removed. Sealed object are also non-extensible.</p>
<p><strong>3: Freeze :</strong></p>
<p>Same as seal, In addition to this prevent existing properties methods from being modified (All properties and methods are read only).</p>
<p>To freeze an object, use Object.freeze() method. We can also determine whether an object is frozen using Object.isFrozen();</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span>Freeze the object</span>
<span class="pl-c1">Object</span>.<span class="pl-en">freeze</span>(employee); 

<span class="pl-c"><span class="pl-c">//</span> Seal the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">seal</span>(employee);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isExtensible</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isSealed</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isFrozen</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>


<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">30</span>;     <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-k">delete</span> <span class="pl-smi">employee</span>.<span class="pl-c1">name</span>   <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's in strict mode</span></pre></div>
<p>Frozen objects are considered both non-extensible and sealed.</p>
<p><strong>Recommended:</strong></p>
<p>If you are decided to prevent modification, sealed, freeze the object then use in strict mode so that you can catch the error.</p>
<p>For example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-s"><span class="pl-pds">"</span>use strict<span class="pl-pds">"</span></span>;

<span class="pl-k">var</span> employee <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Nishant<span class="pl-pds">"</span></span>
};

<span class="pl-c"><span class="pl-c">//</span>Freeze the object</span>
<span class="pl-c1">Object</span>.<span class="pl-en">freeze</span>(employee); 

<span class="pl-c"><span class="pl-c">//</span> Seal the object </span>
<span class="pl-c1">Object</span>.<span class="pl-en">seal</span>(employee);

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isExtensible</span>(employee)); <span class="pl-c"><span class="pl-c">//</span> false</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isSealed</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-en">isFrozen</span>(employee));     <span class="pl-c"><span class="pl-c">//</span> true</span>


<span class="pl-smi">employee</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>xyz<span class="pl-pds">"</span></span>; <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-smi">employee</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> <span class="pl-c1">30</span>;     <span class="pl-c"><span class="pl-c">//</span> fails silently unless in strict mode</span>
<span class="pl-k">delete</span> <span class="pl-smi">employee</span>.<span class="pl-c1">name</span>;  <span class="pl-c"><span class="pl-c">//</span> fails silently unless it's in strict mode</span></pre></div>
<h2><a id="user-content-question-44-write-a-log-function-which-will-add-prefix-your-message-to-every-message-you-log-using-consolelog-" class="anchor" aria-hidden="true" href="#question-44-write-a-log-function-which-will-add-prefix-your-message-to-every-message-you-log-using-consolelog-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 44. Write a log function which will add prefix <code>(your message)</code> to every message you log using console.log ?</h2>
<p>For example, If you log <code>console.log("Some message")</code> then output should be <strong>(your message) Some message</strong></p>
<p>Logging error message or some informative message is always required when you dealing with client side JavaScript using console.log method. Some time you want to add some prefix to identify message generated log from your application hence you would like to prefix your app name in every console.log.</p>
<p>A general way to do this keep adding your app name in every console.log message like</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>your app name<span class="pl-pds">'</span></span> <span class="pl-k">+</span> <span class="pl-s"><span class="pl-pds">'</span>some error message<span class="pl-pds">'</span></span>);</pre></div>
<p>But doing in this way you have to write your app name everytime when you log message using console.</p>
<p>There are some best way we can achieve this</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">appLog</span>() {
  <span class="pl-k">var</span> args <span class="pl-k">=</span> <span class="pl-c1">Array</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">slice</span>.<span class="pl-c1">call</span>(<span class="pl-c1">arguments</span>);
  <span class="pl-smi">args</span>.<span class="pl-c1">unshift</span>(<span class="pl-s"><span class="pl-pds">'</span>your app name<span class="pl-pds">'</span></span>);
  <span class="pl-en">console</span>.<span class="pl-smi">log</span>.<span class="pl-c1">apply</span>(<span class="pl-en">console</span>, args);
}

<span class="pl-en">appLog</span>(<span class="pl-s"><span class="pl-pds">"</span>Some error message<span class="pl-pds">"</span></span>); 
<span class="pl-c"><span class="pl-c">//</span>output of above console: 'your app name Some error message'</span></pre></div>
<h2><a id="user-content-question-45--write-a-function-which-will-test-string-as-a-literal-and-as-an-object-" class="anchor" aria-hidden="true" href="#question-45--write-a-function-which-will-test-string-as-a-literal-and-as-an-object-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 45 . Write a function which will test string as a literal and as an object ?</h2>
<p>For example: We can create string using string literal and using String constructor function.</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-c"><span class="pl-c">//</span> using string literal</span>
 <span class="pl-k">var</span> ltrlStr <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi I am string literal<span class="pl-pds">"</span></span>;
 <span class="pl-c"><span class="pl-c">//</span> using String constructor function </span>
 <span class="pl-k">var</span> objStr <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">String</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am string object<span class="pl-pds">"</span></span>);</pre></div>
<p>We can use typeof operator to test string literal and instanceof operator to test String object.</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-k">function</span> <span class="pl-en">isString</span>(<span class="pl-smi">str</span>) {
 	<span class="pl-k">return</span> <span class="pl-k">typeof</span>(str) <span class="pl-k">==</span> <span class="pl-s"><span class="pl-pds">'</span>string<span class="pl-pds">'</span></span> <span class="pl-k">||</span> str <span class="pl-k">instanceof</span> <span class="pl-c1">String</span>;
 }
 
 <span class="pl-k">var</span> ltrlStr <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi I am string literal<span class="pl-pds">"</span></span>;
 <span class="pl-k">var</span> objStr <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">String</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am string object<span class="pl-pds">"</span></span>);
 <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">isString</span>(ltrlStr)); <span class="pl-c"><span class="pl-c">//</span> true</span>
 <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">isString</span>(objStr)); <span class="pl-c"><span class="pl-c">//</span> true</span></pre></div>
<h2><a id="user-content-question-46--what-is-typical-use-case-for-anonymous-function-in-javascript-" class="anchor" aria-hidden="true" href="#question-46--what-is-typical-use-case-for-anonymous-function-in-javascript-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 46 . What is typical use case for anonymous function in JavaScript ?</h2>
<p>Anonymous functions basically used in following scenario.</p>
<ol>
<li>
<p>No name is needed if function is only used in one place, then there is no need to add a name to function.</p>
<p>Let's take the example of setTimeout function</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c1">setTimeout</span>(<span class="pl-k">function</span>(){
	<span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Hello<span class="pl-pds">"</span></span>);
},<span class="pl-c1">1000</span>);</pre></div>
<p>Here there is no need of using named function when we are sure 	that function which will alert <code>hello</code> would use only once in 	application.</p>
</li>
<li>
<p>Anonymous functions are declared inline and inline functions have advantages in the case that they can access variable in the parent scopes.</p>
<p>Let's take a example of event handler. Notify event of particular 	type (such as click) for a given object.</p>
<p>Let say we have HTML element (button) on which we want to add click event and when user do click on button we would like to execute some logic.</p>
<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span> <span class="pl-e">id</span>=<span class="pl-s"><span class="pl-pds">"</span>myBtn<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
<p>Add Event Listener</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> btn <span class="pl-k">=</span> <span class="pl-c1">document</span>.<span class="pl-c1">getElementById</span>(<span class="pl-s"><span class="pl-pds">'</span>myBtn<span class="pl-pds">'</span></span>);
<span class="pl-smi">btn</span>.<span class="pl-c1">addEventListener</span>(<span class="pl-s"><span class="pl-pds">'</span>click<span class="pl-pds">'</span></span>, <span class="pl-k">function</span> () {
  <span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">'</span>button clicked<span class="pl-pds">'</span></span>);
});</pre></div>
<p>Above example shows used of anonymous function as a callback function in event handler.</p>
</li>
<li>
<p>Passing anonymous function as a parameter to calling function.</p>
<p>Example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-c"><span class="pl-c">//</span> Function which will execute callback function</span>
<span class="pl-k">function</span> <span class="pl-en">processCallback</span>(<span class="pl-smi">callback</span>){
	<span class="pl-k">if</span>(<span class="pl-k">typeof</span> callback <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>function<span class="pl-pds">'</span></span>){
		<span class="pl-en">callback</span>();
	}
}

<span class="pl-c"><span class="pl-c">//</span> Call function and pass anonymous function as callback </span>
<span class="pl-en">processCallback</span>(<span class="pl-k">function</span>(){
	<span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am anonymous callback function<span class="pl-pds">"</span></span>);
});</pre></div>
</li>
</ol>
<p>The best way to make a decision for using anonymous function is to ask the following question:</p>
<p>Will the function which I am going to define, be used anywhere else?</p>
<p>If your answer is yes then go and create named function rather anonymous function.</p>
<p><strong>Advantage of using anonymous function:</strong></p>
<ol>
<li>It can reduce a bit of code, particularly in recursive function and in callback function.</li>
<li>Avoid needless global namespace pollutions.</li>
</ol>
<h2><a id="user-content-question-47--how-to-set-a-default-parameter-value-" class="anchor" aria-hidden="true" href="#question-47--how-to-set-a-default-parameter-value-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 47 . How to set a default parameter value ?</h2>
<p>If you are coming from python/c# you might be using default value for function parameter incase value(formal parameter) has not been passed. For instance :</p>
<div class="highlight highlight-source-python"><pre><span class="pl-k">//</span> Define sentEmail function 
<span class="pl-k">//</span> configuration : Configuration <span class="pl-c1">object</span>
<span class="pl-k">//</span> provider : Email Service provider, Default would be gmail
<span class="pl-k">def</span> <span class="pl-en">sentEmail</span>(<span class="pl-smi">configuration</span>, <span class="pl-smi">provider</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Gmail<span class="pl-pds">'</span></span>):
	<span class="pl-c"><span class="pl-c">#</span> Your code logic</span></pre></div>
<p><strong>In Pre ES6/ES2015</strong></p>
<p>There are a lot of ways by which you can achieve this in pre ES2015.</p>
<p>Let's understand the code below by which we achieved setting default parameter value.</p>
<p><strong>Method 1: Setting default parameter value</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">sentEmail</span>(<span class="pl-smi">configuration</span>, <span class="pl-smi">provider</span>) {
  <span class="pl-c"><span class="pl-c">//</span> Set default value if user has not passed value for provider</span>
  provider <span class="pl-k">=</span> <span class="pl-k">typeof</span> provider <span class="pl-k">!==</span> <span class="pl-s"><span class="pl-pds">'</span>undefined<span class="pl-pds">'</span></span> <span class="pl-k">?</span> provider <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Gmail<span class="pl-pds">'</span></span>  
  <span class="pl-c"><span class="pl-c">//</span> Your code logic</span>
;
}
<span class="pl-c"><span class="pl-c">//</span> In this call we are not passing provider parameter value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
});
<span class="pl-c"><span class="pl-c">//</span> Here we are passing Yahoo Mail as a provider value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
}, <span class="pl-s"><span class="pl-pds">'</span>Yahoo Mail<span class="pl-pds">'</span></span>);</pre></div>
<p><strong>Method 2: Setting default parameter value</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">sentEmail</span>(<span class="pl-smi">configuration</span>, <span class="pl-smi">provider</span>) {
  <span class="pl-c"><span class="pl-c">//</span> Set default value if user has not passed value for provider</span>
  provider <span class="pl-k">=</span> provider <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">'</span>Gmail<span class="pl-pds">'</span></span>  
  <span class="pl-c"><span class="pl-c">//</span> Your code logic</span>
;
}
<span class="pl-c"><span class="pl-c">//</span> In this call we are not passing provider parameter value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
});
<span class="pl-c"><span class="pl-c">//</span> Here we are passing Yahoo Mail as a provider value</span>
<span class="pl-en">sentEmail</span>({
  from<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>xyz@gmail.com<span class="pl-pds">'</span></span>,
  subject<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Test Email<span class="pl-pds">'</span></span>
}, <span class="pl-s"><span class="pl-pds">'</span>Yahoo Mail<span class="pl-pds">'</span></span>);</pre></div>
<h2><a id="user-content-question-48-write-code-for-merge-two-javascript-object-dynamically" class="anchor" aria-hidden="true" href="#question-48-write-code-for-merge-two-javascript-object-dynamically"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 48. Write code for merge two JavaScript Object dynamically.</h2>
<p>Let say you have two objects</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
	age  <span class="pl-k">:</span> <span class="pl-c1">24</span>
}

<span class="pl-k">var</span> address <span class="pl-k">=</span> {
	addressLine1 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Some Location x<span class="pl-pds">'</span></span>,
	addressLine2 <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Some Location y<span class="pl-pds">'</span></span>,
	city <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>NewYork<span class="pl-pds">'</span></span>
} </pre></div>
<p>Write merge function which will take two object and add all the own property of second object into first object.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-en">merge</span>(person , address); 
 
<span class="pl-c"><span class="pl-c">/*</span> Now person should have 5 properties </span>
<span class="pl-c">name , age , addressLine1 , addressLine2 , city <span class="pl-c">*/</span></span></pre></div>
<p><strong>Method 1: Using ES6, Object.assign method</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">const</span> <span class="pl-c1">merge</span> <span class="pl-k">=</span> (<span class="pl-smi">toObj</span>, <span class="pl-smi">fromObj</span>) <span class="pl-k">=&gt;</span> <span class="pl-c1">Object</span>.<span class="pl-en">assign</span>(toObj, fromObj);</pre></div>
<p><strong>Method 2: Without using built-in function</strong></p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">merge</span>(<span class="pl-smi">toObj</span>, <span class="pl-smi">fromObj</span>) {
  <span class="pl-c"><span class="pl-c">//</span> Make sure both of the parameter is an object</span>
  <span class="pl-k">if</span> (<span class="pl-k">typeof</span> toObj <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>object<span class="pl-pds">'</span></span> <span class="pl-k">&amp;&amp;</span> <span class="pl-k">typeof</span> fromObj <span class="pl-k">===</span> <span class="pl-s"><span class="pl-pds">'</span>object<span class="pl-pds">'</span></span>) {
    <span class="pl-k">for</span> (<span class="pl-k">var</span> pro <span class="pl-k">in</span> fromObj) {
      <span class="pl-c"><span class="pl-c">//</span> Assign only own properties not inherited properties</span>
      <span class="pl-k">if</span> (<span class="pl-smi">fromObj</span>.<span class="pl-en">hasOwnProperty</span>(pro)) {
        <span class="pl-c"><span class="pl-c">//</span> Assign property and value</span>
        toObj[pro] <span class="pl-k">=</span> fromObj[pro];
      }
    }
  }<span class="pl-k">else</span>{
  	<span class="pl-k">throw</span> <span class="pl-s"><span class="pl-pds">"</span>Merge function can apply only on object<span class="pl-pds">"</span></span>;
  }
}</pre></div>
<h2><a id="user-content-question-49-what-is-non-enumerable-property-in-javascript-and-how-you-can-create-one" class="anchor" aria-hidden="true" href="#question-49-what-is-non-enumerable-property-in-javascript-and-how-you-can-create-one"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 49. What is non-enumerable property in JavaScript and how you can create one?</h2>
<p>Object can have properties that don't show up when you iterate through object using for...in loop or using Object.keys() to get an array of property names. This properties is know as non-enumerable properties.</p>
<p>Let say we have following object</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
};
<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person)); <span class="pl-c"><span class="pl-c">//</span> ['name', 'salary', 'country']</span></pre></div>
<p>As we know that person object properties <code>name</code>, <code>salary</code> ,<code>country</code> are enumerable hence it's shown up when we called Object.keys(person).</p>
<p>To create a non-enumerable property we have to use <strong>Object.defineProperty()</strong>. This is a special method for creating non-enumerable property in JavaScript.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> person <span class="pl-k">=</span> {
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
};
<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

<span class="pl-c"><span class="pl-c">//</span> Create non-enumerable property</span>
<span class="pl-c1">Object</span>.<span class="pl-en">defineProperty</span>(person, <span class="pl-s"><span class="pl-pds">'</span>phoneNo<span class="pl-pds">'</span></span>,{
	value <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>8888888888<span class="pl-pds">'</span></span>,
	enumerable<span class="pl-k">:</span> <span class="pl-c1">false</span>
})

<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person); <span class="pl-c"><span class="pl-c">//</span> ['name', 'salary', 'country']</span></pre></div>
<p>In the example above <code>phoneNo</code> property didn't show up because we made it non-enumerable by setting <strong>enumerable:false</strong></p>
<p><strong>Bonus</strong></p>
<p>Now let's try to change value of <code>phoneNo</code></p>
<div class="highlight highlight-source-js"><pre><span class="pl-smi">person</span>.<span class="pl-smi">phoneNo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>7777777777<span class="pl-pds">'</span></span>; </pre></div>
<p><strong>Object.defineProperty()</strong> also lets you create read-only properties as we saw above, we are not able to modify phoneNo value of a person object. This is because descriptor has <strong>writable</strong> property, which is <code>false</code> by default. Changing non-writable property value will return error in strict mode. In non-strict mode it won't through any error but it won't change the value of phoneNo.</p>
<h2><a id="user-content-question-50-what-is-function-binding-" class="anchor" aria-hidden="true" href="#question-50-what-is-function-binding-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Question 50. What is Function binding ?</h2>
<p>Function binding falls in advance JavaScript category and this is very popular technique to use in conjunction with event handler and callback function to preserve code execution context while passing function as a parameter.</p>
<p>Let's consider the following example:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> clickHandler <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>click event handler<span class="pl-pds">'</span></span>,
	<span class="pl-en">handleClick</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-c1">event</span>) {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
	}
};

<span class="pl-k">var</span> btn <span class="pl-k">=</span> <span class="pl-c1">document</span>.<span class="pl-c1">getElementById</span>(<span class="pl-s"><span class="pl-pds">'</span>myBtn<span class="pl-pds">'</span></span>);
<span class="pl-c"><span class="pl-c">//</span> Add click event to btn</span>
<span class="pl-smi">btn</span>.<span class="pl-c1">addEventListener</span>(<span class="pl-s"><span class="pl-pds">'</span>click<span class="pl-pds">'</span></span>, <span class="pl-smi">clickHandler</span>.<span class="pl-smi">handleClick</span>);</pre></div>
<p>Here in this example clickHandler object is created which contain message properties and handleClick method.</p>
<p>We have assigned handleClick method to a DOM button, which will be executed in response of click. When the button is clicked, then handleClick method is being called and console message. Here console.log should log the <code>click event handler</code> message but it actually log <code>undefined</code>.</p>
<p>The problem of displaying <code>undefined</code> is because of the execution context of clickHandler.handleClick method is not being saved hence <code>this</code> pointing to button <code>btn</code> object. We can fix this issue using bind method.</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> clickHandler <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>click event handler<span class="pl-pds">'</span></span>,
	<span class="pl-en">handleClick</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-c1">event</span>) {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
	}
};

<span class="pl-k">var</span> btn <span class="pl-k">=</span> <span class="pl-c1">document</span>.<span class="pl-c1">getElementById</span>(<span class="pl-s"><span class="pl-pds">'</span>myBtn<span class="pl-pds">'</span></span>);
<span class="pl-c"><span class="pl-c">//</span> Add click event to btn and bind the clickHandler object</span>
<span class="pl-smi">btn</span>.<span class="pl-c1">addEventListener</span>(<span class="pl-s"><span class="pl-pds">'</span>click<span class="pl-pds">'</span></span>, <span class="pl-smi">clickHandler</span>.<span class="pl-smi">handleClick</span>.<span class="pl-en">bind</span>(clickHandler));</pre></div>
<p><code>bind</code> method is available to all the function similar to call and apply method which take argument value of <code>this</code>.</p>
<h1><a id="user-content-coding-questions" class="anchor" aria-hidden="true" href="#coding-questions"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Coding Questions</h1>
<h2><a id="user-content-passing-values-by-reference-vs-by-value" class="anchor" aria-hidden="true" href="#passing-values-by-reference-vs-by-value"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Passing values by reference vs by value</h2>
<p>For a JS developer, it's crucially important to understand which values are passed by reference,
and which ones are passed by value. Remember that objects, including arrays are passed by reference
while strings, booleans and numbers are passed by value.</p>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> strA <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>hi there<span class="pl-pds">"</span></span>;
<span class="pl-k">var</span> strB <span class="pl-k">=</span> strA;
strB<span class="pl-k">=</span><span class="pl-s"><span class="pl-pds">"</span>bye there!<span class="pl-pds">"</span></span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span> (strA)</pre></div>
<p>The output will <code>'hi there'</code> because we're dealing with strings here. Strings are
passed by value, that is, copied.</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> objA <span class="pl-k">=</span> {prop1<span class="pl-k">:</span> <span class="pl-c1">42</span>};
<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA; 
<span class="pl-smi">objB</span>.<span class="pl-smi">prop1</span> <span class="pl-k">=</span> <span class="pl-c1">90</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA) </pre></div>
<p>The output will <code>{prop1: 90}</code> because we're dealing with objects here. Objects are
passed by reference, that is, <code>objA</code> and <code>objB</code> point to the same object in memory.</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> objA <span class="pl-k">=</span> {prop1<span class="pl-k">:</span> <span class="pl-c1">42</span>};
<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
objB <span class="pl-k">=</span> {};
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA)</pre></div>
<p>The output will <code>{prop1: 42}</code>.</p>
<p>When we assign <code>objA</code> to <code>objB</code>, the <code>objB</code> variable will point
to the same object as the <code>objB</code> variable.</p>
<p>However, when we reassign <code>objB</code> to an empty object, we simply change where <code>objB</code> variable references to.
This doesn't affect where <code>objA</code> variable references to.</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [<span class="pl-c1">0</span>,<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> arrA;
arrB[<span class="pl-c1">0</span>]<span class="pl-k">=</span><span class="pl-c1">42</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA)</pre></div>
<p>The output will be <code>[42,1,2,3,4,5]</code>.</p>
<p>Arrays are object in JavaScript and they are passed and assigned by reference. This is why
both <code>arrA</code> and <code>arrB</code> point to the same array <code>[0,1,2,3,4,5]</code>. That's why changing the first
element of the <code>arrB</code> will also modify <code>arrA</code>: it's the same array in the memory.</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [<span class="pl-c1">0</span>,<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> <span class="pl-smi">arrA</span>.<span class="pl-c1">slice</span>();
arrB[<span class="pl-c1">0</span>]<span class="pl-k">=</span><span class="pl-c1">42</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA)</pre></div>
<p>The output will be <code>[0,1,2,3,4,5]</code>.</p>
<p>The <code>slice</code> function copies all the elements of the array returning the new array. That's why
<code>arrA</code> and <code>arrB</code> reference two completely different arrays.</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [{prop1<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>value of array A!!<span class="pl-pds">"</span></span>},  {someProp<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>also value of array A!<span class="pl-pds">"</span></span>}, <span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> arrA;
arrB[<span class="pl-c1">0</span>].<span class="pl-smi">prop1</span><span class="pl-k">=</span><span class="pl-c1">42</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA);</pre></div>
<p>The output will be <code>[{prop1: 42},  {someProp: "also value of array A!"}, 3,4,5]</code>.</p>
<p>Arrays are object in JS, so both varaibles arrA and arrB point to the same array. Changing
<code>arrB[0]</code> is the same as changing <code>arrA[0]</code></p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> arrA <span class="pl-k">=</span> [{prop1<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>value of array A!!<span class="pl-pds">"</span></span>}, {someProp<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>also value of array A!<span class="pl-pds">"</span></span>},<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
<span class="pl-k">var</span> arrB <span class="pl-k">=</span> <span class="pl-smi">arrA</span>.<span class="pl-c1">slice</span>();
arrB[<span class="pl-c1">0</span>].<span class="pl-smi">prop1</span><span class="pl-k">=</span><span class="pl-c1">42</span>;
arrB[<span class="pl-c1">3</span>] <span class="pl-k">=</span> <span class="pl-c1">20</span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrA);</pre></div>
<p>The output will be <code>[{prop1: 42},  {someProp: "also value of array A!"}, 3,4,5]</code>.</p>
<p>The <code>slice</code> function copies all the elements of the array returning the new array. However,
it doesn't do deep copying. Instead it does shallow copying. You can imagine slice implemented like this:</p>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">slice</span>(<span class="pl-smi">arr</span>) {
   <span class="pl-k">var</span> result <span class="pl-k">=</span> [];
   <span class="pl-k">for</span> (i <span class="pl-k">=</span> <span class="pl-c1">0</span>; i<span class="pl-k">&lt;</span> <span class="pl-smi">arr</span>.<span class="pl-c1">length</span>; i<span class="pl-k">++</span>) {
       <span class="pl-smi">result</span>.<span class="pl-c1">push</span>(arr[i]);
   }
   <span class="pl-k">return</span> result; 
}</pre></div>
<p>Look at the line with <code>result.push(arr[i])</code>. If <code>arr[i]</code> happens to be a number or string,
it will be passed by value, in other words, copied. If <code>arr[i]</code> is an object, it will be passed by reference.</p>
<p>In case of our array <code>arr[0]</code> is an object <code>{prop1: "value of array A!!"}</code>. Only the reference
to this object will be copied. This effectively means that arrays arrA and arrB share first
two elements.</p>
<p>This is why changing the property of <code>arrB[0]</code> in <code>arrB</code> will also change the <code>arrA[0]</code>.</p>
<h2><a id="user-content-hoisting" class="anchor" aria-hidden="true" href="#hoisting"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hoisting</h2>
<h3><a id="user-content-1-consolelogemployeeid" class="anchor" aria-hidden="true" href="#1-consolelogemployeeid"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. console.log(employeeId);</h3>
<ol>
<li>Some Value</li>
<li>Undefined</li>
<li>Type Error</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 4) ReferenceError: employeeId is not defined</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>19000<span class="pl-pds">'</span></span>;</pre></div>
<ol>
<li>Some Value</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>1234abe<span class="pl-pds">'</span></span>;
(<span class="pl-k">function</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
	<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>122345<span class="pl-pds">'</span></span>;
})();</pre></div>
<ol>
<li>'122345'</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>1234abe<span class="pl-pds">'</span></span>;
(<span class="pl-k">function</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
	<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>122345<span class="pl-pds">'</span></span>;
	(<span class="pl-k">function</span>() {
		<span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc1234<span class="pl-pds">'</span></span>;
	}());
}());</pre></div>
<ol>
<li>'122345'</li>
<li>undefined</li>
<li>'1234abe'</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> displayFunc);
	<span class="pl-k">var</span> <span class="pl-en">displayFunc</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>Hi I am inside displayFunc<span class="pl-pds">"</span></span>);
	}
}());</pre></div>
<ol>
<li>undefined</li>
<li>function</li>
<li>'Hi I am inside displayFunc'</li>
<li>ReferenceError: displayFunc is not defined</li>
</ol>
<p>Answer: 1) undefined</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc123<span class="pl-pds">'</span></span>;
<span class="pl-k">function</span> <span class="pl-en">foo</span>(){
	employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>123bcd<span class="pl-pds">'</span></span>;
	<span class="pl-k">return</span>;
}
<span class="pl-en">foo</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);</pre></div>
<ol>
<li>undefined</li>
<li>'123bcd'</li>
<li>'abc123'</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) '123bcd'</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc123<span class="pl-pds">'</span></span>;

<span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>123bcd<span class="pl-pds">'</span></span>;
	<span class="pl-k">return</span>;

	<span class="pl-k">function</span> <span class="pl-en">employeeId</span>() {}
}
<span class="pl-en">foo</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);</pre></div>
<ol>
<li>undefined</li>
<li>'123bcd'</li>
<li>'abc123'</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 3) 'abc123'</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>abc123<span class="pl-pds">'</span></span>;

<span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	<span class="pl-en">employeeId</span>();
	<span class="pl-k">return</span>;

	<span class="pl-k">function</span> <span class="pl-en">employeeId</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> employeeId);
	}
}
<span class="pl-en">foo</span>();</pre></div>
<ol>
<li>undefined</li>
<li>function</li>
<li>string</li>
<li>ReferenceError: employeeId is not defined</li>
</ol>
<p>Answer: 2) 'function'</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	<span class="pl-en">employeeId</span>();
	<span class="pl-k">var</span> product <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Car<span class="pl-pds">'</span></span>; 
	<span class="pl-k">return</span>;

	<span class="pl-k">function</span> <span class="pl-en">employeeId</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(product);
	}
}
<span class="pl-en">foo</span>();</pre></div>
<ol>
<li>undefined</li>
<li>Type Error</li>
<li>'Car'</li>
<li>ReferenceError: product is not defined</li>
</ol>
<p>Answer: 1) undefined</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">foo</span>() {
	<span class="pl-en">bar</span>();

	<span class="pl-k">function</span> <span class="pl-en">bar</span>() {
		<span class="pl-en">abc</span>();
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> abc);
	}

	<span class="pl-k">function</span> <span class="pl-en">abc</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">typeof</span> bar);
	}
}());</pre></div>
<ol>
<li>undefined undefined</li>
<li>Type Error</li>
<li>function function</li>
<li>ReferenceError: bar is not defined</li>
</ol>
<p>Answer: 3) function function</p>
<h2><a id="user-content-objects" class="anchor" aria-hidden="true" href="#objects"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Objects</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-s"><span class="pl-pds">'</span>use strict<span class="pl-pds">'</span></span>;

	<span class="pl-k">var</span> person <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
	};
	<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
	person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

	<span class="pl-c1">Object</span>.<span class="pl-en">defineProperty</span>(person, <span class="pl-s"><span class="pl-pds">'</span>phoneNo<span class="pl-pds">'</span></span>, {
		value<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>8888888888<span class="pl-pds">'</span></span>,
		enumerable<span class="pl-k">:</span> <span class="pl-c1">true</span>
	})

	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person)); 
})();</pre></div>
<ol>
<li>Type Error</li>
<li>undefined</li>
<li>["name", "salary", "country", "phoneNo"]</li>
<li>["name", "salary", "country"]</li>
</ol>
<p>Answer: 3) ["name", "salary", "country", "phoneNo"]</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-s"><span class="pl-pds">'</span>use strict<span class="pl-pds">'</span></span>;

	<span class="pl-k">var</span> person <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
	};
	<span class="pl-smi">person</span>.<span class="pl-smi">salary</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>10000$<span class="pl-pds">'</span></span>;
	person[<span class="pl-s"><span class="pl-pds">'</span>country<span class="pl-pds">'</span></span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>USA<span class="pl-pds">'</span></span>;

	<span class="pl-c1">Object</span>.<span class="pl-en">defineProperty</span>(person, <span class="pl-s"><span class="pl-pds">'</span>phoneNo<span class="pl-pds">'</span></span>, {
		value<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>8888888888<span class="pl-pds">'</span></span>,
		enumerable<span class="pl-k">:</span> <span class="pl-c1">false</span>
	})

	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">Object</span>.<span class="pl-c1">keys</span>(person)); 
})();</pre></div>
<ol>
<li>Type Error</li>
<li>undefined</li>
<li>["name", "salary", "country", "phoneNo"]</li>
<li>["name", "salary", "country"]</li>
</ol>
<p>Answer: 4) ["name", "salary", "country"]</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> {
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,
		bar<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>
	};
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> {
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,
		bar<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Object</span>({foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>foo<span class="pl-pds">"</span></span>});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Object</span>({foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>foo<span class="pl-pds">"</span></span>});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(objA);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 2) false false</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>(objA);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">==</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">===</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
}());</pre></div>
<ol>
<li>false true</li>
<li>false false</li>
<li>true false</li>
<li>true true</li>
</ol>
<p>Answer: 4) true true</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">==</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(objA <span class="pl-k">===</span> objB);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">==</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-c1">toString</span>() <span class="pl-k">===</span> <span class="pl-smi">objB</span>.<span class="pl-c1">toString</span>());
}());</pre></div>
<ol>
<li>true true true false</li>
<li>true false true true</li>
<li>true true true true</li>
<li>true true false false</li>
</ol>
<p>Answer: 3) true true true true</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span>);
}());</pre></div>
<ol>
<li>foo bar</li>
<li>bar bar</li>
<li>foo foo</li>
<li>bar foo</li>
</ol>
<p>Answer: 2) bar bar</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> <span class="pl-c1">Object</span>.<span class="pl-en">create</span>({
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	});
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>;

	<span class="pl-k">delete</span> <span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span>);
}());</pre></div>
<ol>
<li>foo bar</li>
<li>bar bar</li>
<li>foo foo</li>
<li>bar foo</li>
</ol>
<p>Answer: 3) foo foo</p>
<h3><a id="user-content-11-what-would-be-the-output-of-following-code-" class="anchor" aria-hidden="true" href="#11-what-would-be-the-output-of-following-code-"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>11. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> objA <span class="pl-k">=</span> {
		foo<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>
	};
	<span class="pl-k">var</span> objB <span class="pl-k">=</span> objA;
	<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>;

	<span class="pl-k">delete</span> <span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>;
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objA</span>.<span class="pl-smi">foo</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">objB</span>.<span class="pl-smi">foo</span>);
}());</pre></div>
<ol>
<li>foo bar</li>
<li>undefined undefined</li>
<li>foo foo</li>
<li>undefined bar</li>
</ol>
<p>Answer: 2) undefined undefined</p>
<h2><a id="user-content-arrays" class="anchor" aria-hidden="true" href="#arrays"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Arrays</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> array <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>(<span class="pl-s"><span class="pl-pds">'</span>100<span class="pl-pds">'</span></span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">length</span>);
}());</pre></div>
<ol>
<li>undefined undefined</li>
<li>[undefined × 100] 100</li>
<li>["100"] 1</li>
<li>ReferenceError: array is not defined</li>
</ol>
<p>Answer: 3) ["100"] 1</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> array1 <span class="pl-k">=</span> [];
	<span class="pl-k">var</span> array2 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>(<span class="pl-c1">100</span>);
	<span class="pl-k">var</span> array3 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>([<span class="pl-s"><span class="pl-pds">'</span>1<span class="pl-pds">'</span></span>,<span class="pl-c1">2</span>,<span class="pl-s"><span class="pl-pds">'</span>3<span class="pl-pds">'</span></span>,<span class="pl-c1">4</span>,<span class="pl-c1">5.6</span>]);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array1);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array2);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(array3);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array3</span>.<span class="pl-c1">length</span>);
}());</pre></div>
<ol>
<li>[] [] [Array[5]] 1</li>
<li>[] [undefined × 100] Array[5] 1</li>
<li>[] [] ['1',2,'3',4,5.6] 5</li>
<li>[] [] [Array[5]] 5</li>
</ol>
<p>Answer: 1) [] [] [Array[5]] 1</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> () {
  <span class="pl-k">var</span> array <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Array</span>(<span class="pl-s"><span class="pl-pds">'</span>a<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>b<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>c<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>d<span class="pl-pds">'</span></span>, <span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>);
  array[<span class="pl-c1">10</span>] <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>f<span class="pl-pds">'</span></span>;
  <span class="pl-k">delete</span> array[<span class="pl-c1">10</span>];
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">length</span>);
}());</pre></div>
<ol>
<li>11</li>
<li>5</li>
<li>6</li>
<li>undefined</li>
</ol>
<p>Answer: 1) 11</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> animal <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>cow<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>horse<span class="pl-pds">'</span></span>];
		<span class="pl-smi">animal</span>.<span class="pl-c1">push</span>(<span class="pl-s"><span class="pl-pds">'</span>cat<span class="pl-pds">'</span></span>);
		<span class="pl-smi">animal</span>.<span class="pl-c1">push</span>(<span class="pl-s"><span class="pl-pds">'</span>dog<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>rat<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>goat<span class="pl-pds">'</span></span>);
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">animal</span>.<span class="pl-c1">length</span>);
})();</pre></div>
<ol>
<li>4</li>
<li>5</li>
<li>6</li>
<li>undefined</li>
</ol>
<p>Answer: 3) 6</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code-3" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code-3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> animal <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>cow<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>horse<span class="pl-pds">'</span></span>];
		<span class="pl-smi">animal</span>.<span class="pl-c1">push</span>(<span class="pl-s"><span class="pl-pds">'</span>cat<span class="pl-pds">'</span></span>);
		<span class="pl-smi">animal</span>.<span class="pl-c1">unshift</span>(<span class="pl-s"><span class="pl-pds">'</span>dog<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>rat<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>goat<span class="pl-pds">'</span></span>);
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(animal);
})();</pre></div>
<ol>
<li>[ 'dog', 'rat', 'goat', 'cow', 'horse', 'cat' ]</li>
<li>[ 'cow', 'horse', 'cat', 'dog', 'rat', 'goat' ]</li>
<li>Type Error</li>
<li>undefined</li>
</ol>
<p>Answer: 1) [ 'dog', 'rat', 'goat', 'cow', 'horse', 'cat' ]</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code-2" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code-2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> array <span class="pl-k">=</span> [<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>];
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>([{name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>},{name <span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>}].<span class="pl-c1">indexOf</span>({name<span class="pl-k">:</span><span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>}));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>([[<span class="pl-c1">1</span>],[<span class="pl-c1">2</span>],[<span class="pl-c1">3</span>],[<span class="pl-c1">4</span>]].<span class="pl-c1">indexOf</span>([<span class="pl-c1">3</span>]));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>abcdefgh<span class="pl-pds">"</span></span>.<span class="pl-c1">indexOf</span>(<span class="pl-s"><span class="pl-pds">'</span>e<span class="pl-pds">'</span></span>));
})();</pre></div>
<ol>
<li>1 -1 -1 4</li>
<li>1 0 -1 4</li>
<li>1 -1 -1 -1</li>
<li>1 undefined -1 4</li>
</ol>
<p>Answer: 1) 1 -1 -1 4</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> array <span class="pl-k">=</span> [<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>,<span class="pl-c1">1</span>,<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>,<span class="pl-c1">6</span>];
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>,<span class="pl-c1">3</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">array</span>.<span class="pl-c1">indexOf</span>(<span class="pl-c1">2</span>,<span class="pl-c1">10</span>));
})();</pre></div>
<ol>
<li>1 -1 -1</li>
<li>1 6 -1</li>
<li>1 1 -1</li>
<li>1 undefined undefined</li>
</ol>
<p>Answer: 2) 1 6 -1</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> numbers <span class="pl-k">=</span> [<span class="pl-c1">2</span>,<span class="pl-c1">3</span>,<span class="pl-c1">4</span>,<span class="pl-c1">8</span>,<span class="pl-c1">9</span>,<span class="pl-c1">11</span>,<span class="pl-c1">13</span>,<span class="pl-c1">12</span>,<span class="pl-c1">16</span>];
	<span class="pl-k">var</span> even <span class="pl-k">=</span> <span class="pl-smi">numbers</span>.<span class="pl-en">filter</span>(<span class="pl-k">function</span>(<span class="pl-smi">element</span>, <span class="pl-smi">index</span>){
		<span class="pl-k">return</span> element <span class="pl-k">%</span> <span class="pl-c1">2</span> <span class="pl-k">===</span> <span class="pl-c1">0</span>; 
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(even);

	<span class="pl-k">var</span> containsDivisibleby3 <span class="pl-k">=</span> <span class="pl-smi">numbers</span>.<span class="pl-en">some</span>(<span class="pl-k">function</span>(<span class="pl-smi">element</span>, <span class="pl-smi">index</span>){
		<span class="pl-k">return</span> element <span class="pl-k">%</span> <span class="pl-c1">3</span> <span class="pl-k">===</span> <span class="pl-c1">0</span>;
	});

	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containsDivisibleby3);	
})();</pre></div>
<ol>
<li>[ 2, 4, 8, 12, 16 ] [ 0, 3, 0, 0, 9, 0, 12]</li>
<li>[ 2, 4, 8, 12, 16 ] [ 3, 9, 12]</li>
<li>[ 2, 4, 8, 12, 16 ] true</li>
<li>[ 2, 4, 8, 12, 16 ] false</li>
</ol>
<p>Answer: 3) [ 2, 4, 8, 12, 16 ] true</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> [<span class="pl-c1">2</span>,<span class="pl-c1">0</span>,<span class="pl-c1">false</span>,<span class="pl-s"><span class="pl-pds">"</span><span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">'</span>12<span class="pl-pds">'</span></span>, <span class="pl-c1">true</span>];
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">Boolean</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">Number</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">String</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);
	<span class="pl-k">var</span> containers <span class="pl-k">=</span> <span class="pl-smi">containers</span>.<span class="pl-en">filter</span>(<span class="pl-c1">Object</span>);
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(containers);		
})();</pre></div>
<ol>
<li>[ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]</li>
<li>[false, true]
[ 2 ]
['12']
[ ]</li>
<li>[2,0,false,"", '12', true]
[2,0,false,"", '12', true]
[2,0,false,"", '12', true]
[2,0,false,"", '12', true]</li>
<li>[ 2, '12', true ]
[ 2, '12', true, false ]
[ 2, '12', true,false ]
[ 2, '12', true,false]</li>
</ol>
<p>Answer: 1) [ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]
[ 2, '12', true ]</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code-1" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code-1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> list <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>john<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>ritz<span class="pl-pds">'</span></span>];
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>(<span class="pl-c1">1</span>));	
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>(<span class="pl-c1">1</span>,<span class="pl-c1">3</span>));
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>());
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">slice</span>(<span class="pl-c1">2</span>,<span class="pl-c1">2</span>));
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(list);				
})();</pre></div>
<ol>
<li>[ 'bar', 'john', 'ritz' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
<li>[ 'bar', 'john', 'ritz' ]
[ 'bar', 'john','ritz ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
<li>[ 'john', 'ritz' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
<li>[ 'foo' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</li>
</ol>
<p>Answer: 1) [ 'bar', 'john', 'ritz' ]
[ 'bar', 'john' ]
[ 'foo', 'bar', 'john', 'ritz' ]
[]
[ 'foo', 'bar', 'john', 'ritz' ]</p>
<h3><a id="user-content-11-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#11-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>11. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> list <span class="pl-k">=</span> [<span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>bar<span class="pl-pds">'</span></span>,<span class="pl-s"><span class="pl-pds">'</span>john<span class="pl-pds">'</span></span>];
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">1</span>));		
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">list</span>.<span class="pl-c1">splice</span>(<span class="pl-c1">1</span>,<span class="pl-c1">2</span>));
	    <span class="pl-en">console</span>.<span class="pl-c1">log</span>(list);			
})();</pre></div>
<ol>
<li>[ 'bar', 'john' ] [] [ 'foo' ]</li>
<li>[ 'bar', 'john' ] [] [ 'bar', 'john' ]</li>
<li>[ 'bar', 'john' ] [ 'bar', 'john' ] [ 'bar', 'john' ]</li>
<li>[ 'bar', 'john' ] [] []</li>
</ol>
<p>Answer: 1.  [ 'bar', 'john' ] [] [ 'foo' ]</p>
<h3><a id="user-content-12-what-would-be-the-output-of-following-code" class="anchor" aria-hidden="true" href="#12-what-would-be-the-output-of-following-code"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>12. What would be the output of following code?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> arrayNumb <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-smi">arrayNumb</span>.<span class="pl-c1">sort</span>();
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrayNumb);
})();</pre></div>
<ol>
<li>[2, 8, 15, 16, 23, 42]</li>
<li>[42, 23, 26, 15, 8, 2]</li>
<li>[ 15, 16, 2, 23, 42, 8 ]</li>
<li>[ 2, 8, 15, 16, 23, 42 ]</li>
</ol>
<p>Answer: 3.  [ 15, 16, 2, 23, 42, 8 ]</p>
<h2><a id="user-content-functions" class="anchor" aria-hidden="true" href="#functions"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Functions</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">funcA</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>funcA <span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
	(<span class="pl-k">function</span> <span class="pl-en">innerFuncA1</span>(){
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>innerFunc1<span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
		(<span class="pl-k">function</span> <span class="pl-en">innerFunA11</span>(){
			<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">"</span>innerFunA11<span class="pl-pds">"</span></span>, <span class="pl-c1">this</span>);
		})();
	})();
}
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">funcA</span>());</pre></div>
<ol>
<li>funcA  Window {...}
innerFunc1 Window {...}
innerFunA11 Window {...}</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: this is not defined</li>
</ol>
<p>Answer: 1)</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Hello<span class="pl-pds">"</span></span>,
	innerMessage<span class="pl-k">:</span> <span class="pl-k">!</span>(<span class="pl-k">function</span>() {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
	})()
};
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-smi">innerMessage</span>);</pre></div>
<ol>
<li>ReferenceError: this.message is not defined</li>
<li>undefined</li>
<li>Type Error</li>
<li>undefined true</li>
</ol>
<p>Answer: 4) undefined true</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
	message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">"</span>Hello<span class="pl-pds">"</span></span>,
	<span class="pl-en">innerMessage</span><span class="pl-k">:</span> <span class="pl-k">function</span>() {
		<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-smi">message</span>;
	}
};
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-en">innerMessage</span>());</pre></div>
<ol>
<li>Hello</li>
<li>undefined</li>
<li>Type Error</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 1) Hello</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
  message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Hello<span class="pl-pds">'</span></span>,
  <span class="pl-en">innerMessage</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {
    (<span class="pl-k">function</span> () {
      <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
    }());
  }
};
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-en">innerMessage</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>Hello</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 3) undefined</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> obj <span class="pl-k">=</span> {
  message<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>Hello<span class="pl-pds">'</span></span>,
  <span class="pl-en">innerMessage</span><span class="pl-k">:</span> <span class="pl-k">function</span> () {
  	<span class="pl-k">var</span> self <span class="pl-k">=</span> <span class="pl-c1">this</span>;
    (<span class="pl-k">function</span> () {
      <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">self</span>.<span class="pl-smi">message</span>);
    }());
  }
};
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">obj</span>.<span class="pl-en">innerMessage</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hello'</li>
<li>undefined</li>
<li>ReferenceError: self.message is not defined</li>
</ol>
<p>Answer: 2) 'Hello'</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-smi">message</span>);
}
<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi John<span class="pl-pds">"</span></span>;
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hi John'</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 3) undefined</p>
<h3><a id="user-content-7-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#7-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>7. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span>);
}
<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi John<span class="pl-pds">"</span></span>;
	
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hi John'</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 2) 'Hi John'</p>
<h3><a id="user-content-8-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#8-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>8. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>() {
  <span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Hi John<span class="pl-pds">'</span></span>;
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">myFunc</span>.<span class="pl-smi">message</span>);
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());</pre></div>
<ol>
<li>Type Error</li>
<li>'Hi John'</li>
<li>undefined</li>
<li>ReferenceError: this.message is not defined</li>
</ol>
<p>Answer: 2) 'Hi John'</p>
<h3><a id="user-content-9-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#9-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>9. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>(<span class="pl-smi">param1</span>,<span class="pl-smi">param2</span>) {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">myFunc</span>.<span class="pl-c1">length</span>);
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>));
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>c<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>d<span class="pl-pds">"</span></span>));</pre></div>
<ol>
<li>2 2 2</li>
<li>0 2 4</li>
<li>undefined</li>
<li>ReferenceError</li>
</ol>
<p>Answer: a) 2 2 2</p>
<h3><a id="user-content-10-what-would-be-the-output-of-following-code--1" class="anchor" aria-hidden="true" href="#10-what-would-be-the-output-of-following-code--1"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>10. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">myFunc</span>() {
  <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">arguments</span>.<span class="pl-c1">length</span>);
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>());
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>));
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">myFunc</span>(<span class="pl-s"><span class="pl-pds">"</span>a<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>b<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>c<span class="pl-pds">"</span></span>,<span class="pl-s"><span class="pl-pds">"</span>d<span class="pl-pds">"</span></span>));</pre></div>
<ol>
<li>2 2 2</li>
<li>0 2 4</li>
<li>undefined</li>
<li>ReferenceError</li>
</ol>
<p>Answer: 2) 0 2 4</p>
<h2><a id="user-content-object-oriented" class="anchor" aria-hidden="true" href="#object-oriented"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Object Oriented</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">Person</span>(<span class="pl-smi">name</span>, <span class="pl-smi">age</span>){
	<span class="pl-c1">this</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> name <span class="pl-k">||</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>;
	<span class="pl-c1">this</span>.<span class="pl-smi">age</span> <span class="pl-k">=</span> age <span class="pl-k">||</span> <span class="pl-c1">24</span>;
	<span class="pl-c1">this</span>.<span class="pl-en">displayName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
	}
}

<span class="pl-smi">Person</span>.<span class="pl-c1">name</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>;
<span class="pl-smi">Person</span>.<span class="pl-en">displayName</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
}

<span class="pl-k">var</span> person1 <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">Person</span>(<span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>);
	<span class="pl-smi">person1</span>.<span class="pl-en">displayName</span>();
	<span class="pl-smi">Person</span>.<span class="pl-en">displayName</span>();</pre></div>
<ol>
<li>John Person</li>
<li>John John</li>
<li>John undefined</li>
<li>John John</li>
</ol>
<p>Answer: 1) John Person</p>
<h2><a id="user-content-scopes" class="anchor" aria-hidden="true" href="#scopes"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Scopes</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">passWordMngr</span>() {
	<span class="pl-k">var</span> password <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>12345678<span class="pl-pds">'</span></span>;
	<span class="pl-c1">this</span>.<span class="pl-smi">userName</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>;
	<span class="pl-k">return</span> {
		pwd<span class="pl-k">:</span> password
	};
}
<span class="pl-c"><span class="pl-c">//</span> Block End</span>
<span class="pl-k">var</span> userInfo <span class="pl-k">=</span> <span class="pl-en">passWordMngr</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">userInfo</span>.<span class="pl-smi">pwd</span>);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">userInfo</span>.<span class="pl-smi">userName</span>);</pre></div>
<ol>
<li>12345678 Window</li>
<li>12345678 John</li>
<li>12345678 undefined</li>
<li>undefined undefined</li>
</ol>
<p>Answer: 3) 12345678 undefined</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>aq123<span class="pl-pds">'</span></span>;
<span class="pl-k">function</span> <span class="pl-en">Employee</span>() {
  <span class="pl-c1">this</span>.<span class="pl-smi">employeeId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bq1uy<span class="pl-pds">'</span></span>;
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-smi">Employee</span>.<span class="pl-smi">employeeId</span>);</pre></div>
<ol>
<li>Reference Error</li>
<li>aq123</li>
<li>bq1uy</li>
<li>undefined</li>
</ol>
<p>Answer: 4) undefined</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>aq123<span class="pl-pds">'</span></span>;

<span class="pl-k">function</span> <span class="pl-en">Employee</span>() {
	<span class="pl-c1">this</span>.<span class="pl-smi">employeeId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>bq1uy<span class="pl-pds">'</span></span>;
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">new</span> <span class="pl-en">Employee</span>().<span class="pl-smi">employeeId</span>);
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">employeeId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>kj182<span class="pl-pds">'</span></span>;
<span class="pl-smi">Employee</span>.<span class="pl-c1">prototype</span>.<span class="pl-smi">JobId</span> <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>1BJKSJ<span class="pl-pds">'</span></span>;
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">new</span> <span class="pl-en">Employee</span>().<span class="pl-smi">JobId</span>);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-k">new</span> <span class="pl-en">Employee</span>().<span class="pl-smi">employeeId</span>);</pre></div>
<ol>
<li>bq1uy 1BJKSJ bq1uy undefined</li>
<li>bq1uy 1BJKSJ bq1uy</li>
<li>bq1uy 1BJKSJ kj182</li>
<li>undefined 1BJKSJ kj182</li>
</ol>
<p>Answer: 2) bq1uy 1BJKSJ bq1uy</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> employeeId <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>aq123<span class="pl-pds">'</span></span>;
(<span class="pl-k">function</span> <span class="pl-en">Employee</span>() {
	<span class="pl-k">try</span> {
		<span class="pl-k">throw</span> <span class="pl-s"><span class="pl-pds">'</span>foo123<span class="pl-pds">'</span></span>;
	} <span class="pl-k">catch</span> (employeeId) {
		<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
	}
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(employeeId);
}());</pre></div>
<ol>
<li>foo123 aq123</li>
<li>foo123 foo123</li>
<li>aq123 aq123</li>
<li>foo123 undefined</li>
</ol>
<p>Answer: 1) foo123 aq123</p>
<h2><a id="user-content-call-apply-bind" class="anchor" aria-hidden="true" href="#call-apply-bind"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Call, Apply, Bind</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> greet <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">'</span>Hello World<span class="pl-pds">'</span></span>;
	<span class="pl-k">var</span> toGreet <span class="pl-k">=</span> [].<span class="pl-smi">filter</span>.<span class="pl-c1">call</span>(greet, <span class="pl-k">function</span>(<span class="pl-smi">element</span>, <span class="pl-smi">index</span>) {
		<span class="pl-k">return</span> index <span class="pl-k">&gt;</span> <span class="pl-c1">5</span>;
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(toGreet);
}());</pre></div>
<ol>
<li>Hello World</li>
<li>undefined</li>
<li>World</li>
<li>[ 'W', 'o', 'r', 'l', 'd' ]</li>
</ol>
<p>Answer: 4) [ 'W', 'o', 'r', 'l', 'd' ]</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> fooAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">4000</span>,
		<span class="pl-en">deductAmount</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">amount</span>) {
			<span class="pl-c1">this</span>.<span class="pl-smi">amount</span> <span class="pl-k">-=</span> amount;
			<span class="pl-k">return</span> <span class="pl-s"><span class="pl-pds">'</span>Total amount left in account: <span class="pl-pds">'</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-smi">amount</span>;
		}
	};
	<span class="pl-k">var</span> barAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">6000</span>
	};
	<span class="pl-k">var</span> <span class="pl-en">withdrawAmountBy</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">totalAmount</span>) {
		<span class="pl-k">return</span> <span class="pl-smi">fooAccount</span>.<span class="pl-smi">deductAmount</span>.<span class="pl-en">bind</span>(barAccount, totalAmount);
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">400</span>)());
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">300</span>)());
}());</pre></div>
<ol>
<li>Total amount left in account: 5600 Total amount left in account: 5300</li>
<li>undefined undefined</li>
<li>Total amount left in account: 3600 Total amount left in account: 3300</li>
<li>Total amount left in account: 5600 Total amount left in account: 5600</li>
</ol>
<p>Answer: 1) Total amount left in account: 5600 Total amount left in account: 5300</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> fooAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">4000</span>,
		<span class="pl-en">deductAmount</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">amount</span>) {
			<span class="pl-c1">this</span>.<span class="pl-smi">amount</span> <span class="pl-k">-=</span> amount;
			<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-smi">amount</span>;
		}
	};
	<span class="pl-k">var</span> barAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">6000</span>
	};
	<span class="pl-k">var</span> <span class="pl-en">withdrawAmountBy</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">totalAmount</span>) {
		<span class="pl-k">return</span> <span class="pl-smi">fooAccount</span>.<span class="pl-smi">deductAmount</span>.<span class="pl-c1">apply</span>(barAccount, [totalAmount]);
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">400</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">300</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">200</span>));
}());</pre></div>
<ol>
<li>5600 5300 5100</li>
<li>3600 3300 3100</li>
<li>5600 3300 5100</li>
<li>undefined undefined undefined</li>
</ol>
<p>Answer: 1) 5600 5300 5100</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>() {
	<span class="pl-k">var</span> fooAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">6000</span>,
		<span class="pl-en">deductAmount</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">amount</span>) {
			<span class="pl-c1">this</span>.<span class="pl-smi">amount</span> <span class="pl-k">-=</span> amount;
			<span class="pl-k">return</span> <span class="pl-c1">this</span>.<span class="pl-smi">amount</span>;
		}
	};
	<span class="pl-k">var</span> barAccount <span class="pl-k">=</span> {
		name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>,
		amount<span class="pl-k">:</span> <span class="pl-c1">4000</span>
	};
	<span class="pl-k">var</span> <span class="pl-en">withdrawAmountBy</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">totalAmount</span>) {
		<span class="pl-k">return</span> <span class="pl-smi">fooAccount</span>.<span class="pl-smi">deductAmount</span>.<span class="pl-c1">call</span>(barAccount, totalAmount);
	};
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">400</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">300</span>));
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">withdrawAmountBy</span>(<span class="pl-c1">200</span>));
}());</pre></div>
<ol>
<li>5600 5300 5100</li>
<li>3600 3300 3100</li>
<li>5600 3300 5100</li>
<li>undefined undefined undefined</li>
</ol>
<p>Answer: 2) 3600 3300 3100</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span> <span class="pl-en">greetNewCustomer</span>() {
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>Hello <span class="pl-pds">'</span></span> <span class="pl-k">+</span> <span class="pl-c1">this</span>.<span class="pl-c1">name</span>);
}.<span class="pl-en">bind</span>({
	name<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>John<span class="pl-pds">'</span></span>
})());</pre></div>
<ol>
<li>Hello John</li>
<li>Reference Error</li>
<li>Window</li>
<li>undefined</li>
</ol>
<p>Answer: 1) Hello John</p>
<h3><a id="user-content-6-suggest-your-question" class="anchor" aria-hidden="true" href="#6-suggest-your-question"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. Suggest your question!</h3>
<h2><a id="user-content-callback-functions" class="anchor" aria-hidden="true" href="#callback-functions"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Callback Functions</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--5" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--5"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getDataFromServer</span>(<span class="pl-smi">apiUrl</span>){
    <span class="pl-k">var</span> name <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>John<span class="pl-pds">"</span></span>;
	<span class="pl-k">return</span> {
		<span class="pl-en">then</span> <span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">fn</span>){
			<span class="pl-en">fn</span>(name);
		}
	}
}

<span class="pl-en">getDataFromServer</span>(<span class="pl-s"><span class="pl-pds">'</span>www.google.com<span class="pl-pds">'</span></span>).<span class="pl-c1">then</span>(<span class="pl-k">function</span>(<span class="pl-smi">name</span>){
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(name);
});
</pre></div>
<ol>
<li>John</li>
<li>undefined</li>
<li>Reference Error</li>
<li>fn is not defined</li>
</ol>
<p>Answer: 1) John</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> arrayNumb <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-c1">Array</span>.<span class="pl-c1">prototype</span>.<span class="pl-en">sort</span> <span class="pl-k">=</span> <span class="pl-k">function</span>(<span class="pl-smi">a</span>,<span class="pl-smi">b</span>){
		<span class="pl-k">return</span> a <span class="pl-k">-</span> b;
	};
	<span class="pl-smi">arrayNumb</span>.<span class="pl-c1">sort</span>();
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(arrayNumb);
})();

(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> numberArray <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-smi">numberArray</span>.<span class="pl-c1">sort</span>(<span class="pl-k">function</span>(<span class="pl-smi">a</span>,<span class="pl-smi">b</span>){
		<span class="pl-k">if</span>(a <span class="pl-k">==</span> b){
			<span class="pl-k">return</span> <span class="pl-c1">0</span>;
		}<span class="pl-k">else</span>{
			<span class="pl-k">return</span> a <span class="pl-k">&lt;</span> b <span class="pl-k">?</span> <span class="pl-k">-</span><span class="pl-c1">1</span> <span class="pl-k">:</span> <span class="pl-c1">1</span>;
		}
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numberArray);
})();

(<span class="pl-k">function</span>(){
	<span class="pl-k">var</span> numberArray <span class="pl-k">=</span> [<span class="pl-c1">2</span>, <span class="pl-c1">8</span>, <span class="pl-c1">15</span>, <span class="pl-c1">16</span>, <span class="pl-c1">23</span>, <span class="pl-c1">42</span>];
	<span class="pl-smi">numberArray</span>.<span class="pl-c1">sort</span>(<span class="pl-k">function</span>(<span class="pl-smi">a</span>,<span class="pl-smi">b</span>){
		<span class="pl-k">return</span> a<span class="pl-k">-</span>b;
	});
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numberArray);
})();</pre></div>
<ol>
<li>[ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]</li>
<li>undefined undefined undefined</li>
<li>[42, 23, 16, 15, 8, 2]
[42, 23, 16, 15, 8, 2]
[42, 23, 16, 15, 8, 2]</li>
<li>Reference Error</li>
</ol>
<p>Answer: 1) [ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]
[ 2, 8, 15, 16, 23, 42 ]</p>
<h2><a id="user-content-return-statement" class="anchor" aria-hidden="true" href="#return-statement"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Return Statement</h2>
<h3><a id="user-content-1-what-would-be-the-output-of-following-code--6" class="anchor" aria-hidden="true" href="#1-what-would-be-the-output-of-following-code--6"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>1. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre>(<span class="pl-k">function</span>(){
	<span class="pl-k">function</span> <span class="pl-en">sayHello</span>(){
		<span class="pl-k">var</span> name <span class="pl-k">=</span> <span class="pl-s"><span class="pl-pds">"</span>Hi John<span class="pl-pds">"</span></span>;
		<span class="pl-k">return</span> 
		{
			fullName<span class="pl-k">:</span> name
		}
	}
	<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">sayHello</span>().<span class="pl-smi">fullName</span>);
})();</pre></div>
<ol>
<li>Hi John</li>
<li>undefined</li>
<li>Reference Error</li>
<li>Uncaught TypeError: Cannot read property 'fullName' of undefined</li>
</ol>
<p>Answer: 4) Uncaught TypeError: Cannot read property 'fullName' of undefined</p>
<h3><a id="user-content-2-what-would-be-the-output-of-following-code--5" class="anchor" aria-hidden="true" href="#2-what-would-be-the-output-of-following-code--5"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getNumber</span>(){
	<span class="pl-k">return</span> (<span class="pl-c1">2</span>,<span class="pl-c1">4</span>,<span class="pl-c1">5</span>);
}

<span class="pl-k">var</span> numb <span class="pl-k">=</span> <span class="pl-en">getNumber</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numb);</pre></div>
<ol>
<li>5</li>
<li>undefined</li>
<li>2</li>
<li>(2,4,5)</li>
</ol>
<p>Answer: 1) 5</p>
<h3><a id="user-content-3-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#3-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>3. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">getNumber</span>(){
	<span class="pl-k">return</span>;
}

<span class="pl-k">var</span> numb <span class="pl-k">=</span> <span class="pl-en">getNumber</span>();
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(numb);</pre></div>
<ol>
<li>null</li>
<li>undefined</li>
<li>""</li>
<li>0</li>
</ol>
<p>Answer: 2) undefined</p>
<h3><a id="user-content-4-what-would-be-the-output-of-following-code--4" class="anchor" aria-hidden="true" href="#4-what-would-be-the-output-of-following-code--4"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>4**. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span>(<span class="pl-smi">x</span>){
	<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">y</span>){
		<span class="pl-k">return</span> [x<span class="pl-k">*</span>y, <span class="pl-k">function</span>(<span class="pl-smi">z</span>){
			<span class="pl-k">return</span> x<span class="pl-k">*</span>y <span class="pl-k">+</span> z;
		}];
	}
}

<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)[<span class="pl-c1">0</span>]);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)[<span class="pl-c1">1</span>](<span class="pl-c1">4</span>));</pre></div>
<ol>
<li>6, 10</li>
<li>undefined undefined</li>
<li>Reference Error</li>
<li>10, 6</li>
</ol>
<p>Answer: 1) 6, 10</p>
<h3><a id="user-content-5-what-would-be-the-output-of-following-code--3" class="anchor" aria-hidden="true" href="#5-what-would-be-the-output-of-following-code--3"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>5**. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span>(<span class="pl-smi">x</span>) {
	<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">y</span>) {
		<span class="pl-k">return</span> {
			result<span class="pl-k">:</span> x <span class="pl-k">*</span> y,
			<span class="pl-en">sum</span><span class="pl-k">:</span> <span class="pl-k">function</span>(<span class="pl-smi">z</span>) {
				<span class="pl-k">return</span> x <span class="pl-k">*</span> y <span class="pl-k">+</span> z;
			}
		};
	};
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>).<span class="pl-smi">result</span>);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>).<span class="pl-en">sum</span>(<span class="pl-c1">4</span>));</pre></div>
<ol>
<li>6, 10</li>
<li>undefined undefined</li>
<li>Reference Error</li>
<li>10, 6</li>
</ol>
<p>Answer: 1) 6, 10</p>
<h3><a id="user-content-6-what-would-be-the-output-of-following-code--2" class="anchor" aria-hidden="true" href="#6-what-would-be-the-output-of-following-code--2"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>6. What would be the output of following code ?</h3>
<div class="highlight highlight-source-js"><pre><span class="pl-k">function</span> <span class="pl-en">mul</span>(<span class="pl-smi">x</span>) {
	<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">y</span>) {
		<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">z</span>) {
			<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">w</span>) {
				<span class="pl-k">return</span> <span class="pl-k">function</span>(<span class="pl-smi">p</span>) {
					<span class="pl-k">return</span> x <span class="pl-k">*</span> y <span class="pl-k">*</span> z <span class="pl-k">*</span> w <span class="pl-k">*</span> p;
				};
			};
		};
	};
}
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-en">mul</span>(<span class="pl-c1">2</span>)(<span class="pl-c1">3</span>)(<span class="pl-c1">4</span>)(<span class="pl-c1">5</span>)(<span class="pl-c1">6</span>));</pre></div>
<ol>
<li>720</li>
<li>undefined</li>
<li>Reference Error</li>
<li>Type Error</li>
</ol>
<p>Answer: 1) 720</p>






</article>
      </div>