如何将for循环索引传递给其他函数？加密货币渲染问题

当然可以把for循环的索引传递给另一个函数，你只需要在调用updatePrice时把索引作为额外参数传入，同时修改函数定义来接收这个参数即可。

问题分析 #

你的代码里有两个核心问题：

• 调用updatePrice时没有传递循环索引i，导致函数内部无法获取到这个值
• 更新名称的选择器写错了，缺少索引，应该是#coin${index}name而不是#coinname

修改后的JavaScript代码 #

function getRandomApi() {
  let randomApiUrl = `https://min-api.cryptocompare.com/data/blockchain/list?api_key=850252ca876085a93a414bceb298e21862313b438417b87364eb0fe9aab45e1c`;
  for (let i=1; i<5; i++) {
    fetch(randomApiUrl)
      .then((res) => res.json())
      .then((data) => {
        // 把循环索引i作为第二个参数传给updatePrice
        updatePrice(data, i);
      });
  }
}

// 新增index参数接收循环索引
let updatePrice = function (randomData, index) {
  let keys = Object.keys(randomData.Data);
  let propertyName = keys[Math.floor(Math.random() * keys.length)];
  let symbolName = randomData.Data[propertyName].symbol;
  
  fetch(`https://min-api.cryptocompare.com/data/price?fsym=${symbolName}&tsyms=USD`)
    .then((res) => res.json())
    .then((data) => {
      // 使用传入的index拼接正确的元素ID
      document.querySelector(`#coin${index}price`).innerText = `$${data.USD}`;
      document.querySelector(`#coin${index}name`).innerText = symbolName;
    });
};

补充说明 #

• 用let声明循环变量i已经保证了每次循环的i都是独立的，异步回调不会出现变量污染问题
• 模板字符串${}比字符串拼接更清晰，推荐使用
• 确保你的HTML里存在coin3name、coin3price、coin4name、coin4price这几个元素，否则后两次循环会找不到元素报错

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