Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/nil369/akash_js_notes
This My JS Coding Notes. I have made this to help others to grasp the basic & advance concept of JS as well as as revise VERY EASILY & systematically.I have included 2 projects to make users understand the application of JS
https://github.com/nil369/akash_js_notes
advance-js akash-halder akash-js-notes basic-js js js-projects
Last synced: 25 days ago
JSON representation
This My JS Coding Notes. I have made this to help others to grasp the basic & advance concept of JS as well as as revise VERY EASILY & systematically.I have included 2 projects to make users understand the application of JS
- Host: GitHub
- URL: https://github.com/nil369/akash_js_notes
- Owner: Nil369
- License: cc0-1.0
- Created: 2024-01-14T17:38:30.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2024-01-20T10:42:29.000Z (11 months ago)
- Last Synced: 2024-11-14T11:51:36.457Z (about 1 month ago)
- Topics: advance-js, akash-halder, akash-js-notes, basic-js, js, js-projects
- Language: JavaScript
- Homepage: https://github.com/Nil369/
- Size: 65.4 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# This is my JS notes
## Author : AKASH HALDER
As we all know that JavaScript is a versatile programming language commonly used to enhance interactivity in web browsers. It enables developers to create dynamic and engaging user interfaces.
1.Frontend:
In frontend development, JavaScript is primarily used to make web pages dynamic. It allows for real-time updates, interactive forms, and responsive user experiences. Frameworks like React, Angular, and Vue use JavaScript to build powerful frontend applications.
2.Backend:
On the backend, JavaScript (with Node.js) is employed to handle server-side logic. It facilitates the creation of scalable and efficient server applications. With Node.js, JavaScript can manage server tasks, handle requests, and interact with databases, providing a full-stack development capability.
In This you will Find all the required essential knowledge for making Good Website => 1. FrontEnd 2.BackEnd(Kick start = async JS) | Here,I have focused more on frontend than backend.
Here I have Included some Projects So that others can actually understand the application of Javscript in FrontEnd
1. Learn the essential basics of Javascript
2. Master some Advance Javscript Topics
3. Apply your knowledge into some useful frontend Projects
# JavaScript Topics Overview
Welcome to this comprehensive guide on essential JavaScript topics. Below, you'll find a brief explanation of each topic along with a code example to help you grasp the concepts quickly.
## Table of Contents
1. [Variables and Data Types](#1-variables-and-data-types)
2. [Control Flow](#2-control-flow)
3. [Functions](#3-functions)
4. [Arrays](#4-arrays)
5. [Objects](#5-objects)
6. [Loops](#6-loops)
7. [Conditions](#7-conditions)
8. [Promises](#8-promises)
9. [Async/Await](#9-asyncawait)
10. [Event Handling](#10-event-handling)
11. [DOM Manipulation](#11-dom-manipulation)
### 1. Variables and Data Types
JavaScript is dynamically typed, and variables can be declared using `var`, `let`, or `const`. Data types include numbers, strings, booleans, objects, arrays, and null.
```javascript
let name = "John";
let age = 25;
let isStudent = true;
const PI = 3.14;
```
### 2. Control Flow
Control flow statements include `if`, `else if`, `else`, `switch`, and the ternary operator (`? :`), enabling you to make decisions in your code.
```javascript
let grade = 75;
if (grade >= 90) {
console.log("A");
} else if (grade >= 80) {
console.log("B");
} else {
console.log("C");
}
```
### 3. Functions
Functions in JavaScript can be defined using the `function` keyword. Arrow functions provide a concise syntax.
```javascript
function greet(name) {
return `Hello, ${name}!`;
}
const add = (a, b) => a + b;
```
### 4. Arrays
Arrays store multiple values. You can access, modify, and manipulate arrays using various methods.
```javascript
let colors = ["red", "green", "blue"];
colors.push("yellow");
console.log(colors[2]); // Output: blue
```
### 5. Objects
Objects represent key-value pairs and are widely used in JavaScript.
```javascript
let person = {
name: "Alice",
age: 30,
isStudent: false,
};
console.log(person.name); // Output: Alice
```
### 6. Loops
JavaScript supports `for`, `while`, and `do-while` loops for iterative tasks.
```javascript
for (let i = 0; i < 5; i++) {
console.log(i);
}
```
### 7. Conditions
Ternary operators and logical operators (`&&`, `||`, `!`) help in handling conditions effectively.
```javascript
let isLoggedIn = true;
let message = isLoggedIn ? "Welcome back!" : "Please log in.";
```
### 8. Promises
Promises are used for asynchronous programming, representing the eventual completion or failure of an asynchronous operation.
```javascript
const fetchData = new Promise((resolve, reject) => {
// Async operation
if (success) {
resolve(data);
} else {
reject(error);
}
});
```
### 9. Async/Await
Async/await simplifies asynchronous code, making it more readable and easier to work with promises.
```javascript
async function fetchData() {
try {
let response = await fetch('https://api.example.com/data');
let data = await response.json();
console.log(data);
} catch (error) {
console.error('Error fetching data:', error);
}
}
```
### 10. Event Handling
JavaScript handles events triggered by user actions. Common events include click, keyup, and submit.
```javascript
document.getElementById("myButton").addEventListener("click", function() {
alert("Button clicked!");
});
```
### 11. DOM Manipulation
The Document Object Model (DOM) allows you to manipulate the structure, style, and content of HTML documents.
```javascript
document.getElementById("myElement").innerHTML = "New content";
```
Feel free to explore each topic in-depth and use the provided examples as a starting point for your JavaScript journey. Happy coding!