六、語句
（一）表達式和語句
1、表達式
表達式是可以被求值的代碼，JavaScript 引擎會將其計算出一個結果。
2、語句
語句是一段可以執行的代碼。
比如： prompt() 可以彈出一個輸入框，還有 if語句 for 循環語句等等
3、區別
表達式：因為表達式可被求值，所以她可以寫成賦值語句的右側
eg：表達式 num = 3 + 4
語句：語句不一定有值，所以比如alert()、for 和 break 等語句就不能被用于賦值
eg：語句 alert()彈出對話框 console.log()控制臺打印輸出
某些情況，也可以把表達式理解為表述語句，因為他是在計算結果，但不是必須的成分（例如continue語句）
（二）分支語句
1、程序三大流程控制語句
順序結構：從上往下執行
分支結構：根據條件選擇執行代碼
循環結構：某段代碼被重復執行
2、分支結構
分支語句可以讓我們有選擇性的執行想要的代碼
2.1 if分支語句
if 語句有三種使用：單分支、雙分支、多分支
1.1 單分支使用語法：
括號內的條件為true時，進入大括號里執行代碼
小括號內的結果若不是布爾類型時，會發生隱式轉換轉為布爾類型
如果大括號只有一個語句，大括號可以省略，但不提倡這么做~
<!-- 單分支使用語法 --><script>if (true) {console.log('執行語句');}// 除了0 所有的數字都為真if (0) {console.log('執行語句');}if ('2') {console.log('執行語句');}// 除了'' 所有的字符串都為真if ('') {console.log('執行語句');}// 單分支課堂案例1：用戶輸入高考成績，如果分數大于700，則提示恭喜考入黑馬程序員let score = prompt('請輸入您的高考成績')if (score > 700) {alert('恭喜考入黑馬程序員！')}</script>1.2 雙分支if 語句
<script>/* 案例一需求：用戶輸入，用戶名：pink，密碼：123456， 則提示登錄成功，否則提示登錄失敗分析：①：彈出輸入框，分別輸入用戶名和密碼②：通過if語句判斷，如果用戶名是pink，并且密碼是123456，則執行if里面的語句，否則執行else里面的語句。*/let myname = prompt('請輸入用戶名')let pd = prompt('請輸入密碼')if (myname === 'pink' && pd === '123456') {alert('登陸成功');} else {alert('登陸失敗');}/* 案例二需求：讓用戶輸入年份，判斷這一年是閏年還是平年并彈出對應的警示框分析：①：能被4整除但不能被100整除，或者被400整除的年份是閏年，否則都是平年②：需要邏輯運算符 */let year = +prompt('請輸入年份')if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {alert(`${year}年是閏年`);} else {alert(`${year}年是平年`);}</script>?1.3 多分支if 語句
使用場景：適合于有多個結果的時候， 比如學習成績可以分為： 優 良 中 差
?
釋義：
- 先判斷條件1，若滿足條件1就執行代碼1，其他不執行
- 若不滿足則向下判斷條件2，滿足條件2執行代碼2，其他不執行
- 若依然不滿足繼續往下判斷，依次類推
- 若以上條件都不滿足，執行else里的代碼n
- 注：可以寫N個條件，但這里演示只寫2個
<script>// 需求：根據輸入不同的成績，反饋不同的評價// 注：// ①：成績90以上是 優秀// ②：成績70~90是 良好// ③：成績是60~70之間是 及格// ④：成績60分以下是 不及格let score = +prompt('請輸入您的成績：')if (score >= 90) {alert('優秀');} else if (score >= 70) {alert('良好')} else if (score >= 60) {alert('及格')} else {alert('不及格')}</script>2.2 三元運算符
使用場景：比 if 雙分支語句更簡單的寫法，可以使用三元表達式
符號：? 與 : 配合使用
語法
條件 ? 滿足條件執行的代碼 : 不滿足條件執行的代碼
// 一般用來取值
<script>// 條件 ? 滿足條件執行的代碼 : 不滿足條件執行的代碼let sum = 3 < 5 ? 3 : 5/* 案例一需求：用戶輸入2個數，控制臺輸出最大的值分析：①：用戶輸入2個數②：利用三元運算符輸出最大值*/let num1 = +prompt('請輸入第一個數')let num2 = +prompt('請輸入第二個數')let max = num1 > num2 ? num1 : num2// num1 > num2 ? alert(`最大值：${num1}`) : alert(`最大值：${num2}`)alert(`最大值：${max}`)/* 案例二需求：用戶輸入1個數，如果數字小于10，則前面進行補0， 比如 09 03 等分析：①：為后期頁面顯示時間做鋪墊②：利用三元運算符 補 0 計算*/let num = +prompt('請輸入一個值')// let age = 18 // age = age+1num = num < 10 ? '0' + num : numalert(num)</script>2.3 switch 語句
釋義：
- 找到跟小括號里數據全等的case值，并執行里面對應的代碼
- 若沒有全等 === 的則執行default里的代碼
- 例：數據若跟值2全等，則執行代碼2
注意事項
1. switch case語句一般用于等值判斷,不適合于區間判斷
2. switch case一般需要配合break關鍵字使用 沒有break會造成case穿透
<script>/* 案例：簡單計算器需求：用戶輸入2個數字，然后輸入 + - * / 任何一個，可以計算結果分析：①：用戶輸入數字②：用戶輸入不同算術運算符，可以去執行不同的運算(switch)*/let num = +prompt('請輸入第一個數字')let num1 = +prompt('請輸入第二個數字')let num2 = prompt('請輸入輸入 + - * / 任何一個')let resultswitch (num2) {case '+':result = num + num1break;case '-':result = num - num1break;case '*':result = num * num1break;case '/':result = num / num1break;default:alert('沒有符合選項')break;}alert(`結果是：${result}`)</script>2.4 if 多分支語句和 switch的區別
共同點
- 都能實現多分支選擇， 多選1
- 大部分情況下可以互換
區別：
- switch…case語句通常處理case為比較確定值的情況，而if…else…語句更加靈活，通常用于范圍判斷(大于，等于某個范圍)。
- switch 語句進行判斷后直接執行到程序的語句，效率更高，而if…else語句有幾種判斷條件，就得判斷多少次
- switch 一定要注意 必須是 === 全等，一定注意 數據類型，同時注意break否則會有穿透效
結論：
- 當分支比較少時，if…else語句執行效率高。
-
當分支比較多時，switch語句執行效率高，而且結構更清晰。
?（三）循環語句
1、 斷點調試
作用：學習時可以幫助更好的理解代碼運行，工作時可以更快找到bug
瀏覽器打開調試界面
- 按F12打開開發者工具
- 點到sources一欄
- 選擇代碼文件
斷點：在某句代碼上加的標記就叫斷點，當程序執行到這句有標記的代碼時會暫停下來
2、while循環
循環：重復執行一些操作
while：在..期間，while循環就是在滿足條件期間，重復執行某些代碼
路徑：while循環基本語法、while循環三要素
2.1 while循環基本語法
釋義：
- 跟if語句很像，都要滿足小括號里的條件為true才會進入 循環體 執行代碼
- while大括號里代碼執行完畢后不會跳出，而是繼續回到小括號里判斷條件是否滿足，若滿足又執行大括號里的代碼，然后再回到小括號判斷條件，直到括號內條件不滿足，即跳出
2.2 while 循環三要素
循環的本質就是以某個變量為起始值，然后不斷產生變化量，慢慢靠近終止條件的過程。
所以，while循環需要具備三要素：
<script>// 1. 變量的起始值let i = 1// 2. 終止條件while (i <= 3) {console.log('我會循環三次');// 3. 變量的變化量i++}/* 案例一在頁面中打印輸出10句“月薪過萬”*/let num = 1while (num <= 10) {document.write('月薪過萬<br>')num++}/* 案例二：頁面輸出1 - 100核心思路： 利用 i, 因為正好和 數字對應*/let num1 = 1;while (num1 <= 100) {document.write(num1)num1++}/* 案例三：計算從1加到100的總和并輸出核心思路：聲明累加和的變量 sum每次把 i 加到 sum 里面*/let num2 = 1;let sum = 0while (num2 <= 100) {sum += num2num2++}document.write(`<br>1-100的和 = ${sum}`)/* 案例四：計算1 - 100之間的所有偶數和核心思路：聲明累加和的變量 sum首先利用if語句把 i 里面是偶數篩選出來把 篩選的 i 加到 sum 里面*/let num4 = 1let sum1 = 0while (num4 <= 100) {if (num4 % 2 === 0) {sum1 += num4}num4++}document.write(`<br>1-100的偶數和：${sum1}`)</script>3、循環退出
3.1 循環結束
- break：退出循環
- continue：結束本次循環，繼續下次循環
3.2 區別：
- continue 退出本次循環，一般用于排除或者跳過某一個選項的時候, 可以使用continue
- break 退出整個循環，一般用于結果已經得到, 后續的循環不需要的時候可以使用
案例：簡易ATM取款機案例
<script>/* 需求：用戶可以選擇存錢、取錢、查看余額和退出功能分析：①：循環的時候，需要反復提示輸入框，所以提示框寫到循環里面②：退出的條件是用戶輸入了 4，如果是4，則結束循環，不在彈窗③：提前準備一個金額預先存儲一個數額④：取錢則是減法操作， 存錢則是加法操作，查看余額則是直接顯示金額⑤：輸入不同的值，可以使用switch來執行不同的操作*/let money = 4000;while (true) {let str = +prompt(`請選擇您的操作：1.取款2.存款3.查看余額4.退出`)switch (str) {case 1:let qu = +prompt('輸入你要取款的金額')money -= qubreak;case 2:let cun = +prompt('輸入你要存款的金額')money += cunbreak;case 3:alert(`您的余額為：${money}`)break;}if (str === 4) {break}}</script>4、for循環
4.1 for循環語法基本使用
作用：重復執行代碼
好處：把聲明起始值、循環條件、變化值學到一起，是最常用的循環形式
<script>//利用for循環輸出1~100歲let sum = 0for (let i = 1; i <= 100; i++) {sum += i}document.write('1-100的和' + sum)// 求1 - 100之間所有的偶數和let sum1 = 0for (let i = 1; i <= 100; i++) {if (i % 2 === 0) {sum1 += i}}document.write('<br>1-100的偶數和' + sum1)// 頁面中打印5個小星星document.write('<br>')for (let i = 1; i <= 5; i++) {document.write('★')}/* for循環的最大價值： 循環數組需求： 請將 數組[‘馬超’，‘趙云’， ‘張飛’, ‘關羽‘，’黃忠’]依次打印出來*/document.write('<br>')let arr = ['馬超', '趙云', '張飛', '關羽', '黃忠']for (let i = 0; i < arr.length; i++) {document.write(arr[i] + ' ')}</script>4.2 退出循環
- continue 退出本次循環，一般用于排除或者跳過某一個選項的時候, 可以使用continue
- break 退出整個for循環，一般用于結果已經得到, 后續的循環不需要的時候可以使用
了解：
- while(true) 來構造“無限”循環，需要使用break退出循環。
- for(;;) 也可以來構造“無限”循環，同樣需要使用break退出循環
4.3 for循環嵌套
一個循環里再套一個循環，一般用在for循環里
