为何我的JavaScript乘法表函数中for循环仅返回数组最后一个元素？

这是个非常典型的新手误区，我来帮你拆解清楚问题所在，再给你几个可行的解决方案~

问题根源 #

首先要明确return和console.log的本质区别：

• console.log只是输出内容到控制台，不会影响函数的执行流程，所以你的循环能从头到尾跑完，每一次循环都输出一行结果。
• return是终止函数并返回值：如果你在循环里直接把console.log换成return，函数会在第一次循环时就立刻停止执行，只返回第一行结果；但你说返回的是最后一行，说明你大概率是把每一行的结果存在了一个变量里，循环结束后才执行return——这时候循环里每次都会覆盖变量的内容，最后变量里只保留了最后一次循环生成的字符串，所以返回的自然只有最后一行。

正确的实现方式 #

你需要把所有行的字符串先收集起来，最后一次性返回完整的拼接结果。这里给你两种常用的实现方式：

方式1：用数组收集后拼接（更清晰易维护） #

function multiTable(number) { 
  const lines = [];
  // 直接循环1到10，不用预先定义数组更高效
  for(let i = 1; i <= 10; i++) { 
    const product = i * number;
    // 用模板字符串让代码更简洁可读
    lines.push(`${i} * ${number} = ${product}`);
  }
  // 用空格把所有行连接成一个完整字符串
  return lines.join(' ');
}

方式2：直接拼接字符串（性能略优，适合简单场景） #

function multiTable(number) { 
  let result = '';
  for(let i = 1; i <= 10; i++) { 
    const product = i * number;
    // 处理空格：第一行前面不加空格，后续行前面加空格
    if (i !== 1) {
      result += ' ';
    }
    result += `${i} * ${number} = ${product}`;
  }
  return result;
}

额外小提示 #

• 循环里的i一定要用let声明，不然会变成全局变量，可能导致后续代码出现奇怪的问题。
• 模板字符串（用`包裹的字符串）比传统的+拼接字符串更易读，也更不容易出错。

内容的提问来源于stack exchange，提问作者John Andrei Gayeta