JavaScript Elements Explorer

console.log()

Definition: Logs to console

Purpose: Debugging output

console.log("Hello, World!");

alert()

Definition: Displays alert

Purpose: User notification

alert("Warning!");

prompt()

Definition: Input dialog

Purpose: User input

let name = prompt("Enter name:");

confirm()

Definition: Confirmation dialog

Purpose: Yes/No input

let ok = confirm("Proceed?");

addEventListener()

Definition: Event handler

Purpose: Listen for events

                        button.addEventListener("click", () => {

                          alert("Clicked");

                        });

querySelector()

Definition: Selects element

Purpose: DOM access

let el = document.querySelector(".class");

querySelectorAll()

Definition: Selects multiple

Purpose: DOM collection

let els = document.querySelectorAll("p");

getElementById()

Definition: Selects by ID

Purpose: DOM access

let el = document.getElementById("id");

innerHTML

Definition: Element content

Purpose: Modify HTML

el.innerHTML = "

New content

";

textContent

Definition: Text content

Purpose: Modify text

el.textContent = "New text";

style

Definition: CSS property

Purpose: Inline styling

el.style.color = "red";

classList

Definition: Class manager

Purpose: Class manipulation

el.classList.add("active");

setTimeout()

Definition: Delay execution

Purpose: Timing control

                        setTimeout(() => {

                          alert("Delayed");

                        }, 1000);

setInterval()

Definition: Repeat execution

Purpose: Periodic tasks

                        setInterval(() => {

                          console.log("Tick");

                        }, 1000);

clearTimeout()

Definition: Cancels timeout

Purpose: Stop delay

                        let id = setTimeout(fn, 1000);

                        clearTimeout(id);

clearInterval()

Definition: Cancels interval

Purpose: Stop repetition

                        let id = setInterval(fn, 1000);

                        clearInterval(id);

Array.push()

Definition: Adds to array

Purpose: Array expansion

                        let arr = [1, 2];

                        arr.push(3);

Array.pop()

Definition: Removes last

Purpose: Array reduction

                        let arr = [1, 2];

                        arr.pop();

Array.forEach()

Definition: Loops array

Purpose: Iteration

                        [1, 2].forEach(item => {

                          console.log(item);

                        });

Array.map()

Definition: Transforms array

Purpose: New array creation

let newArr = [1, 2].map(x => x * 2);

Object.keys()

Definition: Lists keys

Purpose: Object iteration

                        let obj = {a: 1, b: 2};

                        Object.keys(obj); // ['a', 'b']

Object.values()

Definition: Lists values

Purpose: Object extraction

                        let obj = {a: 1, b: 2};

                        Object.values(obj); // [1, 2]

JSON.parse()

Definition: Parses JSON

Purpose: String to object

let obj = JSON.parse('{"a": 1}');

JSON.stringify()

Definition: Converts to JSON

Purpose: Object to string

let str = JSON.stringify({a: 1});

Math.random()

Definition: Random number

Purpose: Random generation

let num = Math.random();

Math.floor()

Definition: Rounds down

Purpose: Integer conversion

let num = Math.floor(3.7); // 3

Date.now()

Definition: Current timestamp

Purpose: Time tracking

let time = Date.now();

new Date()

Definition: Date object

Purpose: Date manipulation

let date = new Date();

fetch()

Definition: HTTP request

Purpose: Data fetching

fetch("url").then(res => res.json());

Promise

Definition: Async handler

Purpose: Async operations

                        new Promise((resolve) => {

                          resolve("Done");

                        });

async/await

Definition: Async syntax

Purpose: Simplify promises

                        async function fn() {

                          let data = await fetch("url");

                        }

try/catch

Definition: Error handling

Purpose: Exception management

                        try {

                          throw "Error";

                        } catch (e) {

                          console.log(e);

                        }

localStorage

Definition: Browser storage

Purpose: Persistent data

localStorage.setItem("key", "value");

sessionStorage

Definition: Session storage

Purpose: Temporary data

sessionStorage.setItem("key", "value");

window.location

Definition: URL info

Purpose: Navigation control

let url = window.location.href;

history

Definition: Browser history

Purpose: Navigation

window.history.back();

screen

Definition: Screen info

Purpose: Display details

let width = window.screen.width;

navigator

Definition: Browser info

Purpose: Client details

let ua = navigator.userAgent;

createElement()

Definition: Creates element

Purpose: DOM creation

let div = document.createElement("div");

appendChild()

Definition: Adds element

Purpose: DOM insertion

parent.appendChild(child);