当前位置:首页 > JavaScript

js实现九九

2026-03-14 00:33:42JavaScript

js实现九九

使用 JavaScript 实现九九乘法表

方法一:使用双重循环打印九九乘法表

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);
}

方法二:将结果输出到 HTML 页面

document.addEventListener('DOMContentLoaded', function() {
    const table = document.createElement('table');
    for (let i = 1; i <= 9; i++) {
        const row = document.createElement('tr');
        for (let j = 1; j <= i; j++) {
            const cell = document.createElement('td');
            cell.textContent = `${j} × ${i} = ${i * j}`;
            row.appendChild(cell);
        }
        table.appendChild(row);
    }
    document.body.appendChild(table);
});

方法三:使用数组和 map 方法实现

const results = Array.from({ length: 9 }, (_, i) => 
    Array.from({ length: i + 1 }, (_, j) => 
        `${j + 1} × ${i + 1} = ${(i + 1) * (j + 1)}`
    )
);
results.forEach(row => console.log(row.join('\t')));

方法四:使用递归实现

function printMultiplicationTable(row = 1, col = 1) {
    if (row > 9) return;
    if (col > row) {
        console.log('');
        printMultiplicationTable(row + 1, 1);
        return;
    }
    process.stdout.write(`${col} × ${row} = ${row * col}\t`);
    printMultiplicationTable(row, col + 1);
}
printMultiplicationTable();

方法五:使用字符串模板和 join

Array(9).fill().forEach((_, i) => {
    const row = Array(i + 1).fill().map((_, j) => 
        `${j + 1} × ${i + 1} = ${(i + 1) * (j + 1)}`
    ).join('\t');
    console.log(row);
});

以上方法都可以实现九九乘法表,根据不同的需求选择合适的方式。控制台输出适合调试,HTML 输出适合网页展示,递归实现展示了不同的编程思路。

标签: 九九js
分享给朋友:

相关文章

js实现拖拽

js实现拖拽

实现拖拽的基本步骤 通过监听鼠标事件(mousedown、mousemove、mouseup)实现拖拽功能。以下是核心代码逻辑: const draggableElement = document.…

原生js实现轮播图

原生js实现轮播图

基本结构搭建 HTML部分需要包含轮播图容器、图片列表及导航按钮。结构示例如下: <div class="slider-container"> <div class="slid…

js实现图表

js实现图表

在JavaScript中实现图表通常使用流行的图表库,以下是几种常见的方法和工具: 使用Chart.js Chart.js是一个简单灵活的库,适合快速生成响应式图表。安装方式包括CDN引入或npm安…

js实现tab选项卡切换

js实现tab选项卡切换

实现Tab选项卡切换的JavaScript方法 使用纯JavaScript实现Tab切换功能,可以通过监听点击事件动态切换内容显示状态。以下是两种常见实现方式: 基础DOM操作实现 /…

js手势实现

js手势实现

手势识别实现方法 在JavaScript中实现手势识别通常涉及监听触摸事件(touchstart、touchmove、touchend)或鼠标事件(mousedown、mousemove、mouseu…

js实现交换

js实现交换

交换变量的方法 在JavaScript中,交换两个变量的值有多种方法。以下是常见的几种实现方式: 使用临时变量 通过引入一个临时变量来存储其中一个变量的值,实现交换: let a = 1; le…