如何利用哈希表存储用户操作

这几天学完jQuery尝试做了一个导航网站的小项目 github地址

为了实现页面刷新或重启后用户的新增网站不被删除，使用了哈希表将用户的数据存储在了浏览器本地

具体的过程

• 首先是一段读取缓存的代码

1
2
3

const x = localStorage.getItem('x'); //读取缓存
const xObject = JSON.parse(x)
const hashMap = xObject || [];

具体步骤 ：

1. 首先声明一个变量x,它代表了缓存。

2. 然后我们利用JSON.parse()将从浏览器中读取到的缓存转换为数组

3. 声明一个哈希表,它的值就是这个数组，但是初次打开该网站时缓存为空，所以我们需要使用逻辑运算符||来让它有一个初始的空值

4. 好了，现在哈希表就有了

• 往哈希表里增删数据

1
2
3
4
5

    hashMap.push({
        logo: simplifyUrl($url)[0].toUpperCase(),
        url: $url

    hashMap.splice(index, 1)

具体步骤：

1. 我们只需要像数组一样将数据push或者slice

2. 这样我们就有了存储数据的哈希表

• 接下来要保存数据

1
2
3
4

window.onbeforeunload = () => {
    const string = JSON.stringify(hashMap);
    localStorage.setItem('x', string) //自动保存
}

window.onbeforeunload是指在浏览器关闭前

具体步骤：

1. 将哈希表转换为字符串

2. 将字符串string的数据保存到浏览器本地缓存

3. 现在浏览器就保存这个数据了，我们可以使用清除浏览器缓存来清除它