关于本地存储

作用: 数据可以长期保留在本地浏览器中，刷新页面和关闭页面，数据也不会丢失

特性：以键值对的形式存储，并且存储的是字符串， 省略了window

语法：

存储数据   localStorage.setItem(key, value)

参数1：存储的键名，给你存储的数据起个名字key： value

参数2：存储的值，必须是字符串，如果不是会自动转成字符串

例   localStorage.setItem('name', '小亚亚')

读取数据  localStorage.getItem(key)

参数：要读取的键名，当时存储用的key

例   console.log(localStorage.getItem('name'))

删除数据  localStorage.removeItem(key)

参数：要删除的键名

例   localStorage.removeItem('name')

显示位置

localStorage 只能存储字符串, 如果传入其他类型会自动转为字符串

JSON字符串：

首先是1个字符串

属性名使用双引号引起来，不能单引号

属性值如果是字符串型也必须双引号

1. localStorage 如何存储复杂数据类型？

把对象转换为JSON字符串。 JSON.stringify

        const goods = {

            name:'小米10',

            price:1999}

        localStorage.setItem('goods',JSON.stringify(goods))

2. localStorage 如何读取复杂数据类型？

把JSON字符串转换为对象。JSON.parse()

       const goods = {

            name:'小米10',

            price:1999}

        // localStorage.setItem('goods',JSON.stringify(goods))

        const obj=JSON.parse(localStorage.getItem('goods'))

       console.log(obj);

    let obj = {

      name: '小亚亚',

      age: 18

    }

    // 不行, 存储的是 [object Object]

    // localStorage.setItem('obj', obj)

    // console.log(obj.toString())

    // 将对象转成 JSON 格式的字符串

    // 对象 => JSON 字符串

    // console.log(JSON.stringify(obj))

    localStorage.setItem('obj', JSON.stringify(obj))

   

    let arr = [1, 2, 3]

    // localStorage.setItem('arr', arr)

    // console.log(arr.toString())

    localStorage.setItem('arr', JSON.stringify(arr))

    // 取出 JSON 字符串

    let result = localStorage.getItem('obj')

    // 取出来的是字符串, 所以还需要转换成对象

    // JSON 字符串 => 对象

    console.log(JSON.parse(result))

本地存储分类- sessionStorage（了解）

特性：

用法跟localStorage 基本相同

区别是：当页面浏览器被关闭时，存储在 sessionStorage 的数据会被清除

获取：sessionStorage.getItem(key)

删除：sessionStorage.removeItem(key)

存储：sessionStorage.setItem(key, value