JSFiddle - React, Tailwind, and code Playground

by roeburg

HTML

<h1>Hoisting</h1><hr />
<p>
    In JavaScript function declarations and variable declarations are 'hoisted' i.e. are silently moved to the very top of the scope.
</p>
<div class="output" />

JavaScript

$(function(){
    // Error: Uncaught ReferenceError: globalVariable is not defined
    //$(".output").append(globalVariable);    
    // globalVariable = "gv";
    
    // The declaration of localVariable and localFunctionVariable is moved up!
    //$(".output").html(localVariable); 
    //$(".output").html(localFunctionVariable); 
    var localVariable = "lv";
    var localFunctionVariable = function (){ return "lvf"; };
        
    // The functionScope function is moved up!
    $(".output").html(functionScope); 
    function functionScope() { return " fs"; }    
})