实现搜索历史的记录 （记录到本地存储中）

1. 什么是本地存储： 把数据存储到电脑本地（电脑的某个文件里面 ） 通过浏览器来存储的

2. 有哪些本地存储的方式 ： localStorage sessionStorage

   • localStorage 永久存储 只要不清空浏览器记录和手动删除存储记录 存储是一只存在的

   • sessionStorage 临时存储 当浏览器关闭的时候就自动清空

3. 为什么要使用本地存储来实现搜素历史记录： 搜素历史记录的记录信息永久存储的 类似JD淘宝搜索记录都是保存在本地存储

4. 本地存储 localStorage的使用

   • 获取本地存储的对象

     window.localStorage

   • 使用本地存储对象实现数据存储

     window.localStorage.setItem('键',要存储的值);

   • 使用本地存储来获取存储的数据

     window.localStorage.getItem('键')

   • 注意:本地存储的存储值和获取值都是只能是字符串类形（JSON格式的字符串）

   • 如果需要存储复杂类型的数据比如对象 数组, 就要把对象 数组转换成json格式的字符串, 再存储到本地存储中

     • JSON.stringify(arr) 转成JSON格式的字符串

   • 获取本地存储中的JSON字符串,如果需要使用数组一些方法push(), 把JSON格式字符串转成数组 JSON.parse()

     给数组添加数据 arr.push({'search':'新的值'})

   • 添加了新的值 arr.push({'search':'新的值'})之后, 又要把push之后的数组存储到本地存储中

     window.localStorage.setItem('searchData',JSON.stringify(arr));

   • 本地存储的注意点

     • 本地存储中存储的值只能是字符串类型 存储类型数据 使用JSON.stringify(复杂类型数据) 再存储到本地存储

     • 获取本地存储的值如果是复杂类型的数据的字符串使用JSON.parse(复杂类型字符串) 转成JS能够识别的复杂类型对象 或者数组