1 JavaScript Code Notes
JavaScript Code Notes: [1, 2]
Basics: [1, 2]
• Variables: Declared using let or const, followed by variable name and assignment with = operator. [1, 2]
• Example: let age = 25; [1, 2]
• Data Types: [1, 2]
• Primitive: String, Number, Boolean, Null, Undefined, Symbol, BigInt [1, 2]
• Object: Complex data structure with key-value pairs [1, 2]
• Comments: [3]
• Single line: // This is a comment [3]
• Multi-line: /* This is a multi-line comment */ [3]
2
Operators: [1, 2]
• Arithmetic: +, -, *, /, %
• Comparison: ==, !=, ===, !==, <, >, <=, >=
• Logical: && (AND), || (OR), ! (NOT)
• Assignment: =, +=, -=, *= [1, 2]
Control Flow:
if-else statement.
if (condition) {
// code to execute if condition is true
} else {
3
// code to execute if condition is false
switch-case statement.
switch (expression) {
case value1:
// code for value1
break;
case value2:
// code for value2
4
break;
default:
// code if no match
• Loops:
• for loop:
for (let i = 0; i < array.length; i++) {
5
// code to execute
while loop.
while (condition) {
// code to execute
do-while loop.
do {
6
// code to execute
} while (condition);
Functions:
Function declaration.
function addNumbers(num1, num2) {
return num1 + num2;
Function invocation.
let result = addNumbers(5, 3); // result will be 8
7
Arrays:
Creating an array.
let numbers = [1, 2, 3, 4, 5];
Accessing elements.
let firstNumber = numbers[0]; // first element
• Array methods: push, pop, shift, unshift, splice, slice, forEach, map, filter, reduce [1, 2]
Objects:
Creating an object.
let person = { name: "John", age: 30 };
8
Accessing properties.
let personName = person.name;
• Object methods: hasOwnProperty, keys, values, assign [1, 2]
DOM Manipulation (Basic):
• Selecting elements:
• document.getElementById('elementId')
• document.querySelector('.className')
• document.querySelectorAll('tagName')
• Modifying elements:
9
• element.textContent = 'New Text'
• element.style.color = 'red'
Important Concepts: [4, 5, 6]
• Event handling: Adding event listeners to elements (addEventListener)
• Closures: Functions that can access variables from their outer scope
• Promises: Asynchronous operation handling
• Async/Await: Cleaner syntax for asynchronous operations [1, 2, 4, 5, 6]
• Async:
An async function declaration creates an AsyncFunction object.
Each time when an async function is called, it returns a new Promise which will be
resolved with the value returned by the async function,
or rejected with an exception uncaught within the async function.
10
• Await:
Async functions can contain zero or more await expressions.
Await expressions make promise-returning functions behave as though they're
synchronous by suspending execution until the returned promise is fulfilled or rejected.
The resolved value of the promise is treated as the return value of the await expression.
Use of async and await enables the use of ordinary try / catch blocks around asynchronous code.
Important Concepts: [4, 5, 6]
• Event handling: Adding event listeners to elements (addEventListener)
• Closures: Functions that can access variables from their outer scope
• Promises: Asynchronous operation handling
• Async/Await: Cleaner syntax for asynchronous operations [1, 2, 4, 5, 6]