uniapp日常总结--setStorageSync和setStorage区别_uni.setstoragesync

uniapp日常总结–setStorageSync和setStorage区别

1.基本说明

1.1 uni.setStorageSync和uni.getStorageSync

uni.setStorageSync 和 uni.getStorageSync 是在uni-app框架中用于本地存储的方法。

uni.setStorageSync(key, data)

• 作用： 将数据同步保存到本地存储中。

• 参数：

  • key：保存数据时使用的键，用于后续获取数据。
  • data：要保存的数据，可以是字符串、数字、对象等。

• 示例：

  // 将用户信息保存到本地存储
  const userData = {
    username: 'example',
    age: 25,
    email: 'example@example.com'
  };
  uni.setStorageSync('user_data', userData);
  1
  2
  3
  4
  5
  6
  7

uni.getStorageSync(key)

• 作用： 从本地存储中同步获取数据。

• 参数：

  • key：要获取数据的键，必须是之前存储时使用的键。

• 返回值： 获取到的数据，如果未找到则返回 undefined。

• 示例：

  // 获取本地存储中的用户信息
  const userData = uni.getStorageSync('user_data');
  if (userData) {
    console.log('用户名:', userData.username);
    console.log('年龄:', userData.age);
    console.log('邮箱:', userData.email);
  } else {
    console.log('未找到用户信息');
  }
  1
  2
  3
  4
  5
  6
  7
  8
  9

这两个方法一般用于简单的数据存储和获取操作，比如保存用户登录信息、应用设置等。由于是同步操作，可能会在数据较大或者频繁读写的情况下影响性能。

1.2 uni.setStorage和uni.getStorage

uni.setStorage 和 uni.getStorage 是 uni-app 框架中用于本地存储的异步方法，与 uni.setStorageSync 和 uni.getStorageSync 相对应。这两个方法用于在本地存储中异步保存和获取数据，适用于一些需要较长时间的操作，以避免阻塞主线程。

uni.setStorage(options)

• 作用： 异步将数据保存到本地存储中。

• 参数：

  • options：一个包含以下字段的对象
    • key：保存数据时使用的键，用于后续获取数据。
    • data：要保存的数据，可以是字符串、数字、对象等。
    • success：操作成功的回调函数。
    • fail：操作失败的回调函数。
    • complete：无论成功或失败都会调用的回调函数。

• 示例：

  // 异步保存用户信息到本地存储
  const userData = {
    username: 'example',
    age: 25,
    email: 'example@example.com'
  };
  uni.setStorage({
    key: 'user_data',
    data: userData,
    success: function () {
      console.log('保存成功');
    },
    fail: function (error) {
      console.error('保存失败', error);
    }
  });
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16

uni.getStorage(options)

• 作用： 异步从本地存储中获取数据。

• 参数：

  • options：一个包含以下字段的对象
    • key：要获取数据的键，必须是之前存储时使用的键。
    • success：操作成功的回调函数，回调参数中包含获取到的数据。
    • fail：操作失败的回调函数。
    • complete：无论成功或失败都会调用的回调函数。

• 示例：

  // 异步获取本地存储中的用户信息
  uni.getStorage({
    key: 'user_data',
    success: function (res) {
      const userData = res.data;
      console.log('用户名:', userData.username);
      console.log('年龄:', userData.age);
      console.log('邮箱:', userData.email);
    },
    fail: function (error) {
      console.error('获取失败', error);
    }
  });
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13

这两个方法是异步执行的，可以在回调函数中处理获取到的数据或处理错误。在使用时，可以根据实际场景选择同步或异步的方法。

2.总结

这四个方法在uni-app中都用于数据的存储，但它们之间存在一些关键区别：

1. 同步 vs 异步:

   • uni.setStorageSync 和 uni.getStorageSync 是同步方法，它们会立即执行并阻塞线程，直到操作完成。这意味着它们可能会对性能产生一定的影响，尤其是在处理大量数据时。
   • uni.setStorage 和 uni.getStorage 是异步方法，它们会在后台执行，不会阻塞主线程。这样可以避免阻塞，但需要通过回调函数处理结果。

2. 回调函数 vs 直接返回值:

   • uni.setStorageSync 和 uni.getStorageSync 直接返回操作结果，你可以直接使用返回值，而不需要通过回调函数处理。
   • uni.setStorage 和 uni.getStorage 需要通过回调函数处理操作结果，因为它们是异步执行的。

3. 适用场景:

   • 同步方法通常适用于一些简单、小规模的数据存储操作，或者在初始化时需要同步获取数据的场景。
   • 异步方法更适用于大规模、复杂或者需要在后台执行的数据存储操作，比如保存用户设置、处理大量数据等。

4. 用法示例:

   • uni.setStorageSync 和 uni.getStorageSync 的使用方式更直接，可以直接将数据存储到本地，或者从本地获取数据。

   // 同步保存用户信息到本地存储
   const userData = {
     username: 'example',
     age: 25,
     email: 'example@example.com'
   };
   uni.setStorageSync('user_data', userData);
   
   // 同步获取本地存储中的用户信息
   const userDataSync = uni.getStorageSync('user_data');
   1
   2
   3
   4
   5
   6
   7
   8
   9
   10

   • uni.setStorage 和 uni.getStorage 需要通过回调函数处理，因为它们是异步执行的。

   // 异步保存用户信息到本地存储
   const userData = {
     username: 'example',
     age: 25,
     email: 'example@example.com'
   };
   uni.setStorage({
     key: 'user_data',
     data: userData,
     success: function () {
       console.log('保存成功');
     },
     fail: function (error) {
       console.error('保存失败', error);
     }
   });
   
   // 异步获取本地存储中的用户信息
   uni.getStorage({
     key: 'user_data',
     success: function (res) {
       const userDataAsync = res.data;
       console.log('用户名:', userDataAsync.username);
       console.log('年龄:', userDataAsync.age);
       console.log('邮箱:', userDataAsync.email);
     },
     fail: function (error) {
       console.error('获取失败', error);
     }
   });
   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30

如果是简单的数据存储，同步方法可能更直观。如果是需要处理大量数据或者不希望阻塞主线程的情况，异步方法更合适。