Function scope in Javascript - Time & Space Complexity

Time Complexity: Function scope

O(n)

Understanding Time Complexity

We want to see how the time it takes to run code changes when we use functions and their scopes.

How does the way variables are accessed inside functions affect the work done?

Scenario Under Consideration

Analyze the time complexity of the following code snippet.

function sumArray(arr) {
  let total = 0;
  for (let i = 0; i < arr.length; i++) {
    total += arr[i];
  }
  return total;
}

const numbers = [1, 2, 3, 4, 5];
sumArray(numbers);
    

This code adds up all numbers in an array using a function with its own variable scope.

Identify Repeating Operations

• Primary operation: The for-loop that goes through each item in the array.
• How many times: It runs once for every element in the array.

How Execution Grows With Input

As the array gets bigger, the loop runs more times, doing more work.

Input Size (n)	Approx. Operations
10	10 additions
100	100 additions
1000	1000 additions

Pattern observation: The work grows directly with the number of items; double the items, double the work.

Final Time Complexity

Time Complexity: O(n)

This means the time to finish grows in a straight line with the size of the input array.

Common Mistake

[X] Wrong: "Because the function has its own scope, it runs faster or slower depending on scope."

[OK] Correct: The function scope controls variable access but does not change how many times the loop runs. The main time cost is from looping over the array, not from scope rules.

Interview Connect

Understanding how function scope works with loops helps you explain how your code runs step-by-step, a skill that shows clear thinking in interviews.

Self-Check

"What if we changed the function to call itself recursively for each array element? How would the time complexity change?"

Practice

1. What does function scope mean in JavaScript?

easy

A. Variables declared inside a function are only accessible within that function.

B. Variables declared inside a function are accessible everywhere in the program.

C. Functions can only be called inside other functions.

D. Variables declared outside a function are not accessible inside it.

Solution

1. Step 1: Understand variable accessibility

   Variables declared inside a function are private to that function and cannot be accessed outside.

2. Step 2: Compare options with this rule

   Only Variables declared inside a function are only accessible within that function. correctly states this behavior.

3. Final Answer:

   Variables declared inside a function are only accessible within that function. -> Option A

4. Quick Check:

   Function scope = variables inside function only [OK]

Hint: Remember: function variables stay inside the function [OK]

Common Mistakes:

• Thinking variables inside functions are global
• Confusing function scope with block scope
• Assuming functions can't access outer variables

2. Which of the following is the correct way to declare a variable with function scope inside a function?

easy

A. if (true) { var x = 5; }

B. let x = 5;

C. function x = 5;

D. const x = 5;

Solution

1. Step 1: Identify valid function-scoped declarations

   Inside a function, let, const, and var declare variables with function or block scope.

2. Step 2: Check syntax correctness

   function x = 5; is invalid syntax. let x = 5; and const x = 5; use block scope. if (true) { var x = 5; } declares var with function scope, as it is hoisted to the function level.

3. Final Answer:

   if (true) { var x = 5; } -> Option A

4. Quick Check:

   Use const or let inside functions [OK]

Hint: Use var inside functions for function scope [OK]

Common Mistakes:

• Using 'function' keyword to declare variables
• Confusing block scope with function scope
• Assuming var is block scoped

3. What will be the output of this code?

function test() {
  let a = 10;
  if (true) {
    let a = 20;
    console.log(a);
  }
  console.log(a);
}
test();

medium

A. 10\n10

B. 20\n20

C. 20\n10

D. ReferenceError

Solution

1. Step 1: Understand variable shadowing inside blocks

   The inner let a = 20; creates a new variable scoped to the if-block, shadowing the outer a = 10.

2. Step 2: Trace console.log outputs

   Inside the if-block, a is 20, so first log prints 20. Outside the block but inside the function, a is still 10, so second log prints 10.

3. Final Answer:

   20 10 -> Option C

4. Quick Check:

   Block scope shadows outer variable = 20 then 10 [OK]

Hint: Inner let shadows outer let inside blocks [OK]

Common Mistakes:

• Assuming both logs print the same value
• Confusing block scope with function scope
• Expecting ReferenceError for inner variable

4. Find the error in this code:

function example() {
  console.log(x);
  let x = 5;
}
example();

medium

A. Outputs undefined

B. No error, outputs 5

C. SyntaxError due to missing semicolon

D. ReferenceError because x is used before declaration

Solution

1. Step 1: Understand temporal dead zone with let

   Variables declared with let are not accessible before their declaration inside the function, causing a ReferenceError if accessed earlier.

2. Step 2: Analyze the console.log usage

   The code tries to log x before it is declared with let x = 5;, causing a ReferenceError.

3. Final Answer:

   ReferenceError because x is used before declaration -> Option D

4. Quick Check:

   Accessing let before declaration = ReferenceError [OK]

Hint: Don't use let variables before declaring them [OK]

Common Mistakes:

• Thinking var behaves the same as let here
• Expecting undefined instead of error
• Ignoring temporal dead zone rules

5. You want to create a function that counts how many times it has been called using function scope. Which code correctly does this?

function counter() {
  // Your code here
}
console.log(counter());
console.log(counter());
console.log(counter());

hard

A. function counter() {
let count = 0;
count++;
return count;
}

B. function counter() {
if (!counter.count) counter.count = 0;
counter.count++;
return counter.count;
}

C. let count = 0;
function counter() {
count++;
return count;
}

D. function counter() {
const count = 0;
count++;
return count;
}

Solution

1. Step 1: Understand function scope and persistence

   Variables declared inside the function reset each call, so to keep count, it must be stored outside or as a property.

2. Step 2: Analyze each option

   function counter() { let count = 0; count++; return count; } resets count to 0 every call, so always returns 1. function counter() { if (!counter.count) counter.count = 0; counter.count++; return counter.count; } uses a property on the function to store count, preserving it across calls. let count = 0; function counter() { count++; return count; } uses a global variable, which works but is not function scope. function counter() { const count = 0; count++; return count; } tries to increment a constant, causing error.

3. Final Answer:

   function counter() { if (!counter.count) counter.count = 0; counter.count++; return counter.count; } -> Option B

4. Quick Check:

   Use function property to store persistent count [OK]

Hint: Use function properties to keep data across calls [OK]

Common Mistakes:

• Resetting count inside function each call
• Using const and trying to increment
• Using global variables instead of function scope