Unit 3: Introduction to JavaScript

• JavaScript: a scripting language run by the browser to add interactivity — validating forms, responding to events, changing page content (DOM), animations, fetching data.

• Client-side JavaScript runs in the browser and cannot access a server database directly for security.
• Database connectivity: JavaScript sends requests (fetch, AJAX) to a server-side program (PHP, Node.js, Java) which queries the database and returns data (often JSON); server-side JavaScript (Node.js) can connect to databases directly.

html<input id="nm" placeholder="Your name">
<button onclick="greet()">Greet</button>
<p id="out"></p>
<script>
  function greet() {
    const name = document.getElementById("nm").value;   // read input
    document.getElementById("out").textContent = "Hello, " + name;
  }
  // Dialog boxes also capture input:
  // const age = prompt("Enter age"); alert("Age: " + age);
</script>

• Interpreted: no compilation; runs directly in the browser.
• Embedded: written inside HTML or linked files.
• Minimal syntax: easy to learn.
• Quick development: immediate feedback in the browser.
• Procedural capabilities: conditions, loops, functions — plus objects and events.
• Others: reduces server load, rich interfaces, runs on all browsers.

• Inline: in event attributes — button onclick="...".
• Internal: inside a script element in head or body.
• External: in a .js file linked with script src="app.js" — preferred for reuse and caching.

JavaScript runs in the browser. It is added with <script> tags, either inline or from a file: <script src="app.js"></script>.

• Variables: let (can change), const (cannot be reassigned), var (old, function-scoped).
• Data types: number, string, boolean, undefined, null, object (including arrays) and symbol/bigint.
• Type conversion: Number("5") → 5, String(5) → "5", parseInt("12px") → 12.
• Comparisons: == compares value after conversion ("5" == 5 is true); === compares value and type ("5" === 5 is false).

javascriptlet marks = 72;
if (marks >= 75) grade = "A";
else if (marks >= 60) grade = "B";
else grade = "C";

for (let i = 1; i <= 5; i++) console.log(i);
let n = 0;
while (n < 3) n++;

switch works like in C; loops include for, while, do…while, for…of (values of an array) and for…in (keys of an object).

javascriptfunction add(a, b = 0) { return a + b; }    // declaration, default parameter
const square = (x) => x * x;                // arrow function

• Scope: let/const are block-scoped; var is function-scoped; variables outside any function are global.
• Closure: an inner function remembers the variables of the outer function even after the outer function has finished.

javascriptfunction counter() {
  let count = 0;
  return () => ++count;
}
const next = counter();
next(); next();   // 1, then 2