Лучший подход для доступа LocalStorage

Question

На протяжении Интернета я видел 3 подхода для сохранения и извлечения данных из localStorage:

//As an array 
localStorage["key"] = "value"; 
var value = localStorage[key]; 

//As an object, using properties 
localStorage.key = value; 
var value = localStorage.key; 

//As an object, using getter and setter functions 
localStorage.setItem("key", "value"); 
var value = localStorage.getItem("key"); 

Из того, что я знаю, что первые два эквивалентны, так как массив в JavaScript рассматривается как объект.

Третий вариант кажется лучшим, поскольку использование геттеров и сеттеров позволяет инкапсулировать логику функции, а также расширение.

Я надеюсь получить дополнительную информацию об этом, может ли кто-нибудь посоветовать?

EDIT: Причина этого вопроса исходит из того, что LocalStorage is more than just an array поэтому я ищу мнения явно таргетинг LocalStorage и его реализации.

Answer 1

Ваше понимание кажется абсолютно правильным для меня. Что может вас смутить, так это странная природа javascript. В javascript все является объектом, и каждый объект по существу может обрабатываться как хэш-карта, поэтому ваши первые два примера эквивалентны. Последние два примера также являются фактически эквивалентными, поскольку они являются просто членами функции локального объекта хранения. Поскольку все примеры имеют тот же эффект, я бы сказал, что самое главное - оставаться в коде, чтобы сделать его более читаемым.

Имейте в виду, что массив также является объектом и может рассматриваться в качестве такого

Answer 2

Это, как я использую его.

function setLocalObj(id, obj){ 
    if(id && obj) 
     localStorage[id] = JSON.stringify(obj); 
} 

function getLocalObj(id){ 
    if(localStorage[id]) 
     return JSON.parse(localStorage[id]); 
} 

function removeLocalObj(id){ 
    if(localStorage[id]) 
     localStorage.removeItem(id); 
} 


var myObj = { 
    'val':10, 
    'str': 'hi there' 
} 
setLocalObj('myObj', myObj); 

Answer 3

Разница между доступом к скобкам и доступом к объектам объекта является просто удобством языка. Интересна разница между прямым доступом к свойствам и использованием методов getter/setter.

Спецификация говорит:

«Поддерживаемые имена свойств на объекте хранения ключи от каждой пары ключ/значение в настоящее время присутствует в списке, связанного с объектом.»

Это говорит мне, что прямой доступ совершенно законный. т. е. все пользовательские агенты, реализующие спецификацию, должны ее поддерживать.

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

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

Лично я использовал бы методы, но отрисую функциональность в своем приложении на простую функцию, которую я могу поменять, если мне нужно позже. например:

function getLocal(key){ 
    return localStorage.getItem(key); 
} 

Если по какой-то причине я считаю, проблему с этим, или необходимо поддерживать старые браузеры (например, падение обратно к обычному печенью), я могу просто изменить мое приложение в одном месте. Я знаю, что это был не ваш вопрос, но он есть.