频繁ajax请求导致页面响应变慢。 
于是考虑将数据存储在window.storage中,这样只请求一次ajax,而不需要频繁请求。 
鉴于localstorage中只能存储字符串,所以我们要借助于JSON.stringify()和JSON.parse();

$.ajax({
type: "get",
async: "true",
url: "",
data: {},
dataType: "jsonp",
success: function(data){
if(data instanceof Array){
stroage.push(JSON.stringify(data[i])); //storage是外部定义的数组 storage = []
}
},
error: function(){
}
});

现在,我们将data存储在了storage中,当我们需要使用时:

fucntion getData(){
window.localStorage.job = JSON.stringify(storage); //将storage转变为字符串存储
var job = JSON.parse(window.localStorage.job);
for(var i = 0; i < job.length; i++){
job[i] = JSON.parse(job[i]);
}
//此时job中存储的就是对象数组了
}

本地存储外,除了localStorage,还有sessionStorage.

(1)localStorage和sessionStorage都是用来存储客户端临时信息的对象。 
(2)localStorage和sessionStorage都只能存储字符串类型的对象 
(3)localStorage生命周期是永久,除非用户手动清除localStorage信息,否则这些信息将永远存在。 
(4)sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么通过sessionStorage中存储的数据也就被清空了。 
(5)不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的localStorage(页面属于相同域名和端口),但是不同页面或标签页间无法共享sessionStorage的信息。

【转自https://blog.csdn.net/liuyan19891230/article/details/52638408】

在localStorage中存储对象数组并读取的更多相关文章

  1. 【Java】链表中存储对象的问题

    更新: 在一次搜索“变量声明在循环体内还是循环体外”问题时,碰见了一个这样的代码,与本文类似,代码如下: Document [] old ......//这是数据源 EntityDocument[] ...

  2. COM结构化存储中存储对象或者流对象的命名规则

      COM结构化存储中存储对象或者流对象的命名规则

  3. sessionStorage和localStorage中 存储

    转:http://my.oschina.net/crazymus/blog/371757 sessionStorage只在页面打开是起作用, localStorage关闭页面后仍然起作用. 有时候,我 ...

  4. localStorage 如何存储JSON数据并读取JSON数据

    localStorage是HTML5提供的再客户端实现本地存储的一种方法,但是localStorage方法只能存储字符串数据,有时候我们需要存储对象到本地比如:JSON:那么,localStorage ...

  5. C++中的对象数组

    类是对象的抽象,我们可以使用一个类来定义很多的对象,然后每个对象都有自己的属性. 当我们使用类来定义很多相同结构的对象的时候,我们可以采取对象数组的方法. 例如,一个班有50个学生,我们定义了一个学生 ...

  6. vue中,对象数组多层嵌套时,更新数据更新页面

    vue中的对象和数组的元素直接赋值修改时,是不能响应到view中去的 1.对象更新 this.a={title:'列表1’}; this.a.title='列表2’; <h1>{{a.ti ...

  7. 关于mysql中存储json数据的读取问题

    在mysql中存储json数据,字段类型用text,java实体中用String接受. 返回前端时(我这里返回前端的是一个map),为了保证读取出的数据排序错乱问题,定义Map时要用LinkedHas ...

  8. JS中的对象数组

    <html> <head> <title>对象数组的字符串表示</title> <script type="text/javascrip ...

  9. 使用localstorage.setItem()存储对象

    使用localstorage.setItem(name,value)存储JSON对象时会发现浏览器存储的内容为[object,object],并不是我们想要的内容,这是因为我们在存储的时候没有进行类型 ...

随机推荐

  1. Emoji.voto,Linkerd 服务网格(service mesh)的示例应用程序

    一个微服务应用程序,允许用户为他们最喜欢的表情符号(emoji)投票,并跟踪排行榜上收到的投票.愿最好的 emoji 获胜. 该应用程序由以下 3 个服务组成: emojivoto-web:Web 前 ...

  2. 前端开发入门到进阶第三集【js进行url解析】

    https://www.cnblogs.com/yuanzhiguo/p/8241644.html

  3. SpringCloud升级之路2020.0.x版-2.微服务框架需要考虑的问题

    本系列为之前系列的整理重启版,随着项目的发展以及项目中的使用,之前系列里面很多东西发生了变化,并且还有一些东西之前系列并没有提到,所以重启这个系列重新整理下,欢迎各位留言交流,谢谢!~ 上图中演示了一 ...

  4. 大数据学习(16)—— HBase环境搭建和基本操作

    部署规划 HBase全称叫Hadoop Database,它的数据存储在HDFS上.我们的实验环境依然基于上个主题Hive的配置,参考大数据学习(11)-- Hive元数据服务模式搭建. 在此基础上, ...

  5. Prometheus + Alertmanager 实现企微告警

    上一篇:二进制安装Prometheus  下面准备在监控的流程中呈现到告警到企微 查看企业ID,用于后续配置文件 四.安装Alertmanager1.准备安装的包 --选择上面链接给的Linux的ta ...

  6. PS Lite - 源码解读

    PostOffice 类 /** * \brief 系统的中心. */ class Postoffice { public: /** * \brief 返回单例对象. */ static Postof ...

  7. 「必知必会」最细致的 LinkedList 原理分析

    1.结构 1. 继承   该类继承自 AbstractSequentialList 这个是由于他是一个顺序的列表,所以说继承的是一个顺序的 List 2. 实现 这个类实现的接口比较多,具体如下: 首 ...

  8. 教你如何使用FusionInsight SqoopShell

    摘要:Sqoop-shell是一个Loader的shell工具,其所有功能都是通过执行脚本"sqoop2-shell"来实现的. 本文分享自华为云社区<FusionInsig ...

  9. 2010 NOIP提高组题解

    机器翻译 用队列模拟题意即可 #include<cstdio> #include<iostream> #include<cstring> using namespa ...

  10. WinForm设置任务栏托盘程序

    程序设计界面如下图所示: 1.在程序初始化加载的时候设置程序图标,具体code如下: private void Form1_Load(object sender, EventArgs e) { //t ...