Global execution context in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a global variable named message with the value 'Hello'.

Javascript

var [1] = 'Hello';

Drag options to blanks, or click blank then click option'

Amsg

Bmessage

Cgreeting

Dtext

Attempts:

3 left

💡 Hint

Common Mistakes

Using a different variable name than 'message'.

Forgetting to declare the variable with var, let, or const.

The global variable is named message. Using var message = 'Hello'; declares it globally.

2fill in blank

medium

Complete the code to log the global variable message to the console.

Javascript

console.log([1]);

Drag options to blanks, or click blank then click option'

Amessage

B'message'

Cconsole

Dlog

Attempts:

3 left

💡 Hint

Common Mistakes

Putting quotes around the variable name, which prints the name as a string.

Using console or log alone inside console.log().

To print the value of the variable message, pass it directly to console.log without quotes.

3fill in blank

hard

Fix the error in the code to correctly declare a global constant named PI with value 3.14.

Javascript

const [1] = 3.14;

Drag options to blanks, or click blank then click option'

Api

BPi

CpI

DPI

Attempts:

3 left

💡 Hint

Common Mistakes

Using lowercase or mixed case names like 'pi' or 'Pi' which are different variables.

Forgetting that JavaScript variable names are case-sensitive.

JavaScript is case-sensitive. The constant name should be PI exactly to match the intended global constant.

4fill in blank

hard

Fill both blanks to create a global object user with properties name and age.

Javascript

const user = { name: '[1]', age: [2] };

Drag options to blanks, or click blank then click option'

AAlice

B30

CBob

D25

Attempts:

3 left

💡 Hint

Common Mistakes

Using numbers as strings for age.

Mixing up the name and age values.

The object user has name set to 'Alice' and age set to 30.

5fill in blank

hard

Fill all three blanks to create a global function greet that returns a greeting with the given name.

Javascript

function [1]([2]) {
  return `Hello, [3]!`;
}

Drag options to blanks, or click blank then click option'

Agreet

Bname

C${name}

Duser

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect function or parameter names.

Not using template literals properly for string interpolation.

The function is named greet, takes a parameter name, and returns a greeting using template literals with ${name}.

Practice

1. What does the global execution context in JavaScript contain?

easy

A. Global variables, functions, and the global object

B. Only local variables inside functions

C. Only the code inside loops

D. Only event listeners

Solution

1. Step 1: Understand what global execution context is

   The global execution context is the environment where all JavaScript code runs initially, outside any function.

2. Step 2: Identify what it holds

   It holds global variables, functions declared globally, and the global object (like window in browsers).

3. Final Answer:

   Global variables, functions, and the global object -> Option A

4. Quick Check:

   Global execution context = global variables + functions + global object [OK]

Hint: Global context holds everything outside functions [OK]

Common Mistakes:

• Thinking it only holds local variables
• Confusing with function execution context
• Assuming it holds event listeners only

2. Which of the following is the correct way to declare a global variable in JavaScript?

easy

A. let myVar = 10;

B. function myVar() {}

C. const myVar;

D. var myVar = 10;

Solution

1. Step 1: Identify global variable declaration syntax

   Using var outside any function declares a global variable in JavaScript.

2. Step 2: Check other options

   function myVar() {} declares a function, not a variable. let and const can declare global variables but behave differently in scope and hoisting; const myVar; is invalid because const needs initialization.

3. Final Answer:

   var myVar = 10; -> Option D

4. Quick Check:

   Global variable declaration = var outside functions [OK]

Hint: Use var outside functions for global variables [OK]

Common Mistakes:

• Using const without initialization
• Confusing function declaration with variable
• Assuming let always creates global variables

3. What will be the output of the following code?

var x = 5;
function test() {
  var x = 10;
  console.log(x);
}
console.log(x);
test();
console.log(x);

medium

A. 10 10 10

B. 5 5 5

C. 5 10 5

D. 10 5 10

Solution

1. Step 1: Understand variable scopes

   var x = 5; declares a global variable x with value 5. Inside test(), var x = 10; declares a local variable x that shadows the global one.

2. Step 2: Trace console.log outputs

   First console.log(x); outside function prints global x = 5. Inside test(), console.log(x); prints local x = 10. After calling test(), the last console.log(x); prints global x again, which is still 5.

3. Final Answer:

   5 10 5 -> Option C

4. Quick Check:

   Global x = 5, local x = 10 inside function [OK]

Hint: Local vars shadow globals inside functions [OK]

Common Mistakes:

• Assuming global x changes after function call
• Confusing local and global scopes
• Expecting all outputs to be same

4. Identify the error in the following code related to global execution context:

console.log(a);
var a = 10;

medium

A. undefined because of hoisting of 'var a'

B. SyntaxError due to missing semicolon

C. 10 because 'a' is initialized before console.log

D. ReferenceError because 'a' is not defined

Solution

1. Step 1: Understand hoisting of var declarations

   In JavaScript, var declarations are hoisted to the top of their scope with an initial value of undefined.

2. Step 2: Trace the console.log output

   At console.log(a);, variable a exists but is not yet assigned 10, so it prints undefined.

3. Final Answer:

   undefined because of hoisting of 'var a' -> Option A

4. Quick Check:

   var hoisting = undefined before assignment [OK]

Hint: var declarations hoist but initialize as undefined [OK]

Common Mistakes:

• Expecting ReferenceError instead of undefined
• Thinking variable is initialized before console.log
• Confusing var with let/const hoisting

5. Consider this code snippet:

var count = 1;
function increment() {
  count++;
  var count = 10;
  console.log(count);
}
increment();
console.log(count);

What will be the output and why?

hard

A. 10 1

B. NaN 1

C. 1 1

D. ReferenceError 1

Solution

1. Step 1: Analyze variable hoisting inside function

   Inside increment(), var count is hoisted to the top of the function scope but not initialized yet, so it starts as undefined.

2. Step 2: Evaluate the increment operation

   The line count++; tries to increment the local count which is undefined, setting it to NaN. Then count = 10; assigns 10, and console.log(count); prints 10.

3. Step 3: Check global count after function call

   The global count remains unchanged at 1, so console.log(count); outside prints 1.

4. Final Answer:

   NaN 1 -> Option B

5. Quick Check:

   Local var hoisted undefined -> NaN on increment -> 10 on assignment [OK]

Hint: Hoisted local var undefined causes NaN on ++ [OK]

Common Mistakes:

• Thinking the output is NaN 1 because of undefined++
• Assuming increment affects global count
• Ignoring hoisting of local var