Swift 4中全局数组访问及修改问题求助

嘿，我猜你遇到的是异步操作时序问题——这可是处理JSON解析、API请求时最容易踩的坑之一！咱们一步步拆解问题根源和解决办法：

为什么会出现这种情况？ #

大概率你的parseJson()函数里用了fetch()、$.ajax()这类异步方法来获取并解析JSON。这类异步任务不会阻塞代码执行：函数本身会先跑完，而异步任务要等服务器返回数据后才会修改monthlyAvgArray。这就导致你在函数外部访问数组时，异步任务还没完成，数组自然是空的。

举个典型的错误示例，你可以对照看看是不是和你的代码类似：

// 全局数组
let monthlyAvgArray = [];

function parseJson(url) {
  fetch(url)
    .then(res => res.json())
    .then(data => {
      // 这里调试时能看到数组有值，因为这是异步回调里的代码
      monthlyAvgArray = data.monthlyData;
      console.log(monthlyAvgArray); // 能输出数据
    });
}

parseJson('/your-data-url');
console.log(monthlyAvgArray); // 输出空数组！因为fetch的回调还没执行

怎么解决？ #

方法1：用async/await理顺异步逻辑 #

把parseJson()改成异步函数，调用时用await确保数据处理完成后再访问数组：

let monthlyAvgArray = [];

async function parseJson(url) {
  const res = await fetch(url);
  const data = await res.json();
  monthlyAvgArray = data.monthlyData;
}

// 调用时要放在async函数里，或者用.then()兜底
async function initPage() {
  await parseJson('/your-data-url');
  console.log(monthlyAvgArray); // 现在能正常拿到数据了！
  // 这里再执行你的视图渲染逻辑
}

initPage();

方法2：让函数返回Promise，外部通过.then()获取结果 #

如果不想用async/await，也可以让parseJson()返回Promise，外部等待Promise完成后再处理数组：

let monthlyAvgArray = [];

function parseJson(url) {
  return fetch(url)
    .then(res => res.json())
    .then(data => {
      monthlyAvgArray = data.monthlyData;
      return monthlyAvgArray; // 返回处理好的数组
    });
}

parseJson('/your-data-url')
  .then(arr => {
    console.log(arr); // 直接拿到数据
    console.log(monthlyAvgArray); // 全局数组也已经被赋值
    // 在这里执行视图相关操作
  });

方法3：尽量避免全局变量，直接在回调里处理视图逻辑 #

其实更推荐的实践是减少全局变量的使用，直接在异步回调里处理需要用到数组的视图渲染：

function parseJson(url) {
  fetch(url)
    .then(res => res.json())
    .then(data => {
      const monthlyAvgArray = data.monthlyData;
      // 在这里直接调用视图渲染函数，比如：
      renderMonthlyChart(monthlyAvgArray);
    });
}

parseJson('/your-data-url');

快速排查小技巧 #

• 检查parseJson()里的操作是不是异步的：只要有fetch、setTimeout、AJAX请求，基本就是异步时序问题。
• 可以在函数外部访问数组的代码前加个延迟测试：setTimeout(() => console.log(monthlyAvgArray), 2000)，如果延迟后能看到数据，就坐实了异步的锅。

内容的提问来源于stack exchange，提问作者Gina