Computer >> Hướng Dẫn Máy Tính >  >> Phần Mềm >> Các Trình Duyệt

Làm Chủ Browser Storage: localStorage vs. sessionStorage Giải Thích Chi Tiết

Để quản lý dữ liệu web application xử lý, bạn không nhất thiết cần database. Tính năng Browser Storage tương ứng được hỗ trợ bởi Chrome (version 4+), Mozilla Firefox (version 3.5+), Internet Explorer (version 8+), và nhiều trình duyệt khác bao gồm iOS và Android.

Có hai khả năng chính cho browser storage: localStorage và sessionStorage.

Mọi nội dung/dữ liệu lưu vào object localStorage sẽ có sẵn sau khi trình duyệt restart (đóng mở lại). Để lưu item vào localStorage, dùng method setItem(). Method này nhận key và value.

Ví dụ: localStorage.setItem("mykey","myvalue"); 

Để lấy item từ localStorage, dùng method getItem. Method getItem nhận key của dữ liệu muốn lấy:

 Ví dụ: localStorage.getItem("mykey"); 

Xóa item khỏi localStorage bằng method removeItem(). Method nhận key của item muốn xóa:

 Ví dụ: localStorage.removeItem("mykey"); 

Để xóa toàn bộ localStorage, dùng method clear() trên object localStorage:

 Ví dụ: localStorage.clear(); 

sessionStorage

Item lưu trong object sessionStorage sẽ giữ cho đến khi user đóng trình duyệt. Sau đó, storage bị xóa.

Lưu item vào sessionStorage, dùng method setItem() trên object sessionStorage:

Ví dụ: sessionStorage.setItem("mykey","myvalue"); 

Để lấy item từ sessionStorage, dùng method getItem. Method getItem nhận key dữ liệu muốn lấy:

 Ví dụ: sessionStorage.getItem("mykey"); 

Xóa item khỏi sessionStorage bằng method removeItem(). Method nhận key item muốn xóa:

 Ví dụ: sessionStorage.removeItem("mykey"); 

Để xóa toàn bộ sessionStorage, dùng method clear() trên object sessionStorage:

 Ví dụ: sessionStorage.clear(); 

Lưu Mảng (Array) Vào localStorage Và sessionStorage

Không chỉ lưu single value vào localStorage và sessionStorage, bạn cũng lưu được nội dung array.

Trong ví dụ, có mảng số:

var ourArray =[1,2,3,4,5]; 

Bây giờ lưu vào localStorage hoặc sessionStorage dùng method setItem():

localStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 

hoặc, cho sessionStorage:

sessionStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 

Để lưu được, mảng phải chuyển thành string trước. Trong ví dụ, dùng method JSON.stringify.

Khi lấy dữ liệu từ localStorage hoặc sessionStorage, chuyển lại thành array:

var storedArray = localStorage.getItem("ourarraykey"); ourArray = JSON.parse(storedArray); 

hoặc, cho sessionStorage:

var storedArray = sessionStorage.getItem("ourarraykey"); ourArray = JSON.parse(storedArray); 

Học lập trình miễn phí. Chương trình mở của freeCodeCamp đã giúp hơn 40.000 người có việc làm lập trình viên. Bắt đầu ngay