Javascript Interview Questions Flashcards
Difference between let, var and const
“var” is a function scoped and can be redeclared and updated. “let” and “const” are block scoped. “let” can be updated but not redeclared, while “const” can neither be updated nor redeclared.
block is the block its in e.g a while loop or for etc while function is a function scope.
== and ===
Will just compare values e.g. if you have a string compare to a number, it will convert string to number and compare only the value. === is strict, it compares the type too.
null vs undefined
In JavaScript, the term ‘undefined’ refers to a variable that has been declared but has not yet been assigned a value.
null is explicitly assigned by a programmer to indicate that a variable has no value.
purpose of this keyword
The “this” keyword is used to refer to the object that it belongs to. The value of “this” varies depending on the context in which it is used. For instance, when used inside a method, “this” refers to the object that the method is called on. When used alone, “this” refers to the global object. Similarly, when used inside a function, “this” also refers to the global object. On the other hand, when used inside an event, “this” refers to the element receiving the event. It is important to note that the value of “this” is determined at runtime and depends on the way in which the function or method is called.
method vs function in JS
function - block of code to perform a specific task. Executed when something invokes (calls) it.
method - function of an object they have to be assigned to the property of an object. Typically used to update an objects properties or perform operations based on current object properties.
asynchronous vs synchronous programming in JS difference
Synchronous programming, also known as blocking programming, is a programming model where the code is executed sequentially from top-to-bottom, meaning that the next operation is blocked until the current one completes. This means that the program’s execution is halted until the current operation is completed, and only then can the next operation be executed. This approach can be useful for simple programs that require a linear execution flow, but it can become problematic when dealing with more complex programs.
On the other hand, asynchronous programming is a programming model where the engine runs in an event loop. When an operation blocking is needed, the request starts, and the code keeps running without blocking for the result. This means that the program can continue to execute while waiting for the result of the operation. When the response is ready, the interrupt is fired, causing an event handler to be run, where the control flow continues. This approach helps reach a more efficient use of resources and can be particularly useful when dealing with long-running operations or when working with network I/O. However, it also requires a more complex programming model and can be difficult to understand and debug.
Array.map() purpose
creates a new array by calling a function on each element in the original array, store the returned values in the new array. typically when you want to apply a transformation to all array elements. e.g convert all letters to uppercase.
process does not alter original array, creates a new array. map function is a pure function. no side effects
arrow vs regular function
syntax - shorter syntax, can omit function keyword and return.
THIS keyword - regular functions THIS shows the object called the function, could be document window or whatever. THIS doesn’t bind its value in arrow functions, inherits from enclosing lexical / global context. apparently easier to predict behaviour but I don’t think so.
explain MEMOIZATION
smart way to make functions return faster by storing and reusing their past results. Like using a memory system, if a function is asked the same question again it retrieves the data from memory instead of recalculating it.
data binding
data synchronization between model and view. model and view linked to allow automatic data sync between the model and view.
expression vs statement
expression is a set of literals, variables, operators etc that evaluate to a single value. A statement does something e.g. it can make a function call.
strict mode in JS
Strict mode is a feature in JavaScript that was introduced in ECMAScript 5. It lets you write code in such a way that follows stricter rules.
When strict mode is enabled, the JavaScript engine enforces additional constraints. This means you may be able to catch some common errors that would have otherwise gone unnoticed. It also helps you write cleaner and more secure code.
// Strict mode
function strictFunc() {
“use strict”
username = “Marie”
console.log(username)
}
strictFunc()
uncaught reference error – doesn’t allow hoisting :O
Can you explain how JavaScript handles asynchronous operations
callbacks, promises and async wait.
callbacks - passed as args to other functions, invoked after completion of some operation. Ensures something is not executed until a necessary operation is complete.
Promises - an object that represents eventual completion or failure of async operation, and its resulting value. you can chain ops together and handle errors with these.
Async wait - syntactic sugar ontop of a promise. Uses async keyword to declare a function that returns a promise and await to wait for a promise to resolve before continuing with execution.
Explain closures
A function that has the ability to access its own scope. As well as the scope of the functions that surround it and the global scope.
Allows for functions to remember and access variables from an outer function even after the outer function has been executed.
outer function and variables and parameters are accessible within the inner function, even when that outer function is done running.
can cause things like memory leaks.
function numberGenerator() {
// Local “free” variable that ends up within the closure
var num = 1;
function checkNumber() {
console.log(num);
}
num++;
return checkNumber;
}
var number = numberGenerator();
number(); // 2
checkNumber forms a closure over the num variable because checkNumber is defined within numberGenerator and thus retains access to num, even after numberGenerator has returned.
The value of num when checkNumber is invoked is 2, which is the value num had at the end of the execution of numberGenerator.
Preservation of Lexical Scope: Closures allow functions to access variables from their lexical scope, even after the outer function has finished executing.
State Retention: The variable num retains its value between calls to checkNumber because the closure captures num and its state.
Encapsulation: Closures help in encapsulating state and functionality. In this example, num is kept private and protected from external modification, providing a controlled way to access and manipulate it.
How does JavaScript’s event loop work
mechanism for managing async operations and executing callbacks non blocking. Single threaded loop that continuously monitors the call stack and callback queue.
call stack - data structure that tracks execution of functions in js. Whenever a function invoked, pushed onto the call stack. When completes execution, popped off the stack.
OTHER HAND The callback queue - holds a list of functions ready to be realized once the call stack is empty. When an async op, such as event listener or network request, completes execution, it associated callback function pushed onto callback queue.
When callstack empty, even loop takes first function from the callback queue, pushing it to the call stack which runs it.