localStorage – use getItem/setItem functions or access object directly?

by

Not really, they are, basically, exactly the same. One uses encapsulation (getter/setter) to better protect the data and for simple usage. You’re supposed to use this style (for security).

The other allows for better usage when names(keys) are unknown and for arrays and loops. Use .key() and .length to iterate through your storage items without knowing their actual key names.

I found this to be a great resource : http://diveintohtml5.info/storage.html

This question might provide more insight as well to some: HTML5 localStorage key order

Addendum:

Clearly there has been some confusion about encapsulation. Check out this quick Wikipedia. But seriously, I would hope users of this site know how to google.

Moving on, encapsulation is the idea that you are making little in and out portals for communication with another system. Say you are making an API package for others to use. Say you have an array of information in that API system that gets updated by user input. You could make users of your API directly put that information in the array… using the array[key] method. OR you could use encapsulation. Take the code that adds it to the array and wrap it in a function (say, a setArray() or setWhateverMakesSense() function) that the user of your API calls to add this type of information. Then, in this set function you can check the data for issues, you can add it to the array in the correct way, in case you need it pushed or shifted onto the array in a certain way…etc. you control how the input from the user gets into the actual program. So, by itself it does not add security, but allows for security to be written by you, the author of the API. This also allows for better versioning/updating as users of your API will not have to rewrite code if you decide to make internal changes. But this is inherent to good OOP anyhow.

(Therefore, in response to Natix’s comment below…)

In the case here of javascript and the localStorage object, they have already written this API, they are the author, and we are its users. If the authors decide to change how localStorage works, then it will be less likely to have to rewrite your code if the encapsulation methods were used. But we all know its highly unlikely that this level of change will ever happen, at least not any time soon. And since the authors didn’t have any inherent different safety checks to make here, then, currently, both these ways of using localStorage are essentially the same. It’s kind of like a shim. However, we can easily overwrite/replace the existing encapsulation around localStorage to make our own security checks. Because JavaScript is just that awesome.

PT

More Related Contents:

  1. how to store new elements added in webpage by user? [closed]
  2. How to store objects in HTML5 localStorage
  3. What is the max size of localStorage values?
  4. HTML5 Local storage vs. Session storage
  5. When do items in HTML5 local storage expire?
  6. use localStorage across subdomains
  7. JavaScript; communication between tabs/windows with same origin [duplicate]
  8. In HTML5, is the localStorage object isolated per page/domain?
  9. Get HTML5 localStorage keys
  10. How to delete a localStorage item when the browser window/tab is closed?
  11. html5 localStorage error with Safari: “QUOTA_EXCEEDED_ERR: DOM Exception 22: An attempt was made to add something to storage that exceeded the quota.”
  12. How persistent is localStorage?
  13. Is localStorage.getItem(‘item’) better than localStorage.item or localStorage[‘item’]?
  14. cross domain localstorage with javascript
  15. localStorage object is undefined in IE
  16. HTML5 Local Storage fallback solutions [closed]
  17. Looping through localStorage in HTML5 and JavaScript
  18. Scope of sessionStorage and localStorage
  19. Do I have to store tokens in cookies or localstorage or session?
  20. localStorage access from local file
  21. Javascript/HTML Storage Options Under File Protocol (file://)
  22. How can I serialize a function in JavaScript?
  23. useEffect does not listen for localStorage
  24. How to retrieve all localStorage items without knowing the keys in advance?
  25. Saving and loading an image from localStorage
  26. How can I request an increase to the HTML5 localstorage size on iPad, like the FT web app does?
  27. Listen for changes with localStorage on the same window
  28. Access Denied for localstorage in IE10
  29. Push JSON Objects to array in localStorage
  30. Save data to local storage

Leave a Comment