Java script
JavaScript
Here's a quick overview of essential JavaScript notes to get you started:
1. Basics
JavaScript: A versatile, lightweight, interpreted programming language used mainly for adding interactivity to web pages.
Client-side vs Server-side: JavaScript is commonly used on the client side but can be run server-side using Node.js.
2. Data Types
Primitive Types: `string`, `number`, `boolean`, `null`, `undefined`, `bigint`, `symbol`.
Non-Primitive Types: `object` (includes arrays, functions, etc.).
3. Variables
Declaration Keywords:
- `var`: Function-scoped (old way, can have unexpected behavior).
- `let`: Block-scoped, suitable for reassignable variables.
- `const`: Block-scoped, used for constants and cannot be reassigned.
let name = 'John';
const PI = 3.14;
var age = 30;
4. Functions
Function Declaration:
function greet() {
console.log("Hello!");
}
Function Expression:
const greet = function() {
console.log("Hello!");
};
Arrow Functions:
const greet = () => {
console.log("Hello!");
};
5. Operators
- Arithmetic Operators: +, -, *, /, %, ** (exponentiation).
- Comparison Operators: ==, !=, ===, !==, >, <, >=, <=.
- Logical Operators: && (AND), || (OR), ! (NOT).
- Assignment Operators: =, +=, -=, *=, /=.
- Ternary Operator: A shorthand for if-else.
6. Control Structures
Conditional Statements:
if (condition) {
// code to execute
} else if (anotherCondition) {
// other code to execute
} else {
// fallback code
}
Loops:
`for` loop:
for (let i = 0; i < 5; i++) {
console.log(i);
}
`while` loop:
let i = 0;
while (i < 5) {
console.log(i);
i++;
}
`do...while` loop:
let i = 0;
do {
console.log(i);
i++;
} while (i < 5);
7. Objects
Definition:
const person = {
firstName: "John",
lastName: "Doe",
age: 25,
greet: function() {
console.log("Hello, " + this.firstName);
}
};
Accessing properties:
console.log(person.firstName); // Dot notation
console.log(person['lastName']); // Bracket notation
8. Arrays
Definition:
const fruits = ["apple", "banana", "cherry"];
Common Methods:
`.push()`: Adds an element to the end.
`.pop()`: Removes the last element.
`.shift()`: Removes the first element.
- `.unshift()`: Adds an element to the start.
‘.forEach()`, `.map()`, `.filter()`, `.reduce()` for iteration and transformations.
9. ES6 Features
Template Literals:
const name = "John";
console.log(`Hello, ${name}!`);
Destructuring:
const person = { firstName: "John", age: 30 };
const { firstName, age } = person;
Spread Operator:
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];
Default Parameters:
function greet(name = "Guest") {
console.log(`Hello, ${name}`);
}
10. Promises and Async/Await
Promises:
const myPromise = new Promise((resolve, reject) => {
// Some asynchronous operation
if (success) {
resolve("Success!");
} else {
reject("Failure!");
}
});
myPromise.then(result => console.log(result)).catch(error => console.log(error));
Async/Await:
async function fetchData() {
try {
const result = await someAsyncOperation();
console.log(result);
} catch (error) {
console.error(error);
}
}
11. DOM Manipulation
Selecting Elements:
document.getElementById("id");
document.querySelector(".class");
document.querySelectorAll("div");
Modifying Content:
document.getElementById("id").textContent = "Hello World!";
document.querySelector(".class").innerHTML = "<b>Hello!</b>";
Event Listeners:
document.getElementById("button").addEventListener("click", function() {
alert("Button clicked!");
});
These notes should help you get started or brush up on JavaScript basics!
Comments
Post a Comment