Хранение данных в JavaScript

Скрипты

Рисунок Хранение данных в JavaScript
Хранение данных в JavaScript Хранение данных в JavaScript
оценка: 4.7 из 5
оценок: 9

Сегодня публикую несколько JavaScript функций по хранению данных, которые помогут быстро состряпать код и облегчат труд программиста.

Суперассы программирования могут сказать, что все операции можно выполнять ручками, и в таком случае больше возможностей. Они могут не читать дальше. Но если нужно быстро состряпать код с хорошим функционалом, то эти функции хранения данных будут кстати.

Хранить данные можно несколькими способами. Каждый из них имеет свои преимущества и свои недостатки.

Меню разделов материала для быстрого доступа:

1. Глобальные переменные

Глобальные переменные позволяют хранить данные любого типа. Но данные хранятся только до обновления страницы. Их следует прописывать в самом начале скрипта вне функций.

Запись глобальной переменной

Code
var globalVariable = 'Глобальная переменная';

Чтение глобальной переменной

Code
window.alert( globalVariable );

Очистка глобальной переменной

Code
globalVariable = '';

К содержанию.

2. Cookie (куки)

Краткое описание. Cookie могут содержать до 4Кб информации. Куки могут быть ограничены в пределах домена или пути в домене. Они не чувствительны к регистру. Куки можно установить на определенное время, по истечении которого она может удалиться браузером. Однажды установленные cookie будут отправляться серверу при каждом запросе страницы, до их удаления.

Запись cookie

Code
function setCookie(name, value, options) {
  options = options || {};
  var expires = options.expires;
  if (typeof expires == 'number' && expires) {
    var d = new Date();
    d.setTime(d.getTime() + expires * 1000);
    expires = options.expires = d;
  }
  if (expires && expires.toUTCString) {
    options.expires = expires.toUTCString();
  }
  value = encodeURIComponent(value);
  var updatedCookie = name + '=' + value;
  for(var propName in options) {
    updatedCookie += '; ' + propName;
    var propValue = options[propName];
    if (propValue !== true) updatedCookie += '=' + propValue;
  }
  document.cookie = updatedCookie;
}

name - название куков (строка).

value - записываемое значение (строка).

options - опции хранения:

  • expires - время храния куков. Если число - в секундах, если дата - то до нее, если 0 - то до закрытия браузера.
  • path - путь, по которому куки будут ограничены (строка).
  • domain - домен, по которому куки будут ограничены (строка).
  • secure - если значение true, то пересылка cookie будет производится только по защищенному соединению.

Чтение cookie

Code
function getCookie(name) {
  var matches = document.cookie.match(new RegExp('(?:^|; )' + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + '=([^;]*)'));
  return matches ? decodeURIComponent(matches[1]) : undefined;
}

Удаление cookie

Code
function deleteCookie(name) {
  setCookie(name, '', { expires: -1 });
}

К содержанию.

3. Локальное хранилище (Local Storage)

Локальное хранилище появилось в спецификации HTML5. Поэтому оно работает толко в определеных браузерах:

  • IE 8.0+
  • Firefox 3.5+
  • Safari 4.0+
  • Chrome 4.0+
  • Opera 10.5+
  • iPhone 2.0+
  • Android 2.0+

Local Storage обладает следующими особенностями. Объемы хранимой информации ограничены только жестким диском и настройками браузера. В стандарте это 5 мегабайт. Информация в локальном хранилище не стирается даже после перезапуска браузера. Local Storage позволяет передавать информацию между страницами внутри домена. Сохраненные данные не передаются серверу и используются только скриптом. Храниться могут только строковые значения.

Запись в локальное хранилище

Code
function setLocalStorage( key, value, funcExceed ){
  try {
    if( 'localStorage' in window && window['localStorage'] !== null ) {
      try {
        localStorage.setItem( key, value );
        return true;
      } catch (e) {
        if (e == QUOTA_EXCEEDED_ERR) {
          if( funcExceed != udefined && typeof funcExceed == 'function' ) funcExceed();
          return false;
        }
      }
    } else {
      return false;
    }
  } catch (e) {
    return false;
  }
}
  • key - ключ переменной.
  • value - хринимое зачение (строка).
  • funcExceed - функция, которая выполняется при переполнении хранилища. Если функция не задана, то никаких действий не выполняется.

В случае, если локальное хранилище не поддерживается, возвращает false, иначе - true.

Чтение из локального хранилища

Code
function getLocalStorage( key ){
  try {
    if( 'localStorage' in window && window['localStorage'] !== null ) {
      localStorage.getItem( key );
    } else {
      return undefined;
    }
  } catch (e) {
    return undefined;
  }
}

Если локальное хранилище не поддерживается, то возвращает undefined, иначе - значение ключа.

Очистка локального хранилища

Code
function clearLocalStorage( key ) {
  try {
    if( 'localStorage' in window && window['localStorage'] !== null ) {
      if( key == undefined ) {
        localStorage.clear();
      } else {
        localStorage.removeItem( key );
      }
    } else {
      return undefined;
    }
  } catch (e) {
    return undefined;
  }
}

Если параметр key задан, то удаляет определенный ключ. Если параметр не задан, то очищается все хранилище. В случае отсутствия поддержки локального хранилища - функция возвращает undefined.

К содержанию.

Итог

Это весь список способов хранения данных в JavaScript. Какой именно выбирать, решать Вам в зависимости от поставленной задачи.

На этом все. Подписывайтесь! Жмите звездочки!

Удачи в свершениях!

Не по теме. Подборка приколов.

Вы можете присоедениться к моему микроблогу в Твиттере @SzenProgs. Буду благодарен, если оцените мой труд, и щелкните по звездочкам ниже.




Хранение данных в JavaScript
Скрипты
Скрипты, инструкции, справочники

rss
Категория:Скрипты
Просмотрено:7147
Рейтинг:4.7/9
Дата добавления:2013-06-03 11:32, Понедельник
Добавил:Szen
Теги:данные, хранение данных, Функция, javascript функции

Мини-форум

№ 02013-06-03 11:32
Szen
Аватар участника Szen
Здесь вы можете задать вопрос или оставить комментарий по теме "Хранение данных в JavaScript".
Гость
Учавствовать в обсуждении "Хранение данных в JavaScript" могут только зарегистрированные пользователи.
Реклама
Кнопка портала
Друзья портала
Вакантное место для вашей рекламы!
RSS лента Блога
RSS лента Каталога файлов
RSS лента Новостей
Будьте в курсе событий.
Введите ваш email:

Личный блок
  • Гость портала.
  • Личных данных нет.
Вход на сайт
Регистрация
Опрос
Каким CMS вы пользуетесь?
Всего ответов: 223
Статистика
Valid HTML 4.01 Transitional

Яндекс цитирования



Онлайн всего: 3
Гостей: 3
Пользователей: 0
Портал SzenProgs.ru © 2008 - 2017 · Условия
Администратор и дизайнер портала: Szen
Хостинг от uCoz