this in global scope in Javascript - Time & Space Complexity
Let's explore how the keyword this behaves when used in the global scope in JavaScript.
We want to understand what this points to and how it affects code execution.
Analyze the time complexity of the following code snippet.
console.log(this);
function showThis() {
console.log(this);
}
showThis();
This code logs the value of this in the global scope and inside a regular function call.
Identify the loops, recursion, array traversals that repeat.
- Primary operation: There are no loops or repeated operations here.
- How many times: The code runs a few simple statements once each.
Explain the growth pattern intuitively.
| Input Size (n) | Approx. Operations |
|---|---|
| 10 | About 3 operations |
| 100 | About 3 operations |
| 1000 | About 3 operations |
Pattern observation: The number of operations stays the same no matter how big the input is because there are no loops or repeated steps.
Time Complexity: O(1)
This means the code runs in constant time, doing the same small number of steps regardless of input size.
[X] Wrong: "this always points to the global object no matter where it is used."
[OK] Correct: Inside functions, this can point to different things depending on how the function is called, not always the global object.
Understanding how this works in different scopes is a key skill that shows you know how JavaScript handles context, which helps you write clearer and bug-free code.
"What if we changed the regular function to an arrow function? How would the value of this change inside the function?"
Practice
this refer to when used in the global scope (outside any function) in a browser environment?Solution
Step 1: Understand global scope context
In the global scope,thisrefers to the global object in JavaScript.Step 2: Identify the global object in browsers
In browsers, the global object iswindow, sothispoints towindow.Final Answer:
The global object, which iswindowin browsers -> Option CQuick Check:
thisin global scope =window[OK]
this is window in browsers [OK]- Thinking
thisis undefined in global scope by default - Confusing
thiswith the current function - Assuming
thispoints todocument
this in the global scope refers to the window object?Solution
Step 1: Recall global
In the browser global scope,thisin browsersthispoints to thewindowobject.Step 2: Compare
Usingthiswithwindowthis === windowreturnstrueifthisis the global object.Final Answer:
console.log(this === window); -> Option BQuick Check:
this === windowis true in global scope [OK]
this === window to confirm global this [OK]- Using
documentinstead ofwindow - Using
globalwhich is Node.js specific - Comparing
thistonull
console.log(this === window); 'use strict'; console.log(this);
Solution
Step 1: Evaluate first console.log before strict mode
Before'use strict',thisin global scope equalswindow, sothis === windowistrue.Step 2: Evaluate second console.log after strict mode
Strict mode affectsthisinside functions, but in global scopethisstill points towindow, so it logs thewindowobject.Final Answer:
true and thenwindowobject -> Option DQuick Check:
Globalthis=windoweven with strict mode [OK]
this in browsers [OK]- Assuming
thisbecomes undefined in global scope with strict mode - Confusing strict mode effects inside functions vs global scope
- Thinking
thisequalsglobalin browsers
'use strict';
function checkThis() {
console.log(this);
}
checkThis();What is the problem if you want to log the global object using
this inside checkThis?Solution
Step 1: Understand strict mode effect inside functions
In strict mode,thisinside a regular function called without an object isundefined.Step 2: Check the function call context
The functioncheckThisis called directly, sothisis not bound to the global object.Final Answer:
thisisundefinedbecause of strict mode inside the function -> Option AQuick Check:
Strict mode makesthisundefined in functions called globally [OK]
this to undefined inside functions [OK]- Assuming
thisalways points to global object - Thinking strict mode causes syntax errors here
- Confusing function
thiswith globalthis
myGlobal and access it via this.myGlobal in the global scope under strict mode. Which code snippet correctly achieves this in a browser environment?Solution
Step 1: Understand variable declaration and global object
In strict mode, variables declared withvar,let, orconstdo not become properties ofwindow.Step 2: Check how to explicitly add property to global object
Assigningwindow.myGlobal = 10explicitly addsmyGlobalas a property of the global object.Final Answer:
window.myGlobal = 10; console.log(this.myGlobal); -> Option AQuick Check:
Onlywindow.myGlobalensuresthis.myGlobalexists globally [OK]
window.myGlobal to add global property reliably [OK]- Using
letorconstexpecting globalthisproperty - Assuming
varalways adds property tothisin all contexts - Not understanding difference between variable and global object property
Ready to prove it?
Pass the test and this pattern moves unknown
