認識 JavaScript (九)

更新於 2024/04/26閱讀時間約 3 分鐘

※ 何謂巢狀迴圈(NESTD LOOP):

指的是一個迴圈內包含另一個迴圈的結構。在程式設計中,這種結構常用於需要進行多層次迭代的場合,例如處理多維數組、逐行逐列處理表格資料等。

※ 例子:九九乘法表

raw-image

說明:

  1. 外層迴圈:for (let i = 1; i <= 9; i = i + 1) 這個迴圈控制乘法表的第一個因數(行),從 1 到 9。
  2. 內層迴圈:for (let j = 1; j <= 9; j = j + 1) 這個迴圈控制乘法表的第二個因數(列),也從 1 到 9。
  3. 使用 模板字串 (Template Strings):使用反引號 ` 來定義,將變量和表達式放在 ${} 中。
  4. ${i} x ${j} = ? 表示將 ij 的值動態插入到字串中。
  5. 當內層迴圈完成一次循環,就會打印出 i 和 j 當前的值,以及乘法的格式。
  6. 當內層迴圈的 j 循環完一輪(從 1 到 9),外層迴圈的 i 增加 1,然後內層迴圈再次從 1 開始,直到 i 也循環完畢。

※ 例子:會員判斷

條件要求:

  • 未登入印出「請登入」
  • 登入印出「已登入」
  • 管理者印出「Admin」
  • VIP會員印出「歡迎光臨」
  • 一般會員印出「Hello」
  • 只要是會員,還有點數則印出「還有xxx點」
  • 只要是會員,沒有點數則印出「請買點」
//參數宣告​
const isLogIn = true //本身是布林值
const role = 'member' //admin, VIP, member
const points = 5

//由於判斷式也是true/false,可以省略isLogIn===true,直接寫成(isLogIn)
//使用巢狀迴圈

if (isLogIn) {
//步驟一:確認是否登入
console.log('已登入')
//步驟二:判斷管理員身分
if (role === 'admin') {
console.log('Admin')
} else {
//步驟三:結果不是管理員身分-->是會員
if (role === 'vip') {
console.log('歡迎光臨')
} else if (role === 'member') {
console.log('Hello')
} else {
console.log('未知角色', role)
}
//步驟四:判斷會員點數
if (points > 0) {
console.log(`還有${points}`)
} else {
console.log('請買點')
}
}
} else {
console.log('請登入')
}
raw-image



    全端網頁開發專業知識分享
    留言0
    查看全部
    avatar-img
    發表第一個留言支持創作者!
    ※ 迴圈(for loop)介紹: 迴圈的用途是重複執行程式碼,只要條件滿足,就會執行特定的動作。 for (let i = 0; i < 10; i = i + 1) { console.log(i); } 說明: for:對於。 let:因為迭代器的數值會一直改變所以要用let
    ※ 常用Object(物件)型態的方法: 拿到object裡面某個key的value(值): 拿到所有屬性: ※ 存取物件屬性:點記法與括號記法 使用點記法 (dot notation) 或括號記法 (bracket notation) 來存取物件的值,以下兩種寫法的結果是一樣的: //
    ※ 常用arry型態的方法: 長度: length 查詢第N個元素: [] 查詢元素在第N個: indexOf( ) 判斷是否為array: isArray() 新增和刪除: push():新增後面的數值 unshift():新增前面的數值 pop():刪除後面的數值 sh
     ※ JavaScript 的命名慣例: 變數名稱是兩個單字以上的組合時,JavaScript 傳統上會採用駝峰命名法(camel case)。也就是將第一個單字之外的接下來每一個字首大寫,例如 myBirthday。 區分大小寫:大小寫是有區分的,如 MyBirthday 與 myBirthd
    ※ 常用number型態的運算方法: 加、減、乘、除 求餘數(mod):% ※ JavaScript 內建的 Math 物件提供了許多number相關的方法和常數。以下是一些常見的內建 Math 功能: Math.PI:算出圓的面積。 Math.ceil:無條件進位 Math.floor
    ※ 認識變數: 變數(variable)是在程式裡面把東西存起來的概念。 基於不讓電腦每次都需要重新運算,把需要花時間運算的東西先存起來,之後再直接拿出來使用,所以我們需要變數。 變數儲存的位置在電腦裡的記憶體。變數就像是一個箱子,記憶體就像是一個倉庫。箱子的名稱就是變數名稱,箱子的內容物就是
    ※ 迴圈(for loop)介紹: 迴圈的用途是重複執行程式碼,只要條件滿足,就會執行特定的動作。 for (let i = 0; i < 10; i = i + 1) { console.log(i); } 說明: for:對於。 let:因為迭代器的數值會一直改變所以要用let
    ※ 常用Object(物件)型態的方法: 拿到object裡面某個key的value(值): 拿到所有屬性: ※ 存取物件屬性:點記法與括號記法 使用點記法 (dot notation) 或括號記法 (bracket notation) 來存取物件的值,以下兩種寫法的結果是一樣的: //
    ※ 常用arry型態的方法: 長度: length 查詢第N個元素: [] 查詢元素在第N個: indexOf( ) 判斷是否為array: isArray() 新增和刪除: push():新增後面的數值 unshift():新增前面的數值 pop():刪除後面的數值 sh
     ※ JavaScript 的命名慣例: 變數名稱是兩個單字以上的組合時,JavaScript 傳統上會採用駝峰命名法(camel case)。也就是將第一個單字之外的接下來每一個字首大寫,例如 myBirthday。 區分大小寫:大小寫是有區分的,如 MyBirthday 與 myBirthd
    ※ 常用number型態的運算方法: 加、減、乘、除 求餘數(mod):% ※ JavaScript 內建的 Math 物件提供了許多number相關的方法和常數。以下是一些常見的內建 Math 功能: Math.PI:算出圓的面積。 Math.ceil:無條件進位 Math.floor
    ※ 認識變數: 變數(variable)是在程式裡面把東西存起來的概念。 基於不讓電腦每次都需要重新運算,把需要花時間運算的東西先存起來,之後再直接拿出來使用,所以我們需要變數。 變數儲存的位置在電腦裡的記憶體。變數就像是一個箱子,記憶體就像是一個倉庫。箱子的名稱就是變數名稱,箱子的內容物就是
    你可能也想看
    Google News 追蹤
    Thumbnail
    徵的就是你 🫵 超ㄅㄧㄤˋ 獎品搭配超瞎趴的四大主題,等你踹共啦!還有機會獲得經典的「偉士牌樂高」喔!馬上來參加本次的活動吧!
    Thumbnail
    隨著理財資訊的普及,越來越多台灣人不再將資產侷限於台股,而是將視野拓展到國際市場。特別是美國市場,其豐富的理財選擇,讓不少人開始思考將資金配置於海外市場的可能性。 然而,要參與美國市場並不只是盲目跟隨標的這麼簡單,而是需要策略和方式,尤其對新手而言,除了選股以外還會遇到語言、開戶流程、Ap
    Thumbnail
    這篇內容,將會講解什麼是「repeat迴圈」,以及與「repeat迴圈」相關的知識。包括repeat迴圈的簡介、break、continue。
    Thumbnail
    這篇內容,將會講解什麼是「while迴圈」,以及與「while迴圈」相關的知識。包括while迴圈的簡介、while迴圈、break、continue。
    Thumbnail
    for loop、while loop、repeat
    Thumbnail
    本章節主要介紹了JavaScript中的流程控制,包括條件語句(如if、else if、else和三元運算子)和循環結構(如for迴圈、while迴圈等)。同時,也提供了如何使用break、continue和label來控制迴圈的執行。
    Thumbnail
    這篇文章,會帶著大家複習以前學過的數列DP框架, 並且以費式數列、爬樓梯、骨牌拚接的應用與遞迴數列概念為核心, 貫穿一些相關聯的題目,透過框架複現來幫助讀者理解這個演算法框架。 數列DP與遞迴數列常見的形式 如果是遞迴數列,常常看到以函數型式表達
    Thumbnail
    這篇文章,會帶著大家複習以前學過的前綴和框架, 並且以區間和的概念與應用為核心, 貫穿一些相關聯的題目,透過框架複現來幫助讀者理解這個演算法框架。 前綴和 prefix sum框架 與 區間和計算的關係式 接下來,我們會用這個上面這種框架,貫穿一些同類型,有關聯的題目 (請讀者、或觀眾
    Thumbnail
    這篇文章,會帶著大家複習以前學過的遞回框架, 並且鏈結串列的概念與應用為核心, 貫穿一些相關聯的題目,透過框架複現來幫助讀者理解這個演算法框架。 遞回框架 尋找共通模式(common pattern),對應到演算法的General case 確立初始條件(initial conditio
    Thumbnail
    for,while,do while語法介紹 for loop for比較偏向固定圈數型的迴圈 語法 for(計數變數初值; 布林運算式 ; 增量運算) { : 一般指令; : }
    Thumbnail
    巢狀迴圈For loop介紹結構及範例說明 巢狀迴圈 巢狀迴圈是在一個迴圈內包含另一個迴圈的結構 簡單來說,就是內迴圈做完,才會在跑到外迴圈,接著在做內迴圈
    Thumbnail
    徵的就是你 🫵 超ㄅㄧㄤˋ 獎品搭配超瞎趴的四大主題,等你踹共啦!還有機會獲得經典的「偉士牌樂高」喔!馬上來參加本次的活動吧!
    Thumbnail
    隨著理財資訊的普及,越來越多台灣人不再將資產侷限於台股,而是將視野拓展到國際市場。特別是美國市場,其豐富的理財選擇,讓不少人開始思考將資金配置於海外市場的可能性。 然而,要參與美國市場並不只是盲目跟隨標的這麼簡單,而是需要策略和方式,尤其對新手而言,除了選股以外還會遇到語言、開戶流程、Ap
    Thumbnail
    這篇內容,將會講解什麼是「repeat迴圈」,以及與「repeat迴圈」相關的知識。包括repeat迴圈的簡介、break、continue。
    Thumbnail
    這篇內容,將會講解什麼是「while迴圈」,以及與「while迴圈」相關的知識。包括while迴圈的簡介、while迴圈、break、continue。
    Thumbnail
    for loop、while loop、repeat
    Thumbnail
    本章節主要介紹了JavaScript中的流程控制,包括條件語句(如if、else if、else和三元運算子)和循環結構(如for迴圈、while迴圈等)。同時,也提供了如何使用break、continue和label來控制迴圈的執行。
    Thumbnail
    這篇文章,會帶著大家複習以前學過的數列DP框架, 並且以費式數列、爬樓梯、骨牌拚接的應用與遞迴數列概念為核心, 貫穿一些相關聯的題目,透過框架複現來幫助讀者理解這個演算法框架。 數列DP與遞迴數列常見的形式 如果是遞迴數列,常常看到以函數型式表達
    Thumbnail
    這篇文章,會帶著大家複習以前學過的前綴和框架, 並且以區間和的概念與應用為核心, 貫穿一些相關聯的題目,透過框架複現來幫助讀者理解這個演算法框架。 前綴和 prefix sum框架 與 區間和計算的關係式 接下來,我們會用這個上面這種框架,貫穿一些同類型,有關聯的題目 (請讀者、或觀眾
    Thumbnail
    這篇文章,會帶著大家複習以前學過的遞回框架, 並且鏈結串列的概念與應用為核心, 貫穿一些相關聯的題目,透過框架複現來幫助讀者理解這個演算法框架。 遞回框架 尋找共通模式(common pattern),對應到演算法的General case 確立初始條件(initial conditio
    Thumbnail
    for,while,do while語法介紹 for loop for比較偏向固定圈數型的迴圈 語法 for(計數變數初值; 布林運算式 ; 增量運算) { : 一般指令; : }
    Thumbnail
    巢狀迴圈For loop介紹結構及範例說明 巢狀迴圈 巢狀迴圈是在一個迴圈內包含另一個迴圈的結構 簡單來說,就是內迴圈做完,才會在跑到外迴圈,接著在做內迴圈