1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/jaywcjlove-store.js

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Клонировать/Скачать
README-zh.md 12 КБ
Копировать Редактировать Web IDE Исходные данные Просмотреть построчно История
Отправлено 16.03.2025 22:29 4639886

Локальное хранилище localStorage

Скачивания Конструирование и тестирование storejs Статус покрытия README.md

Обертка для локального хранения localStorage с простым API, без зависимостей, размером всего 2.08 кБ (gzipped: 0.97 кБ).

Предыдущая v1 версия. Просмотр документации.

Установка

# Установка через npm
npm install storejs

Генерация минифицированных файлов и режим разработки

$ npm run build    # Генерирует исходный js файл с UMD и min.js
$ npm run watch    # Отслеживает изменения файлов и автоматически генерирует минифицированный js

Тестирование

$ npm test
$ npm run ssr

# Откройте браузер по адресу http://localhost:1987/test/test.html

Использование

Или вручную скачайте и импортируйте store.min.js в вашем HTML, вы также можете скачать его через UNPKG:

<script src="https://unpkg.com/storejs/dist/store.min.js"></script>
<script type="text/javascript">
  store("test", "tank");
</script>

или

var store = require('storejs');
store("test", "tank");

⚠️ При использовании нативных методов для получения данных, поскольку данные хранятся как JSON объекты, они преобразуются в JSON строки с помощью метода JSON.stringify().```js JSON.parse(localStorage.getItem('test'))


## Локальные хранилища API

```js
store(key, data);                 // Сохранение одной строки данных
store({key: data, key2: data2});  // Сохранение нескольких строковых данных
store(key);               // Получение строки данных по ключу
store("?key");            // Проверка наличия ключа
store();                  // Получение всех ключей/данных
//store(false);🔫         // (Устарело) Ввод пустого значения или ошибки может очистить базу данных
//store(key, false);🔫    // (Устарело) Удаление ключа вместе со значением ключа, когда val равно 0, невозможно сохранить...
store.set(ключ, данные[, перезапись]);    // === store(ключ, данные);
store.set({ключ: данные, ключ2: данные2});   // === store({ключ: данные, ключ2: данные});
store.get(ключ[, альт]);                // === store(ключ);
store.get("?ключ");                     // проверяет наличие ключа
store.get("ключ1", "ключ2", "ключ3");    // получает данные для `ключ1`, `ключ2`, `ключ3`
store.remove(ключ);                   //===store(ключ, false)
store.clear();                         // очистить все ключи/данные
store.keys();                          // вернуть массив всех ключей
store.forEach(коллбэк);               // циклический перебор, возврат false завершает перебор
store.search(строка);                 // метод поиска
store.has(key);         // ⇒ проверяет наличие и возвращает true/false

// ⇒ предоставляет метод callback для обработки данных
store("test", function(key, val) {
  console.log(val); // здесь обрабатывается данные, полученные через test
  return [3, 4, 5]; // возвращаются данные и сохраняются
});
``````md
store(["ключ", "ключ2"], function(ключ) {
  // обработка данных нескольких ключей, return и сохранение;
  console.log("ключ:", ключ);
  return "построчно изменяем данные";
});

// ⇒ при создании/обновлении/удалении данных, вызывает это событие
store.onStorage(function(ключ, значение) {
  console.log('onStorage:', ключ, значение);
});

set

Установка или удаление строковых данных
store.set(ключ, данные[, перезапись]);
эквивалентен store(ключ, данные);

store.set("wcj", "1");   // ⇒ 1
store.set("wcj");        // ⇒ удаление wcj и связанных строковых данных

setAll 🔫

используйте store.set({ключ: данные, ключ2: данные2}) вместо

Установка множества строковых данных
store.setAll(данные[, перезапись])
эквивалентна store({ключ: данные, ключ2: данные});

store.setAll({
    "wcj1": 123,
    "wcj2": 345
}); // сохраняет две строки данных

store.setAll(["w1", "w2", "w3"]);
// сохраняет три строки данных 
//  0 ⇒ "w1"
//  1 ⇒ "w2"
//  2 ⇒ "w3"

get

Получение строковых данных по ключу
store.get(ключ[, альтернатива])
эквивалентна store(ключ)

store.get("wcj1"); // получает строковые данные по ключу wcj1
store("wcj1"); // аналогичная функциональность

getAll 🔫

store() и store.get() используются вместо

Получение всех ключевых данных store.getAll()
эквивалентна store()

store.getAll(); // ⇒ JSON
store(); // аналогичная функциональность

clear

Очистка всех ключевых данных store.clear()

⚠️ Устарело store(false) из-за возможности случайной очистки при передаче пустого значения или ошибке.

store.clear();

keys

Возврат массива всех ключевых данных store.keys()

store.keys(); // ⇒ ["w1", "w2", "w3"]
```

### Поиск

Метод поиска `store.search(string)`

```js
store.search('key'); // ⇒ {"key":"keytest","key1":{"a":1},"key2":"построчно изменяем данные"}
```

### Проверка наличия

Проверка наличия и возврат `true/false` `store.has(key)`

```js
store.has("w1"); // ⇒ true
```

### Удаление

Удаление ключа вместе со всеми связанными строковыми данными `store.remove(key)`

```js
store.remove("w1"); // удаляет w1 и возвращает значение w1

store("w1", false); // также удаляет w1
```

### Циклический перебор

Циклический перебор, завершается при возврате `false`.

```js
store.forEach(function(k, d) {
  console.log(k, d);
  if (k === '3') return false;
});
```

### Планирование периодического удаления данных

(Запланировал сделать в будущем, чтобы автоматически очищать данные, вот идея)

```js
if (+new Date() > +new Date(2014, 11, 30)) {
  localStorage.removeItem("c"); // Удаление значения c
  // или localStorage.clear();
}
```

## Событие storage

Не понятно почему событие storage не работает, смотрите ниже [onStorage](#onstorage) => <s>HTML5 предоставляет событие storage для отслеживания изменений ключей и значений в локальном хранилище, используйте следующий метод:</s>

```js
if (window.addEventListener) {
  window.addEventListener("storage", handle_storage, false);
} else if (window.attachEvent) {
  window.attachEvent("onstorage", handle_storage);
}
function handle_storage(e) {
  if (!e) { e = window.event; }
  // showStorage();
}
```

Для события `e`, это объект типа StorageEvent, который предоставляет полезные свойства для наблюдения за изменениями ключей и значений, как показано в таблице:
| Свойство | Тип      | Описание                                                                                   |
| -------- | -------- | ------------------------------------------------------------------------------------------ |
| key      | String   | Название ключа, который был добавлен, удалён или изменён                                    |
| oldValue | Any      | Предыдущее значение (теперь перезаписанное) или null, если новый элемент был добавлен       |
| newValue | Any      | Новое значение или null, если элемент был добавлен                                          |
| url/uri  | String   | Страница, которая вызвала метод, спровоцировавший данное изменение                          |## Цепочка вызова

```js
store.set('ad', 234).get('ad');

store.onStorage(function(type) {
  console.log('тип:', type);
}).set('wcj', 12).clear().get('wcj');
// ⇒ тип: set
// ⇒ тип: clear
// ⇒ тип: set
```

## TODO

- [ ] `store.get([ключ, ключ2])` Получение данных, возвращает JSON
- [ ] `store([ключ, ключ2])` Получение данных, возвращает JSON
- [ ] `onStorage` Тестовый пример использования и реализации

## Совместимость

Источник: [sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)

| Характеристика        | Chrome | Firefox (Gecko) | Internet Explorer | Opera     | Safari (WebKit) | iPhone (iOS) | Android | Opera Mobile | Windows Phone |
| --------------------- | ------ | ---------------- | ------------------ | --------- | --------------- | ------------ | ------- | ------------ | ------------- |
| localStorage          | 4+     | bk 3.5+          | 8+                 | 10.50+   | 4+              | 3.2+         | 2.1+    | 11+          | 8+            |
| sessionStorage        | 5+     | 2+               | 8+                 | 10.50+   | 4+              | 3.2+         | 2.1+    | 11+          | 8+            |

## Размер локального хранилища

`JSON.stringify(localStorage).length` текущий объём используемой памяти [Проверка объёма localstorage](https://arty.name/localstorage.html)

## Связанные

- [cookiejs](https://github.com/jaywcjlove/cookie.js) 🍪 Простой и лёгковесный JavaScript API для работы с cookie браузера. Он легко загружается и используется, имеет разумный размер (~2kb) (gzip: 0.84kb) и не требует зависимостей. Не должно мешать работе любых JavaScript библиотек или фреймворков.

### Лицензия

Разрешено на условиях лицензии MIT.

Опубликовать ( 0 )

Вы можете оставить комментарий после Вход в систему

1
https://api.gitlife.ru/oschina-mirror/jaywcjlove-store.js.git
git@api.gitlife.ru:oschina-mirror/jaywcjlove-store.js.git
oschina-mirror
jaywcjlove-store.js
jaywcjlove-store.js
master