A cookie is a small piece of data stored in the user's browser.

Websites use cookies to:

• Remember login information
• Save user preferences (like dark mode)
• Track user activity
• Store temporary session data

Cookies are stored as name=value pairs.

Example of a simple cookie:

username=Alice

1️⃣ What Is a Cookie?

A cookie is a small piece of data stored in the user's browser.

Websites use cookies to:

• Remember login information
• Save user preferences (like dark mode)
• Track user activity
• Store temporary session data

Cookies are stored as name=value pairs.

Example of a simple cookie:

username=Alice

2️⃣ How JavaScript Works with Cookies

In JavaScript, cookies are handled using:

document.cookie

Important:

• document.cookie does NOT show cookies like an object.
• It returns all cookies as a single string.

3️⃣ Storing (Setting) a Cookie

To set a cookie:

document.cookie = "username=Alice";

But usually, you also set:

• expires → when the cookie should expire
• path → where the cookie is accessible

Example with expiration:

let date = new Date();
date.setTime(date.getTime() + (7 * 24 * 60 * 60 * 1000)); // 7 days
let expires = "expires=" + date.toUTCString();

document.cookie = "username=Alice;" + expires + ";path=/";

Explanation:

• setTime() → sets expiration time
• toUTCString() → required date format
• path=/ → cookie accessible throughout entire website

4️⃣ Reading a Cookie

When you use:

console.log(document.cookie);

You might get something like:

username=Alice; theme=dark

To read a specific cookie:

function getCookie(name) {
  let decoded = decodeURIComponent(document.cookie);
  let cookies = decoded.split(";");

  for (let i = 0; i < cookies.length; i++) {
    let c = cookies[i].trim();
    if (c.indexOf(name + "=") === 0) {
      return c.substring(name.length + 1);
    }
  }
  return "";
}

console.log(getCookie("username"));

Explanation:

• split(";") → separates multiple cookies
• substring() → extracts cookie value

5️⃣ Updating a Cookie

To update a cookie, simply set it again with a new value:

document.cookie = "username=Bob;path=/";

The browser replaces the old value.

6️⃣ Deleting a Cookie

To delete a cookie, set its expiration date to the past:

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

Since the date is expired, the browser removes it. How JavaScript Works with Cookies

In JavaScript, cookies are handled using:

document.cookie

Important:

• document.cookie does NOT show cookies like an object.
• It returns all cookies as a single string.

3️⃣ Storing (Setting) a Cookie

To set a cookie:

document.cookie = "username=Alice";

But usually, you also set:

• expires → when the cookie should expire
• path → where the cookie is accessible

Example with expiration:

let date = new Date();
date.setTime(date.getTime() + (7 * 24 * 60 * 60 * 1000)); // 7 days
let expires = "expires=" + date.toUTCString();

document.cookie = "username=Alice;" + expires + ";path=/";

Explanation:

• setTime() → sets expiration time
• toUTCString() → required date format
• path=/ → cookie accessible throughout entire website

4️⃣ Reading a Cookie

When you use:

console.log(document.cookie);

You might get something like:

username=Alice; theme=dark

To read a specific cookie:

function getCookie(name) {
  let decoded = decodeURIComponent(document.cookie);
  let cookies = decoded.split(";");

  for (let i = 0; i < cookies.length; i++) {
    let c = cookies[i].trim();
    if (c.indexOf(name + "=") === 0) {
      return c.substring(name.length + 1);
    }
  }
  return "";
}

console.log(getCookie("username"));

Explanation:

• split(";") → separates multiple cookies
• substring() → extracts cookie value

5️⃣ Updating a Cookie

To update a cookie, simply set it again with a new value:

document.cookie = "username=Bob;path=/";

The browser replaces the old value.

6️⃣ Deleting a Cookie

To delete a cookie, set its expiration date to the past:

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

Since the date is expired, the browser removes it.

Compilation of Entire Code