Đối tượng window là nền tảng cốt lõi của mô hình đối tượng trình duyệt (BOM) trong JavaScript. Khi một trang web được tải, trình duyệt tự động khởi tạo một thể hiện duy nhất của window, đại diện cho toàn bộ cửa sổ hoặc tab hiện tại — không chỉ tài liệu HTML mà còn bao gồm trạng thái điều hướng, lịch sử, thông tin thiết bị và các dịch vụ hệ thống.

Cấu trúc phân cấp của window

window đóng vai trò như đối tượng toàn cục và là gốc của cây BOM. Một số thuộc tính quan trọng kế thừa từ nó bao gồm:

• document: Truy cập và thao tác DOM của trang.
• location: Đọc/ghi URL hiện tại và điều hướng.
• history: Duyệt lại/tiến tới trong lịch sử điều hướng.
• navigator: Lấy thông tin về trình duyệt và môi trường thực thi.
• screen: Truy vấn kích thước màn hình và độ phân giải.

Thao tác với cửa sổ

Hai phương thức chính để kiểm soát cửa sổ là open() và close(). Lưu ý rằng close() chỉ hoạt động trên các cửa sổ do script mở ra — trình duyệt chặn việc đóng cửa sổ do người dùng khởi tạo nhằm bảo vệ trải nghiệm người dùng.

Mở cửa sổ mới

Phương thức open() chấp nhận tối đa ba tham số: URL đích, tên cửa sổ và chuỗi cấu hình tùy chọn.

function launchExternalPage() {
  const targetUrl = 'https://example.com';
  const popup = window.open(
    targetUrl,
    '_blank',
    'width=800,height=600,scrollbars=yes,resizable=yes'
  );
  if (popup && popup.focus) {
    popup.focus();
  }
}

Đóng cửa sổ hiện tại (nếu khả thi)

function attemptClose() {
  // Chỉ thành công nếu cửa sổ được mở bằng window.open()
  if (window.opener !== null) {
    window.close();
  } else {
    console.warn('Không thể đóng cửa sổ gốc qua script.');
  }
}

Các hộp thoại tích hợp

Ba hàm tương tác cơ bản — alert(), confirm(), và prompt() — đều là phương thức trực tiếp của window. Chúng tạm dừng luồng thực thi cho đến khi người dùng phản hồi.

Hộp thông báo đơn giản

Dùng để hiển thị thông điệp ngắn, không yêu cầu nhập liệu. Dấu ngắt dòng được biểu diễn bằng ký tự \n.

alert('Chào mừng!\nBạn đang ở trang chủ.\nHãy tiếp tục khám phá.'); 

Hộp xác nhận nhị phân

Trả về giá trị boolean: true nếu người dùng nhấn "OK", false nếu nhấn "Hủy".

const userConfirmed = confirm('Bạn có chắc chắn muốn xóa mục đã chọn?');
if (userConfirmed) {
  console.log('Xử lý xóa...');
} else {
  console.log('Hành động bị hủy.');
}

Hộp nhập liệu chuỗi

Trả về chuỗi do người dùng nhập, hoặc null nếu họ nhấn "Hủy".

const userName = prompt('Vui lòng nhập tên của bạn:', 'Người dùng mới');
if (userName !== null && userName.trim() !== '') {
  document.body.innerHTML = `<h2>Xin chào, <strong>${userName.trim()}</strong>!</h2>`;
} else {
  document.body.innerHTML = '<p>Chào mừng bạn ghé thăm!</p>';
}

Điều hướng và phân tích URL qua location

Đối tượng location cung cấp giao diện lập trình để đọc và thay đổi địa chỉ hiện tại. Ba thuộc tính thường dùng nhất là:

• href: Chuỗi URL đầy đủ của trang hiện hành.
• search: Phần truy vấn sau dấu ? (bao gồm cả dấu ?).
• hash: Phần định danh sau dấu # (bao gồm cả dấu #).

Chuyển hướng chương trình

Gán giá trị mới vào location.href sẽ dẫn đến việc tải lại trang tại địa chỉ mới.

// Chuyển hướng sau 3 giây
setTimeout(() => {
  window.location.href = 'https://developer.mozilla.org';
}, 3000);

// Hoặc đọc URL hiện tại
console.log('URL hiện tại:', window.location.href);