JavaScript Fundamentals – Detailed Class Notes
Introduction to JavaScript
JavaScript is a powerful, high-level programming language mainly used to create dynamic and
interactive web applications.
It runs directly in the browser and also on servers using environments like [Link].
Beginner Example:
JavaScript can change text on a webpage.
[Link]("Hello JavaScript");
JavaScript is used to build full applications, handle APIs, manage databases, and create real-time
systems.
Using Console and Basic Debugging
The console is a developer tool used to display messages and debug code.
Common Methods:
[Link](): displays normal messages
[Link](): shows errors
[Link](): shows warnings
][Link]("Welcome to JavaScript");
Use breakpoints, stack traces, and browser DevTools to track and fix bugs efficiently.
Understanding Variables
Variables store data values for later use.
Declaration Keywords:
var (old, function-scoped)
let (block-scoped, recommended)
const (constant values)
let age = 20;
Understanding scope (global, local, block) and immutability using const.
Data Types
Data types define the type of value stored in a variable.
JavaScript is dynamically typed, meaning the type is determined at runtime.
Example:
let name = "Abenezer"; // string
let score = 95; // number
Primitive Data Types
Primitive data types store single, immutable values.
Types:
Number
String
Boolean
Undefined
Null
BigInt
Symbol
Example:
let isLoggedIn = true;
let price = 150.50;
Working with Non-Primitive Data Types
Non-primitive (reference) data types can store collections of values.
Types:
Object
Array
Function
Beginner Example:
let students = ["Abel", "Sara", "John"];
Advanced Example:
let user = { name: "Abebe", role: "Developer" };
Getting Started with Data Structures in JavaScript
Data structures help organize and manage data efficiently.
Common Data Structures:
Arrays (ordered lists)
Objects (key-value pairs)
Map and Set (advanced usage)
Example:
let scores = [90, 85, 88];
Arithmetic Operations
Arithmetic operators perform mathematical calculations.
Operators:
+ - * / % **
Beginner Example:
let total = 10 + 5;
Advanced Example:
let power = 2 ** 3; // 8
Operators, Operands, and Expressions
[Link]
An operator is a special symbol that tells JavaScript what action to perform on one or more values.
Common Types of Operators:
Arithmetic Operators: + - * / % **
Assignment Operators: = += -= *=
Comparison Operators: == === > <
Logical Operators: && || !
Example:
5*4
Here, * is the operator because it performs multiplication.
2. Operand
An operand is the value or variable that an operator works on.
Types of Operands:
Single operand (Unary operator):
let x = -5;
“ - “ is the operator, 5 is the operand.
Two operands (Binary operator):
5*4
5 and 4 are operands.
Example with Variables:
let a = 10;
let b = 2;
let result = a / b;
/ → operator
a and b → operands
Expression
An expression is a valid piece of code that produces a value after evaluation.
If JavaScript can calculate it and return a result, it is an expression.
Simple Expression:
5*4
Result: 20
Expression with Variables:
let total = price + tax;
Complex Expression:
let finalScore = (math + english) / 2;
Breaking Down the Example
let result = 5 * 4;
Component Explanation = Assignment operator * Arithmetic operator 5, 4 Operands 5 * 4
Expression result Variable storing the expression result
JavaScript first evaluates 5 * 4 → 20
Then assigns the value to result
Beginner → Advanced Insight
Beginner Level:
Expressions perform simple calculations:
let sum = 10 + 5;
Intermediate Level:
Expressions use variables and logic:
let isPassed = score >= 50;
Advanced Level:
Expressions can be nested and combined:
let status = (age >= 18 && hasID) ? "Allowed" : "Denied";
JavaScript Comparison Operators
Comparison operators compare values and return boolean results.
Operators:
== === != !== > < >= <=
Beginner Example:
5 == "5" // true
Advanced Example:
5 === "5" // false (strict comparison)
Logical Operators with Practice Examples
Logical operators combine multiple conditions.
Operators:
&& (AND)
|| (OR)
! (NOT)
Beginner Example:
let isAdult = age >= 18 && hasID;
Advanced Example:
if ((role === "admin" || role === "manager") && isActive) {
accessGranted();
