JS Windows

The window object represents the browser window. Learn about alerts, timers, and browser-level features.

On this page

JS Window

The window object represents the browser window. It is the global object in browsers. Many global functions and objects belong to window.

console.log(window);
console.log(window.innerWidth);
console.log(window.innerHeight);

Global variables become properties of window:

var x = 10;
console.log(window.x);

JS Screen

The screen object contains information about the user's display.

console.log(screen.width);
console.log(screen.height);
console.log(screen.availWidth);
console.log(screen.availHeight);
console.log(screen.colorDepth);

JS Location

The location object contains information about the current URL.

console.log(location.href);
console.log(location.hostname);
console.log(location.pathname);
console.log(location.protocol);

Redirect to another page:

location.href = "https://example.com";
// or
location.assign("https://example.com");

JS History

The history object allows navigation in the browser session history.

history.back();
history.forward();
history.go(-1);

Modern apps often use the History API:

history.pushState({ page: 2 }, "", "?page=2");

JS Navigator

The navigator object contains information about the browser.

console.log(navigator.userAgent);
console.log(navigator.language);
console.log(navigator.onLine);

Feature detection is preferred over userAgent sniffing.

JS Popup Alert

Popup methods display simple dialog boxes.

alert("Hello");

const ok = confirm("Are you sure?");

const name = prompt("Enter your name");

Modern UI should avoid blocking popups and use custom modals instead.

JS Timing

Timing functions allow delayed or repeated execution.

setTimeout(() => {
  console.log("Runs after delay");
}, 1000);

const id = setInterval(() => {
  console.log("Repeating");
}, 2000);

clearInterval(id);

For animations, prefer requestAnimationFrame:

function animate() {
  console.log("Frame");
  requestAnimationFrame(animate);
}

requestAnimationFrame(animate);

JS Cookies

Cookies store small pieces of data in the browser. They are sent with HTTP requests.

// Set cookie
document.cookie = "username=Ozan; path=/; max-age=3600";

// Read cookies
console.log(document.cookie);

Important cookie attributes:

  • path
  • expires / max-age
  • secure
  • SameSite

Modern applications often prefer localStorage or sessionStorage for client-side storage when cookies are not required by the server.

Next Step

Continue with JS Web APIs or JS AJAX to explore browser features and networking.

JS Windows Examples (8)