Files
conditionals_functions
Folders and files
| Name | Name | Last commit date | ||
|---|---|---|---|---|
parent directory.. | ||||
<!DOCTYPE HTML>
<html lang="en-US" >
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=11; IE=10; IE=9; IE=8; IE=7; IE=EDGE" />
<title>Conditionals and Functions | Javascript Challenges</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta name="description" content="">
<meta name="generator" content="GitBook 1.5.0">
<meta name="HandheldFriendly" content="true"/>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="../gitbook/images/apple-touch-icon-precomposed-152.png">
<link rel="shortcut icon" href="../gitbook/images/favicon.ico" type="image/x-icon">
<link rel="next" href="../delete/README.html" />
<link rel="prev" href="../objects2/README.html" />
</head>
<body>
<link rel="stylesheet" href="../gitbook/style.css">
<link rel="stylesheet" href="../gitbook/plugins/gitbook-plugin-exercises/exercises.css">
<div class="book" data-level="0.6" data-basepath=".." data-revision="1498683876884">
<div class="book-summary">
<div class="book-search">
<input type="text" placeholder="Type to search" class="form-control" />
</div>
<ul class="summary">
<li class="chapter " data-level="0" data-path="index.html">
<a href="../index.html">
<i class="fa fa-check"></i>
Intro
</a>
<ul class="articles">
<li class="chapter " data-level="0.1" data-path="autoexecute/README.html">
<a href="../autoexecute/README.html">
<i class="fa fa-check"></i>
<b>0.1.</b>
Self Invoking Functions
</a>
</li>
<li class="chapter " data-level="0.2" data-path="banking/README.html">
<a href="../banking/README.html">
<i class="fa fa-check"></i>
<b>0.2.</b>
Floats Operations Imprecision
</a>
</li>
<li class="chapter " data-level="0.3" data-path="hoisting1/README.html">
<a href="../hoisting1/README.html">
<i class="fa fa-check"></i>
<b>0.3.</b>
Hoisting and Conditionals
</a>
</li>
<li class="chapter " data-level="0.4" data-path="objects1/README.html">
<a href="../objects1/README.html">
<i class="fa fa-check"></i>
<b>0.4.</b>
Checking Properties
</a>
</li>
<li class="chapter " data-level="0.5" data-path="objects2/README.html">
<a href="../objects2/README.html">
<i class="fa fa-check"></i>
<b>0.5.</b>
Closure and Objects
</a>
</li>
<li class="chapter active" data-level="0.6" data-path="conditionals_functions/README.html">
<a href="../conditionals_functions/README.html">
<i class="fa fa-check"></i>
<b>0.6.</b>
Conditionals and Functions
</a>
</li>
<li class="chapter " data-level="0.7" data-path="delete/README.html">
<a href="../delete/README.html">
<i class="fa fa-check"></i>
<b>0.7.</b>
Delete
</a>
</li>
<li class="chapter " data-level="0.8" data-path="detectIE/README.html">
<a href="../detectIE/README.html">
<i class="fa fa-check"></i>
<b>0.8.</b>
Detect Internet Explorer
</a>
</li>
<li class="chapter " data-level="0.9" data-path="utf8/README.html">
<a href="../utf8/README.html">
<i class="fa fa-check"></i>
<b>0.9.</b>
Don't judge a book by its cover
</a>
</li>
<li class="chapter " data-level="0.10" data-path="encapsulate_collection/README.html">
<a href="../encapsulate_collection/README.html">
<i class="fa fa-check"></i>
<b>0.10.</b>
Encapsulate collection
</a>
</li>
<li class="chapter " data-level="0.11" data-path="even_odd/README.html">
<a href="../even_odd/README.html">
<i class="fa fa-check"></i>
<b>0.11.</b>
Even or Odd
</a>
</li>
<li class="chapter " data-level="0.12" data-path="nested_loop/README.html">
<a href="../nested_loop/README.html">
<i class="fa fa-check"></i>
<b>0.12.</b>
Exit nested loop
</a>
</li>
<li class="chapter " data-level="0.13" data-path="fooling_around_boolean/README.html">
<a href="../fooling_around_boolean/README.html">
<i class="fa fa-check"></i>
<b>0.13.</b>
#1 Fooling around boolean
</a>
</li>
<li class="chapter " data-level="0.14" data-path="fooling_around_boolean_2/README.html">
<a href="../fooling_around_boolean_2/README.html">
<i class="fa fa-check"></i>
<b>0.14.</b>
#2 Fooling around boolean
</a>
</li>
<li class="chapter " data-level="0.15" data-path="ghost_array/README.html">
<a href="../ghost_array/README.html">
<i class="fa fa-check"></i>
<b>0.15.</b>
Ghost Array
</a>
</li>
<li class="chapter " data-level="0.16" data-path="input_search/README.html">
<a href="../input_search/README.html">
<i class="fa fa-check"></i>
<b>0.16.</b>
Input Search
</a>
</li>
<li class="chapter " data-level="0.17" data-path="invaluable/README.html">
<a href="../invaluable/README.html">
<i class="fa fa-check"></i>
<b>0.17.</b>
Invaluable
</a>
</li>
<li class="chapter " data-level="0.18" data-path="json/README.html">
<a href="../json/README.html">
<i class="fa fa-check"></i>
<b>0.18.</b>
JSON
</a>
</li>
<li class="chapter " data-level="0.19" data-path="nested_scopes/README.html">
<a href="../nested_scopes/README.html">
<i class="fa fa-check"></i>
<b>0.19.</b>
Nested Scopes
</a>
</li>
<li class="chapter " data-level="0.20" data-path="now_you_see_me/README.html">
<a href="../now_you_see_me/README.html">
<i class="fa fa-check"></i>
<b>0.20.</b>
Now you see me...
</a>
</li>
<li class="chapter " data-level="0.21" data-path="frozen/README.html">
<a href="../frozen/README.html">
<i class="fa fa-check"></i>
<b>0.21.</b>
Frozen
</a>
</li>
<li class="chapter " data-level="0.22" data-path="point/README.html">
<a href="../point/README.html">
<i class="fa fa-check"></i>
<b>0.22.</b>
Point
</a>
</li>
<li class="chapter " data-level="0.23" data-path="running_man/README.html">
<a href="../running_man/README.html">
<i class="fa fa-check"></i>
<b>0.23.</b>
Running Man
</a>
</li>
<li class="chapter " data-level="0.24" data-path="scope/README.html">
<a href="../scope/README.html">
<i class="fa fa-check"></i>
<b>0.24.</b>
Scope
</a>
</li>
<li class="chapter " data-level="0.25" data-path="spartacus/README.html">
<a href="../spartacus/README.html">
<i class="fa fa-check"></i>
<b>0.25.</b>
Spartacus
</a>
</li>
<li class="chapter " data-level="0.26" data-path="terminator/README.html">
<a href="../terminator/README.html">
<i class="fa fa-check"></i>
<b>0.26.</b>
Terminator
</a>
</li>
<li class="chapter " data-level="0.27" data-path="timers/README.html">
<a href="../timers/README.html">
<i class="fa fa-check"></i>
<b>0.27.</b>
Timers
</a>
</li>
<li class="chapter " data-level="0.28" data-path="undefined_values_in_array/README.html">
<a href="../undefined_values_in_array/README.html">
<i class="fa fa-check"></i>
<b>0.28.</b>
Undefined Values in Arrays
</a>
</li>
<li class="chapter " data-level="0.29" data-path="array_map_parseint/README.html">
<a href="../array_map_parseint/README.html">
<i class="fa fa-check"></i>
<b>0.29.</b>
Array Map and ParseInt
</a>
</li>
<li class="chapter " data-level="0.30" data-path="variable_scope/README.html">
<a href="../variable_scope/README.html">
<i class="fa fa-check"></i>
<b>0.30.</b>
Variable Scope
</a>
</li>
</ul>
</li>
<li class="divider"></li>
<li>
<a href="http://www.gitbook.io/" target="blank" class="gitbook-link">Published using GitBook</a>
</li>
</ul>
</div>
<div class="book-body">
<div class="body-inner">
<div class="book-header">
<!-- Actions Left -->
<a href="#" class="btn pull-left toggle-summary" aria-label="Toggle summary"><i class="fa fa-align-justify"></i></a>
<a href="#" class="btn pull-left toggle-search" aria-label="Toggle search"><i class="fa fa-search"></i></a>
<div id="font-settings-wrapper" class="dropdown pull-left">
<a href="#" class="btn toggle-dropdown" aria-label="Toggle font settings"><i class="fa fa-font"></i>
</a>
<div class="dropdown-menu font-settings">
<div class="dropdown-caret">
<span class="caret-outer"></span>
<span class="caret-inner"></span>
</div>
<div class="buttons">
<button type="button" id="reduce-font-size" class="button size-2">A</button>
<button type="button" id="enlarge-font-size" class="button size-2">A</button>
</div>
<div class="buttons font-family-list">
<button type="button" data-font="0" class="button">Serif</button>
<button type="button" data-font="1" class="button">Sans</button>
</div>
<div class="buttons color-theme-list">
<button type="button" id="color-theme-preview-0" class="button size-3" data-theme="0">White</button>
<button type="button" id="color-theme-preview-1" class="button size-3" data-theme="1">Sepia</button>
<button type="button" id="color-theme-preview-2" class="button size-3" data-theme="2">Night</button>
</div>
</div>
</div>
<!-- Actions Right -->
<div class="dropdown pull-right">
<a href="#" class="btn toggle-dropdown" aria-label="Toggle share dropdown"><i class="fa fa-share-alt"></i>
</a>
<div class="dropdown-menu font-settings dropdown-left">
<div class="dropdown-caret">
<span class="caret-outer"></span>
<span class="caret-inner"></span>
</div>
<div class="buttons">
<button type="button" data-sharing="twitter" class="button">Twitter</button>
<button type="button" data-sharing="google-plus" class="button">Google</button>
<button type="button" data-sharing="facebook" class="button">Facebook</button>
<button type="button" data-sharing="weibo" class="button">Weibo</button>
<button type="button" data-sharing="instapaper" class="button">Instapaper</button>
</div>
</div>
</div>
<a href="#" target="_blank" class="btn pull-right google-plus-sharing-link sharing-link" data-sharing="google-plus" aria-label="Share on Google Plus"><i class="fa fa-google-plus"></i></a>
<a href="#" target="_blank" class="btn pull-right facebook-sharing-link sharing-link" data-sharing="facebook" aria-label="Share on Facebook"><i class="fa fa-facebook"></i></a>
<a href="#" target="_blank" class="btn pull-right twitter-sharing-link sharing-link" data-sharing="twitter" aria-label="Share on Twitter"><i class="fa fa-twitter"></i></a>
<!-- Title -->
<h1>
<i class="fa fa-circle-o-notch fa-spin"></i>
<a href="../" >Javascript Challenges</a>
</h1>
</div>
<div class="page-wrapper" tabindex="-1">
<div class="page-inner">
<section class="normal" id="section-gitbook_32">
<h1 id="conditionals-and-functions">Conditionals and functions</h1>
<p>Read and execute the following snippets of code:</p>
<h2 id="snippet-1">Snippet 1:</h2>
<pre><code>var test;
if ( true ) {
test = function () {
console.log( "That's true" );
};
} else {
test = function () {
console.log( "That's false" );
};
}
test(); // Shows "That's true"
</code></pre><h2 id="snippet-2">Snippet 2:</h2>
<pre><code>if ( true ) {
function test() {
console.log( "That's true" );
}
} else {
function test() {
console.log( "That's false" );
}
}
test(); // Shows "That's false"
</code></pre><h2 id="snippet-3">Snippet 3:</h2>
<pre><code>var test;
if ( true ) {
test = function () {
console.log( "That's true" );
};
} else {
function test() {
console.log( "That's false" );
}
}
test(); // Shows "That's true"
</code></pre>
</section>
<section class="exercise" id="section-gitbook_33">
<div class="header">
<h2>Exercise</h2>
</div>
<div class="alert alert-success">
<b>Correct!</b>
</div>
<div class="alert alert-danger error-message">
<b>False!</b>
</div>
<div class="message">
<p>What's the reason of this behaviour?</p>
</div>
<div class="editor" style="height: 60px">
</div>
<pre class="hidden code-solution">The execution of Snippet 1 shows "That's true" because function expressions are evaluated in execution time.
The execution of Snippet 2 shows "That's false" because function declarations are evaluated in evaluation time, and the second one overwrittes the first one.
The execution of Snippet 3 shows "That's true" because when the code has been evaluated it has changed to the function that could return "That's false" but when the code has been executed it has been overwritten again with the function expression.</pre>
<pre class="hidden code-validation">__match_answer_and_solution__</pre>
<div class="buttons">
<a href="#" class="button size-2 action-submit">Submit</a>
<a href="#" class="button size-2 action-solution">Solution</a>
</div>
</section>
</div>
</div>
</div>
<a href="../objects2/README.html" class="navigation navigation-prev " aria-label="Previous page: Closure and Objects"><i class="fa fa-angle-left"></i></a>
<a href="../delete/README.html" class="navigation navigation-next " aria-label="Next page: Delete"><i class="fa fa-angle-right"></i></a>
</div>
</div>
<script src="../gitbook/app.js"></script>
<script src="../gitbook/plugins/gitbook-plugin-exercises/ace/ace.js"></script>
<script src="../gitbook/plugins/gitbook-plugin-exercises/ace/theme-tomorrow.js"></script>
<script src="../gitbook/plugins/gitbook-plugin-exercises/ace/mode-javascript.js"></script>
<script src="../gitbook/plugins/gitbook-plugin-exercises/exercises.js"></script>
<script src="https://cdn.mathjax.org/mathjax/2.4-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script src="../gitbook/plugins/gitbook-plugin-mathjax/plugin.js"></script>
<script>
require(["gitbook"], function(gitbook) {
var config = {"fontSettings":{"theme":null,"family":"sans","size":2}};
gitbook.start(config);
});
</script>
<script src="../gitbook/plugins/gitbook-plugin-exercises/jsrepl/jsrepl.js" id="jsrepl-script"></script>
</body>
</html>