**Basic Concepts:**
1. **Variables and Data Types:**
```javascript
let name = "John";
const age = 30;
```
2. **Operators:**
```javascript
let sum = 10 + 5;
let isTrue = true && false;
```
3. **Conditional Statements:**
```javascript
if (condition) {
// code to execute if condition is true
} else if (anotherCondition) {
// code to execute if anotherCondition is true
} else {
// code to execute if no conditions are true
}
```
4. **Loops:**
```javascript
for (let i = 0; i < 5; i++) {
// code to repeat
}
while (condition) {
// code to repeat while condition is true
}
```
**Intermediate Concepts:**
1. **Functions:**
```javascript
function greet(name) {
return "Hello, " + name;
}
```
2. **Arrays:**
```javascript
let numbers = [1, 2, 3, 4, 5];
```
3. **Objects:**
```javascript
let person = {
name: "John",
age: 30
};
```
4. **DOM Manipulation:**
```javascript
let element = document.getElementById("myElement");
element.innerHTML = "New content";
```
**Advanced Concepts:**
1. **Closures:**
```javascript
function outer() {
let outerVar = "I am from outer function";
function inner() {
console.log(outerVar);
}
return inner;
}
let closureFunc = outer();
closureFunc(); // Outputs: I am from outer function
```
2. **Asynchronous Programming:**
```javascript
setTimeout(() => {
console.log("Delayed log");
}, 1000);
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
```
3. **Promises:**
```javascript
function fetchData() {
return new Promise((resolve, reject) => {
// Simulate async operation
setTimeout(() => {
if (/* success condition */) {
resolve("Data fetched successfully");
} else {
reject("Error fetching data");
}
}, 1000);
});
}
fetchData()
.then(data => console.log(data))
.catch(error => console.error(error));
```
4. **ES6 Features:**
- Arrow Functions
- Template Literals
- Destructuring Assignment
- Spread and Rest Operators
- Classes and Inheritance
- Modules (import/export)
These are just some of the fundamental concepts in JavaScript. The language has a wide array of functionalities and libraries that you can explore to create powerful and interactive web applications.
0 Comments