Sudhakar V

Posted on May 28

JavaScript Journey -1

Here’s a clear and concise definition of JavaScript:

📘 JavaScript

JavaScript is a high-level, interpreted, object-oriented programming language that is primarily used to create interactive and dynamic web pages. It is one of the core technologies of the World Wide Web, alongside HTML and CSS.

🧠 Key Characteristics:

Client-side (runs in the browser) and server-side (via Node.js)
Dynamically typed (no need to define data types)
Event-driven and asynchronous (e.g., with setTimeout, fetch)
Prototype-based (supports OOP through prototypes and ES6 classes)
Used to control the behavior of web elements like buttons, forms, animations, and real-time updates.

📌 Example:

<button onclick="greet()">Click Me</button>
<script>
  function greet() {
    alert("Hello, Sudhakar!");
  }
</script>

✅ In Short:

JavaScript is the language of the web, enabling developers to make websites dynamic, interactive, and user-friendly.

1. 🧠 Variables

Used to store data.

var – old, function-scoped
let – block-scoped
const – block-scoped, value can't be reassigned

let name = "Sudhakar";
const age = 25;
var isStudent = true;

2. 🔢 Data Types

Primitive: Number, String, Boolean, Null, Undefined, Symbol
Non-Primitive: Object, Array, Function

let num = 10;            // Number
let str = "Hello";       // String
let isOk = true;         // Boolean
let arr = [1, 2, 3];     // Array
let obj = {name: "SK"};  // Object

3. 🧮 Operators

Used to perform operations on variables and values.

let a = 5, b = 3;
console.log(a + b);  // 8 (Arithmetic)
console.log(a > b);  // true (Comparison)
console.log(a == b); // false

4. 🔁 Control Statements

Control the flow of the program.

let age = 20;
if (age >= 18) {
  console.log("Adult");
} else {
  console.log("Minor");
}

for (let i = 1; i <= 3; i++) {
  console.log(i); // 1, 2, 3
}

5. 🔧 Functions

Reusable blocks of code.

function greet(name) {
  return "Hello " + name;
}
console.log(greet("Sudhakar"));

const add = (x, y) => x + y;
console.log(add(5, 3));  // 8

6. 📦 Arrays and Objects

let colors = ["red", "green"];
console.log(colors[0]);  // red

let person = {
  name: "Sudhakar",
  age: 25
};
console.log(person.name);  // Sudhakar

7. 🎯 Events (in browser)

Used to handle user actions.

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

<script>
  function sayHi() {
    alert("Hello, Sudhakar!");
  }
</script>

8. 🕹️ DOM Manipulation

Used to change HTML/CSS with JavaScript.

<p id="demo">Old text</p>
<button onclick="changeText()">Change</button>

<script>
  function changeText() {
    document.getElementById("demo").innerHTML = "New text!";
  }
</script>

9. 📤 JavaScript in Web Development

Runs in the browser
Used for form validation, animations, fetching APIs, etc.

fetch("https://api.example.com/data")
  .then(res => res.json())
  .then(data => console.log(data));

DEV Community