Javascript FAQs

16 min readApr 24, 2020

For beginners & intermediates

Javascript is a synchronous single-threaded language. It means, JS can execute single command at a time in a specific order.

Deep copy

A deep copy means that all of the values of the new variable are copied and disconnected from the original variable.

var a = 5;
var b = a; // 5
b = 6;
console.log(a);  // 5
console.log(b);  // 6

Shallow copy

A shallow copy means that certain (sub-)values are still connected to the original variable.

var user = { name: 'Kishan', gender: 'M' };
var user2= user; 
user2.name = 'Kishan Patel';
// Since 'user2' is reference of 'user'
console.log(user);  // { name: 'Kishan Patel', gender: 'M' };
console.log(user2);  // { name: 'Kishan Patel', gender: 'M' };

// Same applies to array
var a = [1]
var b = a;
b.push(2);
console.log(a); // [1,2]
console.log(b); // [1,2]

structuredClone

// Create an ArrayBuffer with a size in bytes
const buffer1 = new ArrayBuffer(16);

const object1 = {
  buffer: buffer1,
};

// Clone the object containing the buffer, and transfer it
const object2 = structuredClone(object1, { transfer: [buffer1] });

Use Strict

"use strict"; Defines that JavaScript code should be executed in "strict mode".

"use strict";
x = 3.14;    // This will cause an error because x is not declared
---
"use strict";
myFunction();
function myFunction() {
  y = 3.14;   // This will also cause an error because y is not declared
}

Ways to create Object and Array

Create Array

// Array Literal:
const arr1 = [1,2,3,4];

// Array Constructor
const arr2 = new Array(1,2,3,4);

// Array.of():
const arr3 = Array.of(1, 2, 3, 4);

// Array.from():
let arr4 = Array.from("Hello"); // ['H', 'e', 'l', 'l', 'o']

Create Object

// Object Literal:
let obj1 = {a: 1, b: 2}

// Object Constructor
let obj2 = new Object({a: 1, b: 2})

// Object.create():
const obj3 = Object.create(null);
obj.a = 1;
obj.b = 2;

// Factory Function:
function createPerson(name, age) {
  return {
    name: name,
    age: age
  };
}
const person = createPerson('John', 25);

// ES6 Object.assign():
const obj1 = { name: 'John' };
const obj2 = { age: 25 };
const obj = Object.assign(obj1, obj2);

What are the array detection mutation methods?

As the name suggests, mutation methods modify the original array. Below is the list of array mutation methods that trigger view updates.

push()
| Add an element at the last of an array.

let arr = [1,2,3,4];
arr.push(5);
console.log(arr) // [1, 2, 3, 4, 5]

unshift()
| Add an element at the beginning of an array.

let arr = [1,2,3,4];
arr.unshift(0);
console.log(arr) // [0, 1, 2, 3, 4]

pop()
| Remove the last element of an array.

let arr = [1,2,3,4];
arr.pop(0);
console.log(arr) // [1, 2, 3]

shift()
| Remove the first element of an array.

let arr = [1,2,3,4];
arr.shift(0);
console.log(arr) // [2, 3, 4]

splice()
| Splice is used for multiple purposes:
1. to insert an element at the specified index.
2. to replace one or multiple elements in an array.
3. to remove an element from the selected index.

months = ['Jan', 'Feb', 'Apr', 'Jun', 'Aug'];
months.splice(2, 0, 'Mar');
console.log(months); // ['Jan', 'Feb', 'Mar', 'Apr', 'Jun', 'Aug']

months.splice(4, 2, 'May'); // Replace 'Jun', 'Aug' with 'May'
console.log(months); // ['Jan', 'Feb', 'Mar', 'Apr', 'May']

months.splice(1, 3); // Remove 3 elements starting from index 1
console.log(months); // ['Jan', 'May']

sort()
| Used to sort an array with ascending order.

let numArr = [3,2,4,1,5];
numArr.sort();
console.log(numArr); // [1, 2, 3, 4, 5]

reverse()
| Used to reverse an array

let numArr = [3,2,4,1,5];
numArr.reverse();
console.log(numArr); // [5, 1, 4, 2, 3]

To sort an array in descending order you can combine sort() & reverse()

let numArr = [3,2,4,1,5];
numArr.sort().reverse();
console.log(numArr); // [5, 4, 3, 2, 1]

What are the array detection non-mutation methods?

The methods which do not mutate the original array but always return a new array are called non-mutation methods. Below is the list of non-mutation methods.

The following methods will not modify the original array.

filter()
| Used to filter array with given condition

Example 1:

// Example 1:
let numArr = [1,2,3,4,5,6];
numArr.filter(num => num > 2); // [3,4,5,6]
console.log(numArr); // [1,2,3,4,5,6]

Example 2:

In below example .filter(Boolean) is the same as .filter(x => Boolean(x)).

let address = "foo";
let city;
let state = "bar";
let zip;

let text = [address, city, state, zip].filter(Boolean).join(", ");
console.log(text); // foo, bar

concat()
| Used to combine two arrays and to add an element to the last.

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];

const array3 = array1.concat(array2);
console.log(array3); //  ['a', 'b', 'c', 'd', 'e', 'f']

console.log(array3.concat('g')); // ['a', 'b', 'c', 'd', 'e', 'f', 'g']

slice()
| The slice() method returns a shallow copy of a portion of an array into a new array object selected from begin to end (end not included) where begin and end represent the index of items in that array.

const animals = ['Ant', 'Bison', 'Camel', 'Elephant', 'Tiger'];

console.log(animals.slice()); // ['Ant', 'Bison', 'Camel', 'Elephant', 'Tiger']

console.log(animals.slice(2)); // ['Camel', 'Elephant', 'Tiger']

console.log(animals.slice(2, 4)); // ['Camel', 'Elephant']

console.log(animals.slice(1, 5)); // ['Bison', 'Camel', 'Elephant', 'Tiger']

reduce()

const array1 = [1,2,3,4];

const reducer = (accumulator, currentValue) => accumulator + currentValue;

console.log(array1.reduce(reducer)); // 1 + 2 + 3+ 4 + 5 => 10

const array2 = [5,4,3,2,1];
console.log(array2.reduce(reducer)); // 5 + 4 + 3 + 2 + 1 => 15

Object.groupBy

const people = [
  { name: 'Kishan', age: 30 },
  { name: 'Rakesh', age: 32 },
  { name: 'Kedar', age: 26 },
  { name: 'Ajay', age: 26 }
];

const groupByAge = Object.groupBy(people, person => person.age);
console.log(groupByAge);
// Output
/*
{
  26: [
    { name: 'Kedar', age: 26 },
    { name: 'Ajay', age: 26 }
  ],
  30: [{ name: 'Kishan', age: 30 }]
  32: [{ name: 'Rakesh', age: 32 }]
}
*/

Array.prototype.flat()

const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// expected output: Array [0, 1, 2, 3, 4]

const arr2 = [0, 1, [2, [3, [4, 5]]]];

console.log(arr2.flat());
// expected output: Array [0, 1, 2, Array [3, Array [4, 5]]]

console.log(arr2.flat(2));
// expected output: Array [0, 1, 2, 3, Array [4, 5]]

console.log(arr2.flat(Infinity));
// expected output: Array [0, 1, 2, 3, 4, 5]

Check out here for more array methods.

Object Methods

Object.keys & Object.values

const object1 = {
  name: 'Kishan',
  gender: 'Male'
};

Object.keys(object1); // ['name', 'gender']
Object.values(object1); // ['Kishan', 'Male']

Object.entries

const object1 = {
  a: 'somestring',
  b: 42
};

for (const [key, value] of Object.entries(object1)) {
  console.log(`${key}: ${value}`);
}

// Expected output:
// "a: somestring"
// "b: 42"

Object.hasOwn()

The Object.hasOwn() static method returns true if the specified object has the indicated property as its own property.

const user = {
  firstName: 'Jhon'
};

console.log(Object.hasOwn(user, 'firstName'));
// Expected output: true
console.log(Object.hasOwn(user, 'lastName'));
// Expected output: false

Checkout here for more Object methods

Most commonly used string methods

Lexical Scope

var a = 10;
var func = function (){
    var b = 20;
    console.log("a and b is accessible (outer):", a, b);
    var innerFunc= function (){
        var c = 30;
        console.log("a and b and c is accessible (inner):", a, b, c);
    }
    innerFunc();
    return;
}
func();
console.log("only a is accessible (global):", a);

ES6 new features…

ES stands for ECMA Script.

let Vs var

What is a spread operator?

The spread operator is a useful and quick syntax for adding items to arrays, combining arrays or objects, and spreading an array out into a function’s arguments.

Joining two objects

const hash = {a: 1, b: 2};
console.log({...hash, ...{c: 3}}); // {a: 1, b: 2, c: 3}

Concat object conditionally

const a = {a: 1, b: 2}
const c = {c: 3, ...(true && a)}

Joining two arrays

const fruits = ['Mango', 'Banana', 'Apple']
console.log(['Grapes', ...fruits, 'Goava']);
// ['Grapes', 'Mango', 'Banana', 'Apple', 'Goava']

Destructuring

var [head, ...tail] = [1, 2, 3, 4];
console.log(head); // 1
console.log(tail); // [2, 3, 4]

What is the rest parameter?

The rest parameter syntax allows us to represent an indefinite number of arguments as an array.

function sum(...theArgs) {
  let total = 0;
  for (const arg of theArgs) {
    total += arg;
  }
  return total;
}

console.log(sum(1, 2, 3));  // 6

console.log(sum(1, 2, 3, 4)); // 10

Arrow function Vs. normal function

Syntax

let add = (x, y) => {
  // do some other calculation
  return "Sum of two numbers: " + (x + y)
}

Return in one line:

let add = (x, y) => x + y;

If there’s only one argument, then the parentheses are not required either.

let squareNum = x => x * x;

Without argument

let sayHi = _ => console.log("Hi");

2. Use of this keyword

Unlike regular functions, arrow functions do not have their own this. The value of this inside an arrow function remains the same throughout the lifecycle of the function and is always bound to the value of this in the closest non-arrow parent function.

Example:

const user = {
    id: 1,
    firstName: 'Kishan',
    lastName: 'Patel',
    getFullName: function() {
        // 'this' binding works here
        return `${this.firstName} ${this.lastName}`;
    },
    getMyFullName: () => {
        // 'this' binding doesn't work here
        return `${this.firstName} ${this.lastName}`;
    }
}

console.log(user.getFullName()); // Kishan Patel
console.log(user.getMyFullName()); // undefined undefined

3. Doesn’t allow duplicate named parameter

Arrow functions can never have duplicate named parameters, whether in strict or non-strict mode.

It means that the following is valid JavaScript:

function add(x, x){}

It is not, however, when using strict mode:

'use strict';
function add(x, x){}
// SyntaxError: duplicate formal argument x

With arrow functions, duplicate named arguments are always, regardless of strict or non-strict mode, invalid.

(x, x) => {}
// SyntaxError: duplicate argument names not allowed in this context

4. new keyword

Regular functions created using function declarations or expressions are constructible and callable. Since regular functions are constructible, they can be called using the new keyword.
However, the arrow functions are only callable and not constructible, i.e arrow functions can never be used as constructor functions. Hence, they can never be invoked with the new keyword.

Template literals ( ` )

| Template literals are string literals allowing embedded expressions. You can use multi-line strings and string interpolation features with them.

Example:

// 1. single line
console.log(`Hello there!`); // "Hello there!"

// 2. multi line
console.log(`Hello there!,
 How are you?`); // 'Hello there!,\n How are you?'

// 3. It is mainly used for variable
const name = 'Kishan';
console.log(`Hello ${name}, how are you?`); // Hello Kishan, how are you?

Math + Number + String + Array + Object APIs

Many new library additions, including core Math libraries, Array conversion helpers, String helpers, and Object.assign for copying.

Nullish coalescing operator (??)

The nullish coalescing (??) operator is a logical operator that returns its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.

console.log(null ?? 'default string');  // "default string"

console.log(undefined ?? 10);  // 10

console.log(0 ?? 10);  // 0

console.log('' ?? 10);  // 42

console.log(NaN ?? 10);  // Nan

Logical OR || operator

const x = undefined || null || '' || 'hello';

console.log(x); // Output: 'hello'

Bit wise OR operator (|) Vs Logical OR operator (||)

Single | is a bitwise OR operator. If you do 2 | 3, it converts to binary and performs OR operation. 01 11 Results in 11 equal to 3.
Whereas the || operator checks if the first argument is true, if it is true it returns else it goes to the other operator. 2 || 3 returns 2 since 2 is true.

JavaScript Numeric Separator (_)

const num1 = 1_000_000_000;
const num2 = 1000000000;
console.log(num1 === num2); // true

Data Types

Primitive Data

A primitive data value is a single simple data value with no additional properties and methods.

The typeof operator can return one of these primitive types:

string
number
boolean
undefined

Complex Data

The typeof operator can return one of two complex types:

function
object

How to check if a variable is an array

Remember typeof returns object for array and object, so we can not distinguish them through typeof keyword, instead we can use Array.isArray method.

console.log(typeof({})); // 'object'
console.log(typeof([])); // 'object'
console.log(Array.isArray([])); // true

Operators

Arithmetic Operators
( +, -, *, **, /, %, ++, - -)
Assignment Operators
( =, +=, -=, *=, /=, %=, **= )
Comparison Operators
(==, ===, !=, !==, >, <, >=, <=, ?)
Logical Operators
(&&, ||, !)
Bitwise Operators
(& AND, | OR, ~ NOT, ^ XOR, << Zero fill left shift, >> Signed right shift, >>> Zero fill right shift)

count++ vs ++count

In JavaScript, both count++ and ++count are increment operators used to increase the value of a variable by 1. However, they have a slight difference in behavior.

count++ is the postfix increment operator. It first returns the current value of count and then increments it. Here's an example:

let count = 5;
console.log(count++);  // Output: 5
console.log(count);    // Output: 6

In this case, count++ returns the original value of count, which is 5, and then increments it to 6.

2. ++count is the prefix increment operator. It increments the value of count first and then returns the updated value. Here's an example:

let count = 5;
console.log(++count);  // Output: 6
console.log(count);    // Output: 6

In this case, ++count increments the value of count to 6 and then returns the updated value.

Another example

let count = 0;
console.log(count++ + ++count); // 2
// 0 + 2


let newCount = 0;
console.log(++count + count++); // 2
// 1 + 1

Let’s break down the 1st example, expression count++ + ++count step by step:

count++ is the postfix increment operator. It returns the current value of count (which is 0) and then increments it by 1. So, after this operation, count becomes 1.
++count is the prefix increment operator. It increments the value of count by 1 (which is now 1) and then returns the updated value. So, the value of count becomes 2.
Now, we evaluate the expression 0 + 2. Since count++ returned the original value of count before incrementing (which was 0), and ++count returned the updated value of count after incrementing (which is 2), the expression simplifies to 0 + 2, resulting in the value 2.

Date Hacks

const date = new Date(2024, 2, 12);
// Tue Mar 12 2024 00:00:00

// Get start date of a given date
new Date(date.getFullYear(), date.getMonth()); //  Fri Mar 01 2024 00:00:00
// or
new Date(date.getFullYear(), date.getMonth(), 1);//Fri Mar 01 2024 00:00:00

// To get last day of last month put 0 for date
new Date(date.getFullYear(), date.getMonth(), 0);
// Thu Feb 29 2024 00:00:00

// So now, to get last date of a given date
new Date(date.getFullYear(), date.getMonth() + 1, 0);
// Sun Mar 31 2024 00:00:00

If the given month is Jan, you can still get the previous month which is Dec of last year.

const date = new Date(2024, 0, 1);
// Mon Jan 01 2024 00:00:00

new Date(date.getFullYear(), date.getMonth() - 1, 1);
// Fri Dec 01 2023 00:00:00

new Date(dt.getFullYear(), dt.getMonth(), 0)
// Sun Dec 31 2023 00:00:00

Function.prototype.call()

| Syntax: func.call(obj)

The method Call invokes the function and allows you to pass in arguments one by one using commas.

let customer1 = { name: 'Leo', email: 'leo@gmail.com' };
let customer2 = { name: 'Nat', email: 'nat@hotmail.com' };
function greeting(text) {
    console.log(`${text} ${this.name}`);
}
greeting.call(customer1, 'Hello'); // Hello Leo
greeting.call(customer2, 'Hello'); // Hello Nat

Function.prototype.apply()

The method Apply invokes the function and allows you to pass in arguments as an array.

let customer1 = { name: 'Leo', email: 'leo@gmail.com' };
function greeting(text, text2) {
   console.log(`${text} ${this.name}, ${text2}`);
}
greeting.apply(customer1, ['Hello', 'How are you?']); // output Hello Leo, How are you?

Function.prototype.bind()

The Bind method returns a new function, allowing you to pass in a this array and any number of arguments. Use it when you want that function to later be called with a certain context like events.

let customer1 = { name: 'Leo', email: 'leo@gmail.com' };
function greeting(text) {
   console.log(`${text} ${this.name}`);
}
let helloLeo = greeting.bind(customer1);
helloLeo('Hello'); // Hello Leo

The Bind implementation would be like this:

Function.prototype.bind = function(context) {
    var fn = this;
    return function() {
        fn.apply(context, arguments);
    };
};

Call and Apply are interchangeable. You can decide whether it’s easier to send in an array or a comma-separated list of arguments. Bind is different. It always returns a new function.

We can use Bind to curry functions like in the example. We can take a simple hello function and turn it into a hello on or helloKelly. You can use it for events where we don’t know when they’ll be fired but know what the context is.

Promise

Example 1:

const testPromise = () => {
    return new Promise((resolve, reject) => {
        let a = 2;
        if (a == 2) {
            resolve("Success!")
        } else {
            reject("Failed!")
        }
    })
}

testPromise()
.then((message) => console.log(message))
.catch(message => console.log(message)); // Success!
.finally(() => {
    console.log('Finally!');
 }); // it will always run

Example 2: Promise.all

const promise1 = new Promise((resolve, reject) => {
    resolve('Resolved promise 1.')
})

const promise2 = new Promise((resolve, reject) => {
    resolve('Resolved promise 2.')
})

const promise3 = new Promise((resolve, reject) => {
    resolve('Resolved promise 3.')
})

Promise.all([
    promise1,
    promise2,
    promise3
]).then(message => {
    console.log(message);
})

// Output: ['Resolved promise 1.', 'Resolved promise 2.', 'Resolved promise 3.']

Example 3: Promise.race

const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, 'one');
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'two');
});

Promise.race([promise1, promise2]).then((value) => {
  console.log(value);
  // Both resolve, but promise2 is faster
});
// Expected output: "two"

setTimeout

The setTimeout() method calls a function after a number of milliseconds.

console.log('Initial');

setTimeout(() => {
    console.log('setTimeOut 1');
}, 1)

setTimeout(() => {
    console.log('setTimeOut 2');
}, 0)

setTimeout(() => {
    console.log('setTimeOut 3');
})

console.log('Last');

// Initial
// Last
// setTimeOut 2
// setTimeOut 3
// setTimeOut 1


for(var i=1; i < 6; i++) {
  setTimeout(() => {
      console.log(i);
  }, i * 1000)
}

// 6, 6, 6, 6, 6, 6

If you just change the var to let it will print 0 to 4, because let is a block scope means each time loop runs it will create a new copy of i with it.

for(let i=1; i < 6; i++) {
  setTimeout(() => {
      console.log(i);
  }, i * 1000)
}
// 1, 2, 3, 4, 5

We can still do it with var using closure

for(var i=1; i < 6; i++) {
  function close(x) {
      setTimeout(() => {
          console.log(x);
      }, x * 1000)
  }
  close(i);
}
// 1, 2, 3, 4, 5

clearTimeout


let setTimeoutId = setTimeout(bye, 1);

console.log('Hello');

clearTimeout(setTimeoutId);

function bye() {
  console.log('Bye');
}

// it will just print Hello, it will never say goodbye because we 
// have cleared the setTimeout

setInterval

It will run the function every time after a given millisecond until we clear the interval id

const intervalID = setInterval(myCallback, 1000, "Kishan", "Patel");

function welcomeUser(firstName, lastName) {
  console.log(`Welcome ${firstName} ${lastName}`)
}

clearInterval(intervalID); // to stop running the function

setImmediate

This method is used to break up long-running operations and run a callback function immediately after the browser has completed other operations such as events and display updates.

Syntax

setImmediate(func)
setImmediate(func, param0)
setImmediate(func, param0, param1)
setImmediate(func, param0, param1, /* … ,*/ paramN)

Clouser

A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function’s scope from an inner function.

function outer() {
    var a = 10;
    function inner() {
        console.log(a);
    }
    return inner;
}

outer()(); 
// outer() it will return innter function and by outer()() we are 
// calling inner function

How Is This Code Safe?

Example 1:

const id = 1;

sql`select * from users where id = ${id}`

function sql(strings, id) {
    console.log(strings);
    console.log(id);
}

// [ 'select * from users where id = ', '' ]
// 1

Example 2:

const id = 1;

sql`select * from users where id = ${id} OR age > ${18}`

function sql(strings, id, age) {
    console.log(strings);
    console.log(id);
    console.log(age);
}

// [ 'select * from users where id = ', ' OR age > ', '' ]
// 1
// 18

Example 3:

const id = 1;

sql`select * from users where id = ${id} OR age > ${18}`

// using rest params
function sql(strings, ...values) {
    console.log(strings);
    console.log(values);
}

// [ 'select * from users where id = ', ' OR age > ', '' ]
// [1, 18]

Now let’s construct the sql to prevent sql injection

| Note: in the below example the whole id(‘1; DROP TABLE users;’) is wrapped inside double quote.

const id = '1; DROP TABLE users;';
const age = 20;
const a = sql`select * from users where id = ${id} OR age > ${age};`
console.log(a);
function sql(strings, ...values) {
    return values.reduce((finalString, value, index) => {
        return `${finalString}"${value}"${strings[index+1]}`
    }, strings[0])
}

// select * from users where id = "1; DROP TABLE users;" OR age > "20";

Errors and error handling

The following are the 7 types of errors in JavaScript:

Syntax error — It occurs when you use a syntax incorrectly.

const abc = () =>
  console.log(anything)
}

// Output
}
^
SyntaxError: Unexpected token }

Here, an opening bracket is missing in the code, which invokes the Syntax error constructor.

Reference Error — In a case where a variable reference can’t be found or hasn’t been declared, then a Reference error occurs.

console.log(x);

// Output
ReferenceError: x is not defined

Type Error — An error occurs when a value is used outside the scope of its data type.

20.split(""); //converts a number to an array
// TypeError: num.split is not a function

let a = 1;
a.push('something'); // pushing a values to non array variable

// TypeError: a.push is not a function

EvalError: The EvalError object indicates an error regarding the global eval() function. This exception is not thrown by JavaScript anymore, however the EvalError object remains for compatibility.

try {
  throw new EvalError("Hello");
} catch (e) {
  console.log(e instanceof EvalError); // true
  console.log(e.message); // "Hello"
  console.log(e.name); // "EvalError"
  console.log(e.stack); // Stack of the error
}

RangeError — There is an error when a range of expected values is required, as shown below:

const checkRange = (num)=> {
  if (num < 30) throw new RangeError("Wrong number");
  return true
}

checkRange(10);

// RangeError: Wrong number

URI Error — When the wrong character(s) are used in a URI function, the error is called.

console.log(decodeURI("https://www.google.com"));
console.log(decodeURI("%sdfk"));

// URIError: URI malformed

Internal Error

Example cases are mostly when something is too large, e.g.:

too many switch cases
too many parentheses in regular expression
array initializer too large
too much recursion

Other

document.designMode
| document.designMode controls whether the entire document is editable. Valid values are "on" and "off" .

console.log(document.designMode); // by default it's 'off'
document.designMode = 'on';

navigator.clipboard.writeText

const copyText = (text) => navigator.clipboard.writeText('Kishan');

Console Hacks

console.table

Console.time

The console.time() method starts a timer you can use to track how long an operation takes.

Console.timeLog

The console.timeLog() method logs the current value of a timer that was previously started by calling console.time().

Console.timeEnd

The console.timeEnd() stops a timer that was previously started by calling console.time().

console.time('abc');

console.timeLog('abc');
// abc: xxxx.xxxxxxx ms - current value of a timer
// abc: 5487.761962890625 ms

console.timeLog('abc');
// abc: 7594.18603515625 ms

console.timeEnd('abc');
// abc: 15128.405029296875 ms

Record Screen

Check out my article to deep dive into Javascript.

Thank you for reading the article, happy coding…:)

Javascript FAQs

Deep copy

Shallow copy

structuredClone

Use Strict

Ways to create Object and Array

What are the array detection mutation methods?

What are the array detection non-mutation methods?

Object.groupBy

Array.prototype.flat()

Object Methods

Most commonly used string methods

Lexical Scope

let Vs var

What is a spread operator?

Destructuring

What is the rest parameter?

Arrow function Vs. normal function

Template literals ( ` )

Math + Number + String + Array + Object APIs

Nullish coalescing operator (??)

Logical OR || operator

Bit wise OR operator (|) Vs Logical OR operator (||)

JavaScript Numeric Separator (_)

Data Types

Primitive Data

Complex Data

How to check if a variable is an array

Operators

count++ vs ++count

Date Hacks

Function.prototype.call()

Function.prototype.apply()

Function.prototype.bind()

Promise

setTimeout

clearTimeout

setInterval

setImmediate

Clouser

How Is This Code Safe?

Errors and error handling

Other

Console Hacks

Record Screen

Written by Kishan Patel