Learn Programming - By Anvi 🤵🏼♀️💻
June 16, 2025 at 05:54 AM
*10 Essential Javascript Concepts*:
*1️⃣ Variables (`let`, `const`, `var`)*
- *`let`*: Block-scoped, used for values that can change.
- *`const`*: Block-scoped, used for values that shouldn’t change.
- *`var`*: Function-scoped (older, avoid in modern JS).
```js
let name = "John";
const age = 25;
var city = "Delhi";
```
*Real-life analogy*: A `const` is like your birthdate — it never changes. A `let` is your location — it may change.
*2️⃣ Data Types*
- *Number*: 10, 3.14
- *String*: "Hello"
- *Boolean*: true, false
- *Null*: intentionally empty
- *Undefined*: declared but no value yet
- *Object*: `{ key: value }`
- *Array*: `[item1, item2]`
```js
let items = ["pen", "book"];
let user = null;
```
*3️⃣ Functions*
Functions group code that you can reuse. They accept inputs (parameters) and return outputs.
```js
function greet(name) {
return `Hello ${name}`;
}
greet("Amit"); // "Hello Amit"
```
*4️⃣ Conditionals*
Used to make decisions based on logic.
```js
let marks = 80;
if (marks >= 50) {
console.log("Pass");
} else {
console.log("Fail");
}
```
Also includes `switch` for multiple conditions.
*5️⃣ Loops*
Used for repeating tasks (e.g., processing every item in a list).
“`js
for (let i = 0; i < 3; i++)
console.log(i); // 0,1,2
“`
*6️⃣ Arrays Methods*
Arrays hold multiple values. Common methods:
- `push()`, `pop()`: Add/remove
- `length`: Size
- `forEach()`, `map()`, `filter()`: Iterate/transform
```js
let fruits = ["apple", "banana"];
fruits.push("mango");
```
*7️⃣ Objects*
Objects group data in key-value form.
```js
let car =
brand: "Toyota",
year: 2020
;
console.log(car.brand); // Toyota
```
*8️⃣ Events*
Used to interact with users (click, input, etc.).
```js
document.getElementById("btn").addEventListener("click", () =>
alert("Button clicked!");
);
```
*9️⃣ DOM Manipulation*
DOM = HTML elements. JS can read or update them.
```js
document.getElementById("title").innerText = "Updated Text";
```
*🔟 ES6 Features*
Modern additions to JS:
- *Arrow functions*: Cleaner syntax
- *Destructuring*: Extract values easily
- *Template literals*: `{}` inside strings
- *Spread/Rest*: Copy or merge arrays/objects
```js
const add = (a, b) => a + b;
const { brand } = car;
```
*React ❤️ if this helped you!*