What is JavaScript ?

JavaScript

JavaScript ek programming language hai jo web development ke liye use hoti hai. Ye dynamic aur interactive content banane ke liye use hoti hai. Matlab, agar aapko web page me buttons click hone par kuch change karna hai, form validate karna hai, animation dikhana hai, ya interactive features add karne hai, to JavaScript ka use hota hai.

Key points about JavaScript:

Client-side language – Usually browser me run hoti hai.
Dynamic behavior – Web pages ko interactive banati hai (jaise dropdown menus, sliders).
Cross-platform – Har modern browser me kaam karti hai.
Can manipulate HTML/CSS – DOM (Document Object Model) ke through web page ko change kar sakti hai.
Also used on server-side – Node.js ke through server-side programming bhi possible hai.

Example:


// Ye ek simple alert show karega
alert("Hello, world!");

Agar chaho, mai ek aur simple example dikhau jo web page me text change kar de button click par. Ye dekhna easy hoga.

Kya mai wo example bata du?

Theek hai! Chalo JavaScript ko aur detail me samjhte hain aur thoda practical example bhi dekhte hain.

1️⃣ JavaScript ka use:

Web page ko interactive banana: Buttons, forms, images, aur animations ke liye.
Data validate karna: Form me galat input ko rokna.
Content update dynamically: Page reload kiye bina content change karna.
Games aur apps: Browser-based simple games aur apps banane ke liye.
Server-side programming: Node.js ke through backend ka code bhi likh sakte hain.

2️⃣ JavaScript ke basic features:

Variables: Data store karte hain.
```
let name = "Prabhup";
const age = 25;
```

Functions: Reusable code blocks.


function greet() {
    alert("Hello, Prabhup!");
}
greet();

Events: User ke action pe response.


<button onclick="greet()">Click Me</button>

DOM Manipulation: HTML content change karna.


document.getElementById("demo").innerHTML = "Hello World!";

3️⃣ Simple Example:

HTML + JavaScript example:


<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Example</title>
</head>
<body>
  <h1 id="demo">Hello!</h1>
  <button onclick="changeText()">Click Me</button>

  <script>
    function changeText() {
      document.getElementById("demo").innerHTML = "Text Changed!";
    }
  </script>
</body>
</html>

Explanation:

Page me ek heading aur button hai.
Button click karne par changeText() function run hota hai.
Function heading ka text "Text Changed!" me badal deta hai.

Agar chaho, mai tumhe JavaScript ke types aur real-world use cases bhi simple examples ke saath dikha sakta hu, jaise loops, conditions, aur arrays ke examples.

Kya mai wo bata du?

1️⃣ JavaScript ke Types of Data

JavaScript me different data types hote hain:

Number – Numbers ke liye
```
let age = 25;
let price = 199.99;
```
String – Text ke liye
```
let name = "Prabhup";
```
Boolean – True ya false
```
let isLoggedIn = true;
```

Array – Multiple values store karna


let fruits = ["Apple", "Banana", "Mango"];

Object – Key-value pairs


let person = {name: "Prabhup", age: 25};

2️⃣ Loops (Repeat kaam karne ke liye)


for (let i = 1; i <= 5; i++) {
    console.log("Number " + i);
}

Explanation: Ye 1 se 5 tak numbers console me print karega.

3️⃣ Conditional Statements (Decision making)


let age = 18;
if(age >= 18){
    console.log("You can vote!");
} else {
    console.log("You are too young to vote.");
}

4️⃣ Functions (Reusable Code)


function greet(name) {
    console.log("Hello, " + name + "!");
}
greet("Prabhup");

5️⃣ Real-world Use Case Example

Example: Button click karne par color change


<!DOCTYPE html>
<html>
<body>
  <h2 id="heading">Hello!</h2>
  <button onclick="changeColor()">Change Color</button>

  <script>
    function changeColor() {
      document.getElementById("heading").style.color = "red";
    }
  </script>
</body>
</html>

Explanation:

Button click karne par heading ka color red ho jayega.
Ye DOM manipulation ka example hai.

Agar chaho, mai tumhe JavaScript ke advanced concepts bhi simple examples ke saath dikha sakta hu, jaise events, arrays methods, loops, aur DOM manipulation tricks jo daily web development me use hote hain.

Kya mai wo bata du?

1️⃣ Events (User actions ke liye)

JavaScript me events ka use user ke action ko handle karne ke liye hota hai, jaise click, hover, key press, etc.


<button id="btn">Click Me</button>

<script>
  document.getElementById("btn").addEventListener("click", function(){
    alert("Button clicked!");
  });
</script>

Explanation:

addEventListener button pe click hone par alert show karega.
Ye modern aur best practice hai events handle karne ke liye.

2️⃣ Array Methods (Data ko manage karna)


let fruits = ["Apple", "Banana", "Mango"];

// Add item
fruits.push("Orange");

// Remove last item
fruits.pop();

// Loop through array
fruits.forEach(function(item){
  console.log(item);
});

Real-life use: List of products, users, or items ko manage karne ke liye.

3️⃣ DOM Manipulation (Web page change karna)


<p id="demo">Original Text</p>
<button onclick="changeText()">Change Text</button>

<script>
function changeText() {
  document.getElementById("demo").innerHTML = "Text has been changed!";
  document.getElementById("demo").style.color = "blue";
}
</script>

innerHTML – Text ya content change karne ke liye.
style – CSS properties change karne ke liye.

4️⃣ JavaScript Object (Data ko structure me store karna)


let person = {
    name: "Prabhup",
    age: 25,
    greet: function(){
        console.log("Hello " + this.name);
    }
};

console.log(person.name); // Prabhup
person.greet();           // Hello Prabhup

Use-case: Users ke info ko store aur manage karna.

5️⃣ Conditional Logic with Events


<input type="number" id="age" placeholder="Enter your age">
<button onclick="checkAge()">Check</button>

<script>
function checkAge() {
    let age = document.getElementById("age").value;
    if(age >= 18) {
        alert("You can vote!");
    } else {
        alert("Too young to vote.");
    }
}
</script>

Ye ek interactive form validation ka simple example hai.

Search This Blog

Suchi digital marketing