Week 3

3.2 JavaScript Basics

JavaScript Basics 

Welcome to the foundations of JavaScript! In this section, we’ll explore variables, data types, operators, and type conversion—the building blocks of JavaScript programming. Let's dive in! 

Variables in JavaScript

Think of variables as containers that store information. They allow us to save and reuse values throughout our code.

Three Ways to Declare Variables

var (avoid using)

let (can be reassigned)

const (cannot be reassigned)

Examples: 

var name = "Alice";  // Old way (avoid using)

let age = 25;        // Modern way (preferred)

const country = "USA"; // Constant value (can't be changed)

age = 26;  // ✅ Allowed

// country = "Canada"; // ❌ Error: Assignment to constant variable

Data Types in JavaScript

Type Example

String "Hello, JavaScript!"

Number 42, 3.14

Boolean true, false

Null null (intentional absence of value)

Undefined let x; (not assigned a value)

Symbol Symbol("id") (unique identifier)

Examples:

let message = "Hello, World!"; // String

let score = 100;               // Number

let isJavaScriptFun = true;    // Boolean

let emptyValue = null;         // Null

let notDefined;                // Undefined

let uniqueId = Symbol("id");   // Symbol

Operators in JavaScript

JavaScript uses different types of operators to perform operations.

Arithmetic Operators

Operator Description Example

+ Addition 5 + 3 → 8

- Subtraction 10 - 4 → 6

* Multiplication 6 * 3 → 18

/ Division 15 / 3 → 5

% Modulus (Remainder) 10 % 3 → 1

** Exponentiation 2 ** 3 → 8

Assignment Operators

Operator Example Equivalent To

= x = 5 x = 5

+= x += 3 x = x + 3

-= x -= 2 x = x - 2

*= x *= 4 x = x * 4

/= x /= 5 x = x / 5

Comparison Operators

Operator Meaning Example Result

== Equal to (loose) 5 == "5" true

=== Equal to (strict) 5 === "5" false

!= Not equal to (loose) 10 != "10" false

!== Not equal to (strict) 10 !== "10" true

> Greater than 8 > 5 true

< Less than 3 < 6 true

>= Greater than or equal 5 >= 5 true

<= Less than or equal 4 <= 7 true

Logical Operators

Operator Meaning Example Result

&& AND true && false false

|| OR true || false     true

! NOT !true false

AND (&&) → Both must be true

OR (||) → At least one must be true

NOT (!) → Reverses the value

Type Conversion in JavaScript

JavaScript is dynamically typed, meaning variables can change types. Sometimes we need to convert data types manually.

Converting to a Number

let str = "42";

let num = Number(str); // Converts string "42" to number 42

console.log(typeof num); // Output: number

Converting to a String

let num = 99;

let str = String(num); // Converts number 99 to string "99"

console.log(typeof str); // Output: string

Converting to a Boolean

console.log(Boolean(0));       // false

console.log(Boolean(1));       // true

console.log(Boolean("Hello")); // true

console.log(Boolean(""));      // false

Mini Project: Simple Calculator

Let's use what we learned to build a simple calculator using JavaScript!

Steps: 

1) Ask the user for two numbers (remember prompt).

2) Store the numbers in variables.

3) Perform basic operations (add, subtract, multiply, divide).

4) Show the results in the console.