These notes follow the running project used across the unit — a "Smart To-Do & Quiz Dashboard" that grows one feature richer each day. Today covers the absolute basics: what JavaScript is, how to include it in a page, variables, data types, and template literals.

🔵 1.1

What is JavaScript?

JavaScript (JS) is a lightweight, interpreted scripting language that runs primarily in the browser, making static HTML pages interactive. Unlike Java, JS is dynamically typed and single-threaded, with an event-driven, non-blocking execution model.

🟣 1.2

Including JavaScript in a Page

<!-- 1. Inline -->
<button onclick="alert('Hi')">Click</button>

<!-- 2. Internal -->
<script>
  console.log('Hello from internal script');
</script>

<!-- 3. External (preferred) -->
<script src="app.js"></script>
💡 Place <script> tags just before the closing </body> tag (or use the defer attribute) so the DOM is fully parsed before your script tries to access it.
🟢 1.3

Variables: var, let, const

KeywordScopeRe-declare?Re-assign?Hoisting
varFunction-scopedYesYesHoisted, initialized as undefined
letBlock-scopedNoYesHoisted, but in "temporal dead zone"
constBlock-scopedNoNo (value fixed)Same as let
💡 Default to const; use let only when a variable must change; avoid var in new code.
🟠 1.4

Data Types

Primitive: String, Number, Boolean, undefined, null, Symbol, BigInt
Reference: Object (includes Arrays, Functions, Dates, etc.)

let name = "Asha";        // String
let age = 21;             // Number
let isStudent = true;     // Boolean
let marks;                // undefined (declared, not assigned)
let empty = null;         // null (intentionally empty)
console.log(typeof age);
›number
🩷 1.5

Type Coercion — Why JS Feels Weird

JS automatically converts types in many operations, which can surprise beginners:

console.log(2 + "2");     // number coerced to string
console.log("5" - 1);     // string coerced to number
console.log(1 == "1");    // loose equality coerces types
console.log(1 === "1");   // strict equality checks type too
›"22" 4 true false
⚠️ Always prefer === and !== over == and != to avoid coercion bugs.
🔷 1.6

Template Literals

let user = "Rahul";
let score = 92;
console.log(`Hello ${user}, your score is ${score}%.`);
// Backticks allow embedded expressions and multi-line strings
›Hello Rahul, your score is 92%.
🚀 Project Tie-in

Today's Build

Create project.js and declare an array of hardcoded task strings, e.g. let tasks = ["Buy milk", "Finish assignment", "Read chapter 5"]; — this seeds the dashboard we'll build all unit.