JS面试题7——localStorage,sessionStorage,cookie的区别

公共点：都是用于在客户端存放数据的

区别：

1. 数据存放的有效期不同

<script>
sessionStorage.setItem("key", "123"); // 仅在当前浏览器窗口关闭前有效
localStorage.setItem("key", "456"); // 持久化存储（浏览器关闭也一直保存）
document.cookie = 'name=789'; // 在设置的过期时间之前都有效（无论是否关闭浏览器）
</script>/* cookie可以设置有效期 */
<script>
export default{create(){var date = new Date();var time = date.getTime()date.setTime(time)document.cookie = 'name=789; express=' + date.toUTCString() + '';}
}
</script>

2. 存储大小的限制不同（不同的浏览器存储的大小不同）

cookie的存储量不能超过4k，localStorage和sessionStorage不能超过5M

3. 作用域不同

cookie在所有同源窗口中都是共享的；localstorage也是在所有同源窗口中共享的;

sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面;

4. cookie在浏览器和服务器间来回传递，而sessionStorage和localStorage不会自动把数据发送给服务器，仅在本地保存