Javascript Interview Preparation Cheatsheet

In a real-world scenario, if you look, you will most likely see questions like the ones we'll be discussing today, which we'll go over line by line.

• Scope
• Single thread
• Call Stack
• Hoisting

What is Scope ?

Introduction

JavaScript has a feature called scope. Though the concept of scope is not that easy to understand for many new developers, I will try my best to explain them to you in the simplest scope. Understanding scope will make your code stand out, reduce errors and help you make powerful design patterns with it.

Scope is the accessibility of variables, functions, and objects in some particular part of your code during runtime. In other words, scope determines the visibility of variables and other resources in areas of your code.

Scope in JavaScript

In the JavaScript language there are two types of scopes:

• Global Scope
• Local Scope

Note: Variables defined inside a function are in local scope while variables defined outside of a function are in the global scope. Each function when invoked creates a new scope.

Global Scope

When you start writing JavaScript in a document, you are already in the Global scope. There is only one Global scope throughout a JavaScript document. A variable is in the Global scope if it’s defined outside of a function.

// the scope is by default global
var name = 'saurabh';
console.log(name);

Variables inside the Global scope can be accessed and altered in any other scope.

var name = 'Saurabh';

console.log(name); // logs 'Saurabh'

function logName() {
    console.log(name); // 'name' is accessible here and everywhere else
}
logName(); // logs 'Saurabh'

Local Scope

Variables defined inside a function are in the local scope. And they have a different scope for every call of that function. This means that variables having the same name can be used in different functions. This is because those variables are bound to their respective functions, each having different scopes, and are not accessible in other functions.

// Global Scope
function someFunction() {
    // Local Scope #1
    function someOtherFunction() {
        // Local Scope #2
    }
}

// Global Scope
function anotherFunction() {
    // Local Scope #3
}
// Global Scope

JS is single threaded or multi threaded? 🤔

Let's Check

Javascript is single-threaded which means it has only one call stack. The call stack is the same as the stack data structure and stacks are FILO that is First In Last Out. Similarly, within the call stack, whenever a line of code gets inside the call stack it gets executed and move out of the stack. In this way, JavaScript is a single-thread language because of only one call stack.

Call Stack

The call stack is used by JavaScript to keep track of multiple function calls. It is like a real stack in data structures where data can be pushed and popped and follows the Last In First Out (LIFO) principle. We use call stack for memorizing which function is running right now. The below example demonstrates the call stack.

function fun1() {
console.log('Hi by fun1!');
}

function fun2() {
fun1();
console.log('Hi by fun2!');
}

fun2();

Output:

"Hi by fun1!"
"Hi by fun2!"

What is Hoisting

Hoisting is a JavaScript mechanism where variables and function declarations are moved to the top of their scope before code execution. This means that no matter where functions and variables are declared, they are moved to the top of their scope regardless of whether their scope is global or local. But the hoisting mechanism only moves the declaration. The assignments are left in place. To read more about it, click Here