最近面试的时候总是被问到localStorage关于html5API的问题。一般的问题，很简单，无非就是localStorage、sessionStorage、cookies这三个客户端缓存的区别。localStorageAPI、getItem、setItem、clear等。localStorage以字符串形式访问数据，最大容量为5M。大多数学生都能回答以上三个问题。那么，面试官的问题是：5M，存储容量溢出怎么办？其实这个5M对于不同的浏览器也是不确定的，但是一般都在5M的范围内。溢出了怎么办，肯定会出错。浏览器会报一个名为“QuotaExceededError”的错误，如下图所示：最后溢出的字符串是否存储到最大容量？一般情况下，5M的字符串可能存不下，但是不能保证在浏览器随着时间积累的情况下，恰好用户还没有清除缓存，所以当最终容量接近5M时，当我们存将另一个字符串放入其中会发生错误。是否保存了一半的错误字符串？还是根本没有存储？答案是---没有保存。下面是我写的一个demo。最后发现当我在报错的时候刷新浏览器，localStorage的当前容量发生了变化。由于存在安全问题，使用localStorage也不是绝对安全的。如何更安全地使用localStorage？前端安全是一个很重要的话题，因为我们直接和用户打交道，你的程序在前端一定要避免不可预知的错误。因此，我们需要为这种不安全的API寻找解决方案。以下是我的一种解决方案（可能不是最优方案，但可行）。(function(){varsafeLocalStorage=function(key,value){try{localStorage.setItem(key,value);}catch(oException){if(oException.name=='QuotaExceededError'){console.log('already超出了本地存储的大小限制！');//可以在超出限制大小后进行操作，比如下面，可以先清空记录再保存localStorage.clear();localStorage.setItem(key,值);}}}this.safeLocalStorage=safeLocalStorage;})();面试官有一波素质！对于刚刚会用localStorage的同学来说，一定是百思不得其解。其实这也是很多同学在准备面试的时候应该考虑的问题，或者说应该关注的方向（虽然我才刚毕业，但希望遇到的问题总结对大家有所帮助）。学习知识，懂得运用固然重要，但要想熟练掌握一个知识点，就必须深入挖掘。Demo地址：https://github.com/zhoudeyou9...前端小白，此为第一帖，立志写下自己的学习成长过程，欢迎批评指正o(￣︶￣)o
