本地存储与复杂数据类型转换

最新推荐文章于 2024-07-06 16:47:02 发布

小宇学前端

最新推荐文章于 2024-07-06 16:47:02 发布

阅读量372

点赞数 7

分类专栏： Javascript 文章标签： javascript

本文链接：https://blog.csdn.net/m0_74745356/article/details/134782176

版权

Javascript 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

1. 本地存储介绍

在这里插入图片描述

2.1 本地存储分类 - localStorage

在这里插入图片描述

    // 存储一个名字
    localStorage.setItem('uname', 'abc')
    // 获取名字
    console.log(localStorage.getItem('uname'));
    // 删除本地存储  只删名字
    // localStorage.removeItem('uname')
    // 改
    localStorage.setItem('uname', 'aaa')

    // 存一个年龄   本地存储只能存储字符串
    localStorage.setItem('age', 18)
    console.log(localStorage.getItem('age'));

2.2 本地存储分类 - sessionStorage

在这里插入图片描述

3. 存储复杂数据类型

在这里插入图片描述

const obj = {
      uname: 'aaa',
      age: 18,
      gender: '你爹',
    }

    // 存储复杂数据类型，无法直接使用,变成字符串了
    localStorage.setItem('obj', obj)
    console.log(localStorage.getItem('obj'));

在这里插入图片描述

    // 存储复杂数据类型，无法直接使用,变成字符串了
    // localStorage.setItem('obj', obj)
    // console.log(localStorage.getItem('obj'));

    // 复杂数据类型必须转换为json存储
    localStorage.setItem('obj', JSON.stringify(obj))
    // console.log(localStorage.getItem('obj'));
    // 把json字符串转换为对象
    console.log(JSON.parse(localStorage.getItem('obj')));