localStorage会可以将第一次请求的数据直接存储到本地，这个相当于一个5M大小的针对于前端页面的数据库。

注意：在IE8以上的IE版本才支持localStorage这个属性。localStorage属于永久性存储，如果存储内容多的话会消耗内存空间，会导致页面变卡。

具体使用方式如下：

localStorage - 没有时间限制的数据存储

var arr=[1,2,3];

localStorage.setItem("temp",arr);   //存入 参数：1.调用的值 2.所要存入的数据

console.log(localStorage.getItem("temp"));//输出

清空localStorage

localStorage.clear(); //

删除键值对

localStorage.removeItem("arr");

注意：存入的数据只能以字符串形式存入。

下面是关于localStorage的简单使用：

localStorage.a = 3;//设置a为"3"

localStorage["a"] = "sfsf";//设置a为"sfsf"，覆盖上面的值

localStorage.setItem("b","isaac");//设置b为"isaac"

var a1 = localStorage["a"];//获取a的值

var a2 = localStorage.a;//获取a的值

var b = localStorage.getItem("b");//获取b的值

localStorage.removeItem("c");//清除c的值

localStorage提供转JOSN数据方法：

//JSON对象转JSON字符串

var obj = {"a": 1,"b": 2};

obj = JSON.stringify(obj); //转化为JSON字符串

localStorage.setItem("temp2", obj);

//JSON字符串转JSON对象

obj=JSON.parse(localStorage.getItem("temp2"));

【案例】本地排序

以姓名，成绩，当前时间存入本地存储，然后按成绩从高到低排序

// 对象数据

   <script>

    var data = [

        { 'name': '段松', 'score': '100', 'time': '2020-3-20 11:50:21' },

        { 'name': '马云', 'score': '89', 'time': '2020-3-20 11:50:21' },

        { 'name': '马化腾', 'score': '94', 'time': '2020-3-20 11:50:21' },

    ]

     data = [...data,

        { 'name': '雷军', 'score': '99', 'time': '2020-3-20 11:50:21' },

        { 'name': '求伯君', 'score': '73', 'time': '2020-3-20 11:50:21' },

        { 'name': '罗永浩', 'score': '59', 'time': '2020-3-20 11:50:21' }

    ]

    // 把对象转换为字符串格式 进行存储

    var data = JSON.stringify(data);

    localStorage.setItem('info', data);

    // 将本地存储数据取出，并转换为对象

    var info = JSON.parse(localStorage.getItem('info'));

    info.sort(function (a, b) {

        return a.score - b.score

    })

    console.log(info);

</script>