微信小程序本地存储同步跟异步的区别

Posted 2023-05-05

参考技术A 除非必要时候，尽量使用同步方法，特别是新手，建议使用同步方法，除非同步方法解决不了问题考虑使用异步方法。

效果可以在微信小程序调试器中看如下

移除之后叫做key的storage就会消失不见

如下使用clearStorageSync连同之前的logs都会清除掉

将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。除非用户主动删除或因存储空间原因被系统清理，否则数据都一直可用。单个 key 允许存储的最大数据长度为 1MB，所有数据存储上限为 10MB。

当我们存储了值之后就可以在微信小程序的调试栏器中看到效果了，同步跟异步除了存取执行的操作不一样之外，结果是一样的，都是存，拿值，结果是一样的，只是同步是顺序执行，而异步则是不会让界面停滞，但是这种几乎可以忽略不记，所以建议大家没有必要的话就使用同步了。
[图片上传失败...(image-ee4c86-1637290003071)]

从本地缓存中移除指定 key。

从本地缓存中异步获取指定 key 的内容。

uniapp数据缓存同步(setStorage)跟异步(setStorageSync)的区别

我一直都很喜欢用浏览器原生的本地存储，之前用得多这样子。前几天开发uniapp，用浏览器的原生本地存储，浏览器里没问题，但打包成app就不能用了。后来用了uniapp官方提供的本地存储，打包后能用，不得不说官方就是，但是第一用的时候，这个同步异步让我有点懵。但它同步异步的存在，肯定是有它的道理的。

我们先看看官方定义：

uni.setStorage(OBJECT)

将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。

uni.setStorage({
    key: 'storage_key',
    data: 'hello',
    success: function () {
        console.log('success');
    }
});

uni.setStorageSync(KEY,DATA)

将 data 存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个同步接口。

uni.setStorageSync('storage_key', 'hello');

 就写法看，同步接口用起来方便，跟js原生存储没两样，存键值对。而异步接口是可以写存取数据回调。

接下来，我们就去试着用用。

uni.setStorage({
	key:'ghui',
	data:'我系渣渣辉',
	success() {
		uni.showToast({
			title:'储存成功'
		});
	}
});
			
let ghui = uni.getStorage({
	key:'ghui'
})

let GHUI = uni.getStorageSync('ghui');

console.log(ghui,GHUI);

控制台结果是这样：

后来我改了一下：

uni.getStorage({
	key:'ghui',
	success(res) {
		console.log(res);
	}
})

 就是说，异步接口取缓存返回的结果，只能够在成功回调中使用，特点是拿到缓存数据后不用等待不相干的逻辑执行完，就直接执行相关逻辑，更快，但是写起来层层嵌套、不美观。回想第一次控制台打印的promise，我仿佛想到了什么。

uni.getStorage({
	key:'ghui',
}).then(res => {
	console.log(res);
})

果然，是可以的，不过取到的是一个数组，数据存在第二项：

 这样的话，就可以避免层层嵌套了。而同步接口，除了写起来方便之外，他可以赋值成一个变量，用起来也方便，而且又是同步执行，不用考虑缓存没取到就执行后面逻辑问题，用来了跟原生一样，就不多写了，言多必失。

自己片面理解，不对的望各位大佬多多指教。