初級 免費 ⏱ 8m28s

8-2 Lab02 如何用 JS 寫一個九九乘法表| 間隔如何用 tab 實作 | 如何 console.log 不換行 |

Lesson: 8-2 Lab02 如何用 JS 寫一個九九乘法表| 間隔如何用 tab 實作 | 如何 console.log 不換行 |

JavaScript

8-2 Lab02 如何用 JS 寫一個九九乘法表| 間隔如何用 tab 實作 | 如何 console.log 不換行 |

Original: https://course.andys.pro/Javascript-Intro/08-2-lab02-how-to-use-js-to-write-a-nine-nine-nine-multiplication-table-or-how-to-implement-the-interval-with-tabs-or-how-to-consolelog-without-line-break-or/

講義

1. 巢狀迴圈 (Nested Loops)

要實作九九乘法表,我們需要「兩層」迴圈:

  • 外層迴圈:控制被乘數(例如 2 到 9)。
  • 內層迴圈:控制乘數(例如 1 到 9)。
  • 流程:當外層跑 1 次,內層會完整跑完 9 次(1~9),然後外層再跳下一號。

2. 實作技巧:如何不換行?

在 JavaScript 中,每次呼叫 console.log() 都會自動換行。若要將 2x1 到 2x9 印在同一行,可以:

  1. 宣告一個空字串變數 var result = "";
  2. 在內層迴圈中將結果不斷累加到該字串:result += i + "x" + j + "=" + (i*j);
  3. 當內層迴圈結束(印完一行)後,再執行一次 console.log(result)

3. 使用 \t (Tab) 自動對齊

由於乘法結果有單位數(如 4)與雙位數(如 12)之分,直接加空格會導致排版歪掉。

  • 使用跳脫字元 \t 可以讓系統自動對齊到下一個固定間隙,確保表格整齊。
  • 範例:result += (i*j) + "\t";

4. 範例邏輯

for (var i = 2; i <= 9; i++) {
    var line = ""; // 用來儲存每一行的內容
    for (var j = 1; j <= 9; j++) {
        line += i + "x" + j + "=" + (i * j) + "\t";
    }
    console.log(line); // 印出一整行
}

影片逐字稿 (AI 生成)

我們現在來講一下LAB02那我們要來做99乘法表那其實我們前面已經學會了FOR回圈可是當我們開始會用的時候LAB卻給我們一個這麼難的問題好 那沒關係 我就帶大家來做一次那當我們會用一個回圈的時候呢我們99乘法表是不是會有兩個變量會 你看 我們直著看直著看是什麼23456789直著看是直著看是23456789橫著看是123456789那除了這樣子以外呢還有另外一個問題老師這邊是一個位數這邊是這排版怎麼排注意排版不知道怎麼排啊 對不對好 那首先我們來看就是我剛剛前面的寫法就是 首先我們用兩個回圈我們現在看我們用兩個回圈來做第一個是我要從2少到小於10就是2到9然後他是I OKOK那我們先把這裡先註解掉然後把I印出來那邊錯了好 他會跑23456789嘛 對不對好 他會跑23456789嘛 對不對所以我們是把我們的23456789做完了再來呢 我們要做的事情是我們想要就是有另外一個是J可是這個J是在這邊這樣子跟著我一起這樣在做好 那我們是不是就開另外一個4回圈然後我們這邊也console log然後為了確保我們知道這個是什麼東西所以我們用I冒號I然後我這邊用console log我這邊用logJ然後J冒號然後加J好那這邊呢 大家可以想像當我I等於2的時候是我跑進來先印了一次I然後2印出來然後這邊這個4回圈會什麼1到9對不對然後他會一直跑一直跑一直跑一直跑當他這個回圈跑完結束以後他到這裡I又再加1變3然後這邊1到9再跑一次裡面再跑的時候1到9再跑一次那我們那我們就是說破嘴不如跑斷腿我們直接跑一次看看先記得存檔跑下來會怎樣I等於2然後123456789I等於3I3然後123456789對不對OK這樣子是不是大概知道要幹嘛可是老師那樣還是有點複雜對不對沒關係 那我們我們看我們可不可以把它做成就是比如說像是呃我們學會了什麼我們學會了字串相加對不對那我們怎麼做我們是不是想要做成像是這樣子的形式I乘以J等於I乘J等於I乘J所以我們怎麼做變數I加上它的乘不是米字號它的乘是X有時候很討厭喔有時候如果是像我們比賽的時候你這個X要看大小血要看得很清楚這是小血的樣子好我剛才好像打很大血X然後加J變數對不對再加等於是自竄好然後加嗯它被弄掉了它被弄掉了現在還順嗎現在還有動嗎可以好加I乘以J好我們存檔我們跑跑看有沒有2x12224這樣就出來了有沒有好這樣出來以後再來就是排版的問題那我剛剛自己也是一直遇到這個問題喔我可以直接拿給大家看你看我一直遇到這個問題對不對就是我自己也不知道怎麼讓Console Log不換它那其實有另外一個寫法是用Node.js的寫法要用ProcessSTD out可是我覺得我不想用那個方法那我們可以用另外一種思維去想這件事情我如果一行每次Console Log一定會有一個換行那我是不是可以把這些句子再把它加在一起等到我要換行的時候再一次把那個很長一串的東西一串對不對組合組合組合組合組合組合組合組合印出來好那我們的做法就是我叫做叫它叫做Single Line剛開始沒有任何東西那我把剛剛印出來的這個東西我每一次都把它加進去加進去加進去當我加完了以後呢我加完了以後我是不是當I從2跳到3的時候我再印出來一次那我們看一下它考成怎樣它是不是長這樣對不對我2乘1等於2然後再加上剛剛的2乘22乘22乘2等於4對不對這樣加上去所以老師你這好醜喔怎麼沒有分格好 我們分格然後我覺得它要分幾格我也不知道反正應該4格吧好不好我們說4格1 2 3 4然後我們跑所以更接近了老師怎麼歪掉了對不對那當然你也可以去去算這個數是不是因為我們這裡還簡單嘛對不對它是100以內嘛它都是雙位數嘛我們可以去算前面是不是如果是單格我們就給它多補一個空格補一個空格補一個空格這邊要補空格這邊要補空格但是我們不想要那麼複雜還記得我們前面有一個用法叫做TabTab有一個好處是它自動的對齊它4格它會自動對齊那它對齊的方式是假如它會跳到的是同樣一個位置就它會自動它不一定一定是4格它就是Tab比如說它就會補一個比如說這邊是什麼1乘以1然後2乘以2對不對然後你這邊是可能到下面欸9都沒有看2乘以2乘以4然後這是6乘以2等於12它這邊會差一個它這邊補一個Tab補一個Tab它這邊的起頭點會是一樣的好那還記得Tab怎麼做嗎反斜線T反斜線T好反斜線T以後呢我們存檔然後跑一次好了它這樣它就對齊了OK好那大家不要怕我會放上去好不好不過因為我就是我沒有就是在CoreLab如果你們要交我不知道CoreLab要不要交這個如果要交的話可能我不知道它的空格是不是也是用Tab可是反正我先放上來好就是這個Lab就是這個Lab就是這個Lab

影片逐字稿largev2

我們現在來講一下lab02那我們要來做九九乘法表那其實我們前面已經學會了for回圈可是當我們開始會用的時候lab卻給我們一個這麼難的問題好那沒關係我就帶大家來做一次那當我們會用一個回圈的時候呢我們九九乘法表是不是會有兩個變量會你看我們直著看直著看是什麼23456789直著看是直著看是23456789橫著看是123456789那除了這樣子以外呢還有另外一個問題老師這邊是一個位數這邊是這排版怎麼排注意排版不知道怎麼排那首先我們來看我剛剛前面的寫法首先我們用兩個回圈所以我用兩個回圈來做第一個是我要從2少到小於10就是2到9然後它是iok那我們先把這裡先註解掉然後把i印出來從哪跑哪邊錯了它會跑23456789嘛所以我們是把23456789做完了再來呢我們要做的事情是有另外一個是j可是這個j是在這邊跟著我一起在做那我們是不是就開另外一個for回圈然後這邊也console.log然後為了確保我們知道這個是什麼東西所以我們用i冒號i然後我這邊用console.logj然後j冒號然後加j那這邊呢大家可以想像當我i等於2的時候是我跑進來先印了一次i然後2印出來然後這邊這個for回圈會什麼1到9對不對然後它會一直跑一直跑一直跑當它這個回圈跑完結束它到這裡i又再加1變3然後這邊1到9再跑一次裡面再跑的時候1到9再跑一次那我們就是說破嘴不如跑斷腿我們直接跑一次看看先記得存檔跑下來會怎樣i等於2然後123456789i等於3i是3然後123456789對不對這樣子是不是大概知道要幹嘛可是老師那還是有點複雜沒關係那我們試試看我們可不可以把它做成就是比如說像是我們學會了什麼我們學會了自串相加對不對那我們怎麼做我們是不是想要做成像是這樣子的形式i乘以j等於i乘j所以我們怎麼做變數i加上它的乘不是米字號它的乘是x有時候很討厭喔有時候如果是像我們比賽的時候你這個x要看大小寫要看得很清楚這是小寫的樣子我剛好像打很大寫x然後加j變數對不對再加等於是自串然後再加現在還順嗎可以加i乘以j好我們存檔我們跑跑看有沒有二乘一二二二四這樣就出來了這樣出來以後那我剛剛自己也是一直遇到這個問題我可以直接打給大家看就是我自己也不知道怎麼讓console log不換行那其實有另外一個寫法是用nodejs的寫法要用processstdout可是我覺得我不想用那個方法那我們可以用另外一種思維去想這件事情我如果一行每次console log一定會有一個換行那我是不是可以把這些句子再把它加在一起等到我要換行的時候再一次把那個很長一串的東西一串組合組合組合組合組合組合好那我們的做法就是叫它叫做single line剛開始沒有任何東西那我把剛剛印出來的東西我每一次都把它加進去加進去當我加完了以後呢我加完了以後我是不是當i從2跳到3的時候我再印出來一次那我們看一下它跑成怎樣它是不是長這樣對不對我2乘1等於2然後再加上2乘2乘2等於4這樣加上去老師你這好醜喔怎麼沒有分格好我們分格然後我覺得它要分幾格我也不知道反正應該4格吧我說4格1.2.3.4然後我們跑欸更接近了老師怎麼歪掉了對不對那當然你也可以去去算這個數是不是因為我們這裡還簡單嘛它是100以內嘛它都是雙位數嘛我們可以去算前面是不是如果是單格我們就給它多補一個空格補一個空格補一個空格這邊要補空格這邊要補空格但是我們不想要那麼複雜還記得我們前面有一個用法叫做tab就是它自動的對齊它4格它自動對齊那它對齊的方式是假如它會跳到的是同樣一個位置就它會自動它不一定一定是4格它就是tab它就補一個譬如說這邊是什麼1乘以1然後2乘以2對不對然後你這邊是2乘以2等於42乘以2等於4然後這是6乘以2等於12這邊會差一個它這邊補一個tab補一個tab它這邊的起頭點會是一樣的那還記得tab怎麼做嗎反斜線t反斜線t反斜線t以後呢我們存檔然後跑一次好了它這樣它就對齊了ok好那大家不要怕我會放上去好不好不過因為我就是我沒有就是在core lab如果你們要教我不知道core lab會不會教這個如果要教的話可能我不知道它的空格是不是也是用tab反正我先放上來這是這個lab