window object. It represents the browser's window and serves as the global object for all JavaScript code running in the current context. All global variables and functions are properties of the window object. Even when you omit window. before properties like alert(), you're still interacting with the window object.true if OK is clicked, false otherwise.null if cancelled.alert, confirm, and prompt remain valuable for quick debugging, simple feedback, or scenarios where blocking the user flow is acceptable, such as confirming a critical action.// Example: Using window.alert()
window.alert("Welcome to our website!");
// Example: Using window.confirm()
let userConfirmed = window.confirm("Do you want to proceed?");
if (userConfirmed) {
console.log("User confirmed.");
} else {
console.log("User cancelled.");
}
// Example: Using window.prompt()
let userName = window.prompt("Please enter your name:", "Guest");
if (userName !== null && userName !== "") {
console.log("Hello, " + userName + "!");
} else {
console.log("No name entered.");
}
navigator object provides information about the web browser, including details about the user agent, browser name, operating system, and online status. This can be useful for tailoring content or functionality based on the client's environment.navigator.userAgent for a detailed string about the browser, and navigator.appName, navigator.appVersion for basic identification.navigator.platform helps determine the operating system (e.g., "Win32", "MacIntel", "Linux"). This can inform feature availability or styling.navigator.onLine property returns a boolean indicating if the browser is online. Useful for building offline-first applications or displaying connectivity warnings.location and history objects allow programmatic interaction with the browser's URL and browsing history. These are critical for single-page applications (SPAs), navigation, and dynamic content loading without full page reloads.location object represents the current URL. You can access various parts of the URL (hostname, pathname, query parameters) and even modify it, triggering navigation or page reloads.window.location.href: Full URLwindow.location.reload(): Reloads the pagewindow.location.assign('new-url'): Navigates to a new URLhistory object manages the browser's session history. It enables dynamic manipulation of the browser's history stack without full page reloads, essential for maintaining state in SPAs.window.history.back(): Navigates backwindow.history.forward(): Navigates forwardwindow.history.pushState(): Adds a new history entry without reloading (require: Arguments) setTimeout and setInterval allow you to schedule code execution asynchronously. This is vital for animations, delayed actions, periodic updates, and preventing UI freezes during long-running operations.setInterval if not cleared.// Example: Delayed message
setTimeout(() => {
console.log("This message appears after 3 seconds.");
}, 3000);
// Example: Repeated counter
let count = 0;
const intervalId = setInterval(() => {
count++;
console.log("Count:", count);
if (count >= 5) {
clearInterval(intervalId); // Stop the interval after 5 counts
console.log("Interval stopped.");
}
}, 1000);
screen object provides information about the user's screen or monitor, such as its width, height, color depth, and pixel depth. This data can be used to optimize layouts, load appropriate image resolutions, or implement responsive design strategies based on the available display area.screen.width: Total width of the screen in pixels, regardless of the browser window size.screen.height: Total height of the screen in pixels.screen.colorDepth: Number of bits used to display one color. Higher values mean more colors.screen.pixelDepth: Similar to color depth, but specifically for device pixels.screen object still offers direct access to raw display metrics which can be useful for specialized applications or analytics.