json是前后端数据交互的关键。后端提供的接口中的数据几乎都是通过json来表现的,所以,需要对这个json做一些小结;
这里要推进谷歌的插件Fehelp前端助手,这个可以清楚的看到json的数据;
以如下json数据为例
{ "equipments": [ { "run_status": "1", "name": "空压机1", "data": { "id": "4028817a5c8a9943015caa447ac727f0", "equipment_id": 1, "a_electricity": 113, "shake": 2.5, "rate": 0, "temperature1": 66, "temperature2": 77, "pressure1": 0, "pressure2": -13.9, "pressure3": 0.31, "air_supply_pressure": 0.31, "venting_temperature": 77, "run_time": 15629, "load_time": 14750, "main_a_electricity": 0, "run_status1": "100000000011", "run_status2": "0", "control_status": 0, "oil_filter_used_time": 2941, "oil_distributor_used_time": 0, "air_filter_used_time": 0, "lubricating_oil_used_time": 2941, "lubricating_grease_used_time": 2941, "degree": 269208, "inverter_fault_code": 0, "remark2": null, "remark1": 0, "power": 71, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "load_status": "1", "link_status": 1, "fault": null, "type": 4, "equipment_id": 1 }, { "run_status": "1", "name": "空压机2", "data": { "id": "4028817a5c8a9943015caa447ac827f1", "equipment_id": 2, "a_electricity": 115, "shake": 2.1, "rate": 88.6, "temperature1": 62, "temperature2": 77, "pressure1": 0.428, "pressure2": -10.1, "pressure3": 0.4, "air_supply_pressure": 0.4, "venting_temperature": 77, "run_time": 16060, "load_time": 15996, "main_a_electricity": 143, "run_status1": "100000000011", "run_status2": "0", "control_status": 0, "oil_filter_used_time": 2997, "oil_distributor_used_time": 312, "air_filter_used_time": 88, "lubricating_oil_used_time": 2997, "lubricating_grease_used_time": 2997, "degree": 200835, "inverter_fault_code": 13, "remark2": null, "remark1": 0, "power": 72, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "load_status": "1", "link_status": 1, "fault": { "id": "4028817a5c8a9943015c948cd2734d2f", "type": 1, "has_read": null, "date": "2017-06-11 08:27:55", "equipment_id": 2, "info": "空压机2:[报警]" }, "type": 4, "equipment_id": 2 }, { "run_status": "1", "name": "空压机3", "data": { "id": "4028817a5c8a9943015caa447ac927f2", "equipment_id": 3, "a_electricity": 70, "shake": 0.6, "rate": 17.8, "temperature1": 38, "temperature2": 78, "pressure1": 0.32, "pressure2": -2.6, "pressure3": 0.308, "air_supply_pressure": 0.308, "venting_temperature": 78, "run_time": 6751, "load_time": 6733, "main_a_electricity": 174, "run_status1": "11", "run_status2": "0", "control_status": 0, "oil_filter_used_time": 0, "oil_distributor_used_time": 137, "air_filter_used_time": 775, "lubricating_oil_used_time": 0, "lubricating_grease_used_time": 0, "degree": 376393, "inverter_fault_code": -23017, "remark2": null, "remark1": 0, "power": 43, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "load_status": "1", "link_status": 1, "fault": { "id": "4028817a5ba84088015bb2f9496059a7", "type": 1, "has_read": null, "date": "2017-04-28 13:12:13", "equipment_id": 3, "info": "空压机3:[主电机电流故障, 报警]" }, "type": 4, "equipment_id": 3 }, { "run_status": "1", "name": "空压机4", "data": { "id": "4028817a5c8a9943015caa447acb27f3", "equipment_id": 4, "a_electricity": 68, "shake": 2.5, "rate": 44.8, "temperature1": 66, "temperature2": 68, "pressure1": 0.429, "pressure2": -4.1, "pressure3": 0.41, "air_supply_pressure": 0.41, "venting_temperature": 68, "run_time": 16551, "load_time": 16542, "main_a_electricity": 120, "run_status1": "100000000011", "run_status2": "0", "control_status": 0, "oil_filter_used_time": 3065, "oil_distributor_used_time": 182, "air_filter_used_time": 100, "lubricating_oil_used_time": 3065, "lubricating_grease_used_time": 3065, "degree": 186991, "inverter_fault_code": 22, "remark2": null, "remark1": 0, "power": 38, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "load_status": "1", "link_status": 1, "fault": null, "type": 4, "equipment_id": 4 }, { "run_status": "0", "name": "空压机5", "data": { "id": "4028817a5c8a9943015caa447acc27f4", "equipment_id": 5, "a_electricity": 0, "shake": 0, "rate": 0, "temperature1": 0, "temperature2": 0, "pressure1": 0.409, "pressure2": -100, "pressure3": 0, "air_supply_pressure": 0, "venting_temperature": 0, "run_time": 601, "load_time": 0, "main_a_electricity": 0, "run_status1": "0", "run_status2": "0", "control_status": 0, "oil_filter_used_time": 601, "oil_distributor_used_time": 601, "air_filter_used_time": 601, "lubricating_oil_used_time": 601, "lubricating_grease_used_time": 601, "degree": 0, "inverter_fault_code": 0, "remark2": null, "remark1": 0, "power": 0, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "load_status": "0", "link_status": 1, "fault": null, "type": 4, "equipment_id": 5 }, { "name": "冷干机1", "data": { "id": 4852493, "equipment_id": 6, "m0": 50, "m1": 6.4, "m2": 135, "m3": 150, "m4": 20, "m5": 2, "m6": 1, "m7": 0, "m8": 0, "m9": 0, "m10": 0, "m11": 13.37, "m12": 0, "m13": 0, "m14": 0, "m15": 0, "m16": 0, "m17": 0, "m18": 0, "m19": 15, "m20": 0, "m21": 0, "power": 3, "degree": 10840, "electricity": 6, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "fault": null, "type": 6, "equipment_id": 6 }, { "name": "冷干机2", "data": { "id": 4852494, "equipment_id": 7, "m0": 40, "m1": 15.1, "m2": 135, "m3": 189, "m4": 20, "m5": 2, "m6": 1, "m7": 0, "m8": 0, "m9": 0, "m10": 0, "m11": 12.4, "m12": 0, "m13": 0, "m14": 0, "m15": 0, "m16": 0, "m17": 0.297, "m18": 0, "m19": 20, "m20": 0, "m21": 0, "power": 3, "degree": 17258, "electricity": 11, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "fault": null, "type": 6, "equipment_id": 7 }, { "name": "流量计1", "data": { "id": "4028817a5c8a9943015caa447acd27f5", "equipment_id": 8, "dew_point": -20, "real_time_flow": 1286, "workshop_pressure": 0.423, "flow": 10772462, "iquid_level1": 0, "iquid_level2": 0, "iquid_level3": 0, "iquid_level4": 0, "il_status": 0, "il_alert": 0, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "fault": null, "type": 11, "equipment_id": 8 }, { "name": "流量计2", "data": { "id": "4028817a5c8a9943015caa447ace27f6", "equipment_id": 9, "dew_point": -20, "real_time_flow": 1315, "workshop_pressure": 0.304, "flow": 12162422, "iquid_level1": 0, "iquid_level2": 0, "iquid_level3": 0, "iquid_level4": 0, "il_status": 0, "il_alert": 0, "link_status": 1, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017 }, "fault": null, "type": 11, "equipment_id": 9 }, { "name": "联控箱", "data": { "id": 2426247, "date": 1497505233603, "jc_pressure": 0.31, "jc_load_pressure": 0.001, "jc_unload_pressure": 0.001, "jc_rate": 0, "jc_status": 0, "link_status": "1111100000", "run_status": "11110", "load_status": "11110", "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017, "equipment_id": 10, "electricity": 366 }, "fault": null, "type": 12, "equipment_id": 10 } ], "rooms": [ { "bgl": 9.02, "name": "空压机房", "data": { "id": "4028817a5c8a9943015caa447ad427f9", "room_id": 1, "degree": 1061525, "electricity": 383, "power": 230, "flow": 22934884, "real_time_flow": 2601, "date": 1497505233603, "hour": 2017061513, "day": 20170615, "month": 201706, "year": 2017, "temperature": null, "humidity": null } }, { "bgl": 0, "name": "01号配电房", "data": null }, { "bgl": 0, "name": "02号配电房", "data": null } ] }
这个json数据中包含equipments和rooms两个数组,ajax接受这个json数据之后需要通过JSON.parse方法转换为对象,这样就能访问里面的数据了。然后JSON.parse(data).equipments['i']便可以访问数组里面的数据了。这个数字里面又是对象,可以继续通过'.'语法调用里面的数据;
浏览器端一般情况下,我们可以使用 JSON.parse() 方法将json数据转换为 JavaScript 对象来渲染数据到页面上;
服务器端我们通常可通过JSON.stringify(obj)将对象装换为字符串来使用