JSON.parse(JSON.stringify(obj))我們一般用來深拷貝，其過程說白了，就是利用 JSON.stringify 將js對象序列化（JSON字符串），再使用JSON.parse來反序列化（還原）js對象。至于這行代碼為什么能實現(xiàn)深拷貝，以及它有什么局限性等等，不是本文要介紹的。本文要探究的是，這行代碼的執(zhí)行效率如何？如果隨意使用會不會造成一些問題？

先上兩個js性能測試的依賴函數(shù)

/** * 一個簡單的斷言函數(shù) * @param value {Boolean} 斷言條件 * @param desc {String} 一個消息 */function assert(value, desc) {  let li = document.createElement('li');  li.className = value ? 'pass' : 'fail';  li.appendChild(document.createTextNode(desc));  document.getElementById('results').appendChild(li);}

/** * 一個測試套件，定時器是為了多次執(zhí)行減少誤差 * @param fn {Function} 需要多次執(zhí)行的代碼塊（需要測試、比對性能的代碼塊） * @param config {Object} 配置項，maxCount: 執(zhí)行代碼塊的for循環(huán)次數(shù)，times: 定時器執(zhí)行次數(shù) */function intervalTest(fn, config = {}) {  let maxCount = config.maxCount || 1000;  let times = config.times || 10;  let timeArr = [];  let timer = setInterval(function () {    let start = new Date().getTime();    for (let i = 0; i < maxCount; i++) {      fn.call(this);    }    let elapsed = new Date().getTime() - start;    assert(true, 'Measured time: ' + elapsed + ' ms');    timeArr.push(elapsed);    if (timeArr.length === times) {      clearInterval(timer);      let average = timeArr.reduce((p, c) => p + c) / times;      let p = document.createElement('p');      p.innerHTML = `for循環(huán)：${maxCount}次，定時器執(zhí)行：${times}次，平均值：${average} ms`;      document.body.appendChild(p);    }  }, 1000);}

定義一些初始數(shù)據(jù)

let jsonData = {  title: 'hhhhh',  dateArr: [],  series: [    {      name: 'line1',      data: []    },    {      name: 'line2',      data: []    },    {      name: 'line3',      data: []    },  ]};let res = [  {    name: 'line1',    value: 1  },  {    name: 'line2',    value: 2  },  {    name: 'line3',    value: 3  },];

場景1：模擬真實環(huán)境中圖表數(shù)據(jù)實時更新

數(shù)據(jù)處理函數(shù)

/** * 處理json數(shù)據(jù)的函數(shù)。模擬真實環(huán)境中圖表數(shù)據(jù)實時更新 * @param lastData {Object} 上一次的數(shù)據(jù) * @param res {Array} 當前數(shù)據(jù) * @returns data 處理完成后的結(jié)果集 */function handleJsonData(lastData, res) {  // 1. 使用 JSON.parse(JSON.stringify()) 深拷貝  let data = JSON.parse(JSON.stringify(lastData));  // 2. 不使用JSON序列化，直接修改參數(shù)  // let data = lastData;  if (data.dateArr.length > 60) {    data.dateArr.shift();    for (let i = 0; i < data.series.length; i++) {      data.series[i].data.shift();    }  }  data.dateArr.push(new Date().toTimeString().substr(0, 8));  for (let i = 0; i < data.series.length; i++) {    data.series[i].data.push(res[i].value);  }  return data;}