js如何实现九九乘法表
实现九九乘法表的方法
使用双重循环
通过嵌套的for循环实现九九乘法表,外层循环控制行数,内层循环控制每行的列数。
for (let i = 1; i <= 9; i++) {
let row = '';
for (let j = 1; j <= i; j++) {
row += `${j} × ${i} = ${i * j}\t`;
}
console.log(row);
}
使用Array.map和Array.join
利用数组的map方法生成每一行的内容,再用join拼接字符串。
Array.from({ length: 9 }, (_, i) => i + 1).forEach(row => {
const line = Array.from({ length: row }, (_, col) => {
const colVal = col + 1;
return `${colVal} × ${row} = ${colVal * row}`;
}).join('\t');
console.log(line);
});
使用模板字符串和repeat
通过模板字符串动态生成每一行的内容,结合repeat控制格式对齐。
for (let i = 1; i <= 9; i++) {
let line = '';
for (let j = 1; j <= i; j++) {
line += `${j}×${i}=${i * j}`.padEnd(8, ' ');
}
console.log(line);
}
输出到HTML页面
将九九乘法表渲染到网页上,动态生成DOM元素。
const table = document.createElement('div');
for (let i = 1; i <= 9; i++) {
const row = document.createElement('div');
for (let j = 1; j <= i; j++) {
row.textContent += `${j} × ${i} = ${i * j} `;
}
table.appendChild(row);
}
document.body.appendChild(table);
使用递归实现
通过递归函数替代循环,逐行生成乘法表内容。

function printMultiplicationTable(row = 1, col = 1, line = '') {
if (row > 9) return;
if (col > row) {
console.log(line);
printMultiplicationTable(row + 1, 1, '');
} else {
line += `${col} × ${row} = ${col * row}\t`;
printMultiplicationTable(row, col + 1, line);
}
}
printMultiplicationTable();
注意事项
- 制表符
\t或padEnd用于对齐输出格式。 - 根据需求选择控制台输出或页面渲染。
- 递归实现需注意终止条件,避免栈溢出。






