JavaScript Notes (Complete Guide)
1. Introduction
JavaScript is a client-side scripting language mainly used for web development. Runs in browsers
and also on servers (Node.js). Used to make websites dynamic & interactive.
<!DOCTYPE html>
<html>
<body>
<h2>Hello JavaScript</h2>
<script>
console.log("Hello World");
document.write("Hello from JS!");
</script>
</body>
</html>
Output: Output: Console → Hello World Page → Hello from JS!
2. Variables & Data Types
- var (function scoped) - let (block scoped) - const (constant) Primitive: String, Number, Boolean,
Undefined, Null, Symbol, BigInt Non-Primitive: Object, Array, Function
let a = 10; let b = "Hello"; let c = true; let d; let e = null;
Output: typeof a → number, typeof b → string
3. Operators
Arithmetic, Comparison, Logical
let x=5, y=2; console.log(x+y); console.log(5==="5"); console.log(true||false);
Output: 7, false, true
4. Conditional Statements
if-else, else if
let num=10; if(num>0) console.log("Positive");
Output: Positive
5. Loops
for, while, for-of
for(let i=1;i<=3;i++){console.log(i);}
Output: 1 2 3
6. Functions
Normal and Arrow functions
function add(a,b){return a+b;} const square=n=>n*n;
Output: add(5,3)→8, square(4)→16
7. Arrays
push, pop, shift, unshift, forEach
let fruits=["Apple","Banana"]; fruits.push("Mango");
Output: Apple,Banana,Mango
8. Strings
length, toUpperCase, slice, includes
let s="JavaScript"; s.toUpperCase();
Output: JAVASCRIPT
9. Objects
Objects with key-value & methods
let person={name:"Sarfaraz", greet(){return "Hi "+this.name}};
Output: Hi Sarfaraz
10. DOM Manipulation
Change HTML dynamically
document.getElementById("title").innerHTML="New Text";
Output: Changes element text
11. Events
onclick, onmouseover, etc.
<button onclick="alert('Hi')">Click</button>
Output: Shows alert
12. ES6 Features
Template literals, Destructuring, Spread
let [a,b]=[1,2]; let arr=[...nums,4];
Output: [1,2,3,4]
13. Asynchronous JS
setTimeout, Promise, async/await
async function test(){await new Promise(r=>setTimeout(r,1000));}
Output: Runs after 1s
14. Classes
OOP in JS using class
class Animal{constructor(n){this.name=n;} speak(){console.log(this.name);}}
Output: Dog
15. JSON & Storage
JSON.stringify, localStorage
localStorage.setItem("user","Sarfaraz");
Output: user=Sarfaraz
