Javascript Cheatsheet

Master JavaScript with this comprehensive cheat sheet.

JavaScript is a powerful programming language commonly used for web development. Whether you're a beginner or an experienced developer, having a cheat sheet can be incredibly useful for quickly referencing syntax and concepts. In this article, we'll provide you with a handy JavaScript cheat sheet that covers some of the most commonly used elements of the language.

Variables and Data Types

Variables are used to store and manipulate data in JavaScript. Here's how you can declare and assign values to variables:

// Variable declaration
let myVariable;

// Assigning a value
myVariable = 10;

// Variable declaration and assignment
let myNumber = 20;
const myConstant = "Hello, World!";

//Data Types
let myNumber = 10;
let myString = "Hello, World!"; 
let myBoolean = true;
let myArray = [1, 2, 3];
let myObject = { name: "John", age: 25 };

Operators

JavaScript provides a variety of operators for performing arithmetic, comparison, and logical operations. Here are some examples

// Arithmetic operators
let sum = 5 + 10;
let difference = 20 - 8;
let product = 3 * 4;
let quotient = 15 / 3;
let remainder = 17 % 5;

// Comparison operators
let isEqual = 5 === 5;
let isNotEqual = 10 !== 5;
let greaterThan = 15 > 10;
let lessThan = 8 < 12;

// Logical operators
let logicalAnd = true && false;
let logicalOr = true || false;
let logicalNot = !true;

Control Flow

Control flow structures allow you to control the flow of execution in your JavaScript code. Here are some commonly used control flow statements:

// Conditional statements
if (condition) {
    // code to execute if condition is true
} else if (anotherCondition) {
    // code to execute if anotherCondition is true
} else {
    // code to execute if all conditions are false
}

// Looping statements
for (let i = 0; i < 5; i++) {
    // code to execute on each iteration
}

while (condition) {
    // code to execute while condition is true
}

// Function definition and invocation
function myFunction(parameter1, parameter2) {
    // code to execute
    return result;
}

myFunction(argument1, argument2);

Arrays and Objects

Arrays and objects are powerful data structures in JavaScript. Here's how you can work with them:

// Arrays
let myArray = [1, 2, 3];
let arrayLength = myArray.length;
let firstElement = myArray[0];
myArray.push(4);
myArray.pop();

// Objects
let myObject = { name: "John", age: 25 };
let objectKeys = Object.keys(myObject);
let objectValues = Object.values(myObject);
myObject.name = "Jane";
delete myObject.age;

Error Handling

JavaScript provides mechanisms for handling errors and exceptions. Here's an example of how you can use the try...catch statement:

try {
    // code that may throw an error
} catch (error) {
    // code to handle the error
}

Functions and it's Scope

// Function declaration
function greet(name) {
  console.log("Hello, " + name + "!");
}

// Function invocation
greet("John");

// Arrow function
const add = (a, b) => a + b;

// Global scope
let globalVariable = "I'm global";

function myFunction() {
  // Local scope
  let localVariable = "I'm local";
  console.log(globalVariable);
  console.log(localVariable);
}

Asynchronous Programming

// setTimeout example
setTimeout(() => {
  console.log("Delayed message");
}, 2000);

// Promises
const fetchData = () => {
  return new Promise((resolve, reject) => {
    // Fetch data from an API
    // If successful, call resolve(data)
    // If there's an error, call reject(error)
  });
};

fetchData()
  .then((data) => {
    console.log(data);
  })
  .catch((error) => {
    console.log(error);
  });

Classes and Objects

// Class definition
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

// Object instantiation
const john = new Person("John", 25);
john.greet();

Async Await

//Declaration
async function functionName() {
  // async function body
}

//Await a Promise
async function functionName() {
  const result = await promise;
  // code after await
}

//Parallel Execution with Promise.all
async function functionName() {
  const [result1, result2] = await Promise.all([promise1, promise2]);
  // code after both promises resolve
}

The await keyword pauses the execution of the function until the promise is resolved, and then returns the resolved value.