JavaScript Summary Notes
1. JavaScript Basics
● JavaScript is a client-side scripting language that adds interactivity to web pages.
● It is loosely typed (variables don’t require explicit data types).
● Can be embedded in HTML using:
○ Internal (<script>...</script>)
○ External (<script src="file.js"></script>)
○ Inline (onclick="function()") (not recommended)
JavaScript Output Methods
Method Description
document.write() Writes directly to page (not permanent)
console.log() Logs output to browser console
(debugging)
alert() Displays popup message
document.getElementById(id).in Inserts output into HTML element
nerHTML
JavaScript Coding Conventions
● camelCase for variable names (let firstName)
● Use spaces around operators (x + y)
● Semicolons (;) at the end of statements (good practice)
● Comments: // Single-line and /* Multi-line */
2. JavaScript Variables & Data Types
● Declared using var (global), let (block scope), const (immutable)
● Variable Naming Rules:
○ Can contain letters, numbers, $, _, but cannot start with a number
○ Case-sensitive (myVar ≠ Myvar)
Data Types
Type Description Example
String Text in quotes "Hello"
Number Integers & floats 42, 3.14
Boolean true or false values let isActive =
true;
Undefined No assigned value let x;
Null Intentional empty value let y = null;
String Operations
Method Description Example Output
.length Returns string length "Hello".length → 5
.toUpperCase() Converts to uppercase "hello".toUpperCase() →
"HELLO"
.slice(start, Extracts part of a string "JavaScript".slice(0,4) →
end) "Java"
Number Operations
Operator Description Example
+ Addition 5 + 3 →
8
- Subtraction 10 - 4 →
6
* Multiplication 2 * 3 →
6
/ Division 10 / 2 →
5
Special Numbers: NaN (Not a Number), Infinity, -Infinity
3. JavaScript Operators
Arithmetic Operators
● + (Addition), - (Subtraction), * (Multiplication), / (Division), % (Modulus), ++ (Increment),
-- (Decrement)
Comparison Operators
Operator Meaning Example Output (a = 10, b =
5)
== Equal to a == 10 → true
!= Not equal a != b → true
=== Strictly equal 10 === "10" → false
!== Strictly not equal 10 !== "10" → true
> Greater than a > b → true
< Less than b < a → true
Logical Operators
Operator Description Example Output
&& (AND) Both conditions must be true true && false →
false
` ` (OR)
! (NOT) Reverses condition !(5 == 5) → false
Assignment Operators
Operator Meaning Example
= Assign value x = 5
+= Add & assign x += 3 (same as x = x
+ 3)
-= Subtract & assign x -= 2
*= Multiply & assign x *= 4
/= Divide & assign x /= 2
4. JavaScript Functions
● Functions allow reusable code blocks.
● A function must be declared before being called.
Function Syntax
function greet(name) {
return "Hello, " + name + "!";
}
console.log(greet("Pisay")); // Output: "Hello, Pisay!"
Returning Function Outputs
Method Description Example
return Sends output to a let sum = add(5,
variable 3);
5. JavaScript Events & Event Handlers
Events trigger JavaScript functions.
Event Description Example
oncli Fires when an element is <button
ck clicked onclick="myFunction()">Click</button
>
onloa Executes when the page loads <body onload="init()">
d
Example: Changing Text on Click
<p id="text" onclick="changeText()">Click Me</p>
<script>
function changeText() {
document.getElementById("text").innerHTML = "Clicked!";
}
</script>
6. JavaScript Control Statements
Control statements direct the flow of execution.
Conditional Statements (if-else)
let x = 10;
if (x > 5) {
console.log("Greater than 5");
} else {
console.log("5 or less");
}
Switch Statement
let grade = 75;
switch (true) {
case (grade < 60): console.log("F"); break;
case (grade < 70): console.log("D"); break;
case (grade < 80): console.log("C"); break;
default: console.log("B or A");
}
Loops (for loop)
Used for repeating code multiple times.
for (let i = 1; i <= 5; i++) {
console.log("Count: " + i);
}
7. Common JavaScript Objects
Math Object
Method Description Example Output
Math.round( Rounds to nearest integer Math.round(3.14)
x) → 3
Math.pow(x, Exponentiation Math.pow(3, 4) →
y) 81
Math.sqrt(x Square root Math.sqrt(16) →
) 4
Math.random Generates random number 0.435...
() (0-1)
Date Object
● Creates & manipulates dates
let today = new Date(); // Current date & time
console.log(today.toDateString()); // "Wed Mar 5 2025"
