CÁCH lưu trữ dữ liệu trong JavaScript
API 7 cho phép bạn lưu trữ dữ liệu cục bộ (như tên ngụ ý) mà trình duyệt có thể truy cập sau này Show
Dữ liệu được lưu trữ vô thời hạn và phải là một chuỗi Sử dụng 8 để lưu trữ dữ liệu của bạn, chuyển một khóa làm đối số đầu tiên và giá trị dữ liệu của bạn làm đối số thứ hai. Bạn có thể gọi 9 để lấy dữ liệu của mình và 0 để xóa dữ liệu đó
7 hoạt động trong tất cả các trình duyệt hiện đại và quay lại IE8Giới hạn lưu trữCác trình duyệt cung cấp các mức dung lượng lưu trữ khác nhau cho 7, từ nhỏ nhất là 2mb cho đến không giới hạnĐối với các trình duyệt có giới hạn bộ nhớ tối đa, lượng này là tổng lượng dữ liệu cho phép, không chỉ là mức tối đa cho trang web hoặc ứng dụng web cụ thể của bạn. Theo đó, bạn nên cố gắng giảm dấu chân tổng thể của dữ liệu của mình càng nhiều càng tốt Bộ nhớ cục bộ cho phép nhà phát triển lưu trữ và truy xuất dữ liệu trong trình duyệt. Dữ liệu được lưu trữ trong bộ nhớ cục bộ sẽ không hết hạn. Điều này có nghĩa là dữ liệu sẽ tồn tại ngay cả khi tab hoặc cửa sổ trình duyệt bị đóng điều kiện tiên quyếtBạn phải có hiểu biết cơ bản về JavaScript. Bạn cũng cần một trình chỉnh sửa mã và trình duyệt để kiểm tra dự án. Trong hướng dẫn này, chúng tôi sẽ sử dụng Visual Studio Code và Google Chrome Lưu trữ cục bộ là gìLưu trữ cục bộ là một dạng lưu trữ web lưu trữ dữ liệu trong một thời gian dài. Đây có thể là một ngày, một tuần hoặc thậm chí một năm. Điều này phụ thuộc vào sở thích của nhà phát triển. Điều quan trọng cần lưu ý là bộ nhớ cục bộ chỉ lưu trữ các chuỗi, vì vậy, nếu bạn muốn lưu trữ các đối tượng, danh sách hoặc mảng, bạn phải chuyển đổi chúng thành chuỗi bằng cách sử dụng 6Khi nào nên sử dụng bộ nhớ cục bộBạn chỉ nên sử dụng bộ nhớ cục bộ khi lưu trữ thông tin nhạy cảm. Điều này là do các cá nhân bên thứ ba có thể dễ dàng truy cập thông tin. Bộ nhớ cục bộ có thể giúp lưu trữ dữ liệu tạm thời trước khi được đẩy lên máy chủ. Điều quan trọng là phải xóa bộ nhớ cục bộ sau khi thao tác này hoàn tất Hạn chếNhững hạn chế chính của lưu trữ cục bộ là
Các phương thức chính trong lưu trữ cục bộCác phương pháp chính khi sử dụng bộ nhớ cục bộ là 7, 8, 9, 0 và 1Chìa khóa()Phương thức này được sử dụng để truy xuất một giá trị/chuỗi từ một vị trí cụ thể. Chỉ mục có thể được chuyển vào hàm 7 dưới dạng tham số________số 8 7 cũng có thể được sử dụng trong câu lệnh lặp để truy xuất tất cả các mục trong bộ nhớ cục bộthiết lập các mục()Chức năng này được sử dụng để lưu trữ các mục trong bộ nhớ cục bộ. Một ví dụ về chức năng này được hiển thị bên dưới
Như đã đề cập trước đây, chúng ta phải 4 đối tượng trước khi lưu trữ chúng trong bộ nhớ cục bộMột ví dụ được phác thảo dưới đây
Không xâu chuỗi đối tượng sẽ dẫn đến lỗi getItem()Chức năng này được sử dụng để truy cập hoặc lấy dữ liệu trong bộ nhớ cục bộ. Phương thức lấy một 5 làm tham số. Sau đó, nó trích xuất giá trị cần thiết từ localStorageVí dụ, để lấy đối tượng 6 ở trên, chúng ta sẽ sử dụng câu lệnh sau 5Câu lệnh trên sẽ trả về một cái gì đó như thế này 6Bạn nên chuyển đổi nó thành một đối tượng bằng cách sử dụng 7 để sử dụng nó trong mã của bạn 8loại bỏ mục()Phương pháp này được sử dụng để xóa một mục khỏi bộ nhớ cục bộ. Phương thức 9 yêu cầu khóa làm tham số 0thông thoáng()Phương pháp này được sử dụng để xóa tất cả các giá trị được lưu trữ trong bộ nhớ cục bộ. Nó không yêu cầu bất kỳ tham số nào 1Dự ánBây giờ chúng ta đã tìm hiểu về các chức năng chính của bộ nhớ cục bộ, hãy tạo một ứng dụng web lưu trữ, truy xuất, xóa và xóa các mục khỏi bộ nhớ cục bộ Tạo một thư mục mới và mở nó trong trình chỉnh sửa mã của bạn. Tạo hai tệp, 9 và 50. Tệp 9 sẽ hiển thị trang web cho người dùng, trong khi tệp 50 sẽ lưu trữ các chức năng JavaScript của chúng tôi. Các chức năng này sẽ được sử dụng để truy cập các chức năng khác nhau của bộ nhớ cục bộHãy viết mã 9 của chúng ta sẽ có một 54 và một số 55, như hình bên dưới 9Khi nhấp vào nút 56, nó sẽ nhận đầu vào của người dùng và chuyển nó đến hàm 57 trong tệp 50. 59 nhận đầu vào của người dùng. Các giá trị này sau đó được chuyển đến đối tượng xe hơi và được lưu trữ trong bộ nhớ cục bộ bằng phương thức 60 5Tương tự, 61 sẽ gọi hàm 62 khi được nhấp vào. Phương thức này tìm nạp các mục từ localStorage bằng hàm getItem 63 tạo một thành phần đoạn văn mới trong trang web của chúng tôi 64 giúp tạo văn bản sẽ hiển thị cho người dùngNút văn bản sau đó được thêm vào thẻ đoạn bởi 65Các thành phần này sau đó được hiển thị ở một vị trí cụ thể trên trang web bởi 66 và 67 0 68 gọi 9. 80 này sẽ xóa một giá trị khỏi bộ nhớ cục bộ bằng hàm 81 1 82 gọi 83. Phương pháp 1 được sử dụng để xóa tất cả các giá trị trong bộ nhớ cục bộ 2Hãy đặt thuộc tính 85 của tất cả các nút khi tải trang web 3Đây là tệp 50 với tất cả các chức năng 4Như đã trình bày ở trên, các chức năng sẽ chỉ có thể truy cập được sau khi tải xong trang. Điều này được chỉ định bởi phương pháp 87Đảm bảo rằng tệp 50 được tham chiếu trong tệp 9 bằng cách dán câu lệnh bên dưới vào phần 00 5Kết quảVideo sau đây cho thấy cách trang web hoạt động Phần kết luậnBây giờ bạn đã quen thuộc với các chức năng khác nhau của bộ nhớ cục bộ. Các phương thức chính trong lưu trữ cục bộ là ________ 160, ________ 202, ________ 181 và ________ 204. Cần có 5 khi lưu trữ, truy xuất và xóa các mục khỏi bộ lưu trữ cục bộ. Trong trường hợp bạn không hiểu bất kỳ khái niệm nào, vui lòng xem lại các chức năng lưu trữ cục bộ
Làm cách nào để lưu trữ dữ liệu trong tệp bằng JavaScript?Thuật toán . Step 1 − Create HTML element.. Bước 2 - Nhận nội dung để thêm vào tệp văn bản Bước 3 - Tạo một đối tượng Blob của nội dung Step 4 − In the href attribute of the tag, add the blog object URL.. Step 5 − Add the default file name as a value of the 'download' attribute of tag.. JavaScript có được sử dụng để lưu trữ dữ liệu không?JavaScript cho phép chúng tôi lưu trữ dữ liệu trong trình duyệt bằng API lưu trữ cục bộ . Tại đây, bạn có thể sử dụng LocalStorage và SessionStorage. Các đối tượng cho phép chúng tôi lưu trữ dữ liệu (theo cặp khóa/giá trị) và cập nhật dữ liệu đó từ bộ lưu trữ của trình duyệt. Để xem dữ liệu, hãy mở trình duyệt của bạn.
Làm cách nào để lưu trữ dữ liệu vĩnh viễn trong JavaScript?LocalStorage là một cách lưu trữ dữ liệu vĩnh viễn trong trình duyệt . Không giống như đặt một biến thông thường, nó không đặt lại khi bạn tải lại trang và bạn có thể truy cập cùng dữ liệu localStorage từ bất kỳ trang nào trên trang web của mình. LocalStorage là kho lưu trữ khóa-giá trị, nghĩa là bạn lưu trữ dữ liệu bằng khóa.
Làm cách nào để lưu trữ dữ liệu trong localStorage trong JavaScript?Cú pháp . Lưu dữ liệu vào bộ nhớ cục bộ. lưu trữ cục bộ. setItem(key, value); Đọc dữ liệu từ bộ nhớ cục bộ. để họ = localStorage. getItem(key); Xóa dữ liệu khỏi bộ nhớ cục bộ. lưu trữ cục bộ. removeItem(key); Xóa tất cả (Xóa bộ nhớ cục bộ) localStorage. thông thoáng(); |