1. 程式人生 > >前端 JS基礎理論總結(六)

前端 JS基礎理論總結(六)

迴圈語句

  • 通過迴圈語句可以反覆的執行一段程式碼多次
while迴圈
			- 語法:
				while(條件表示式){
					語句...
				}
  • while語句在執行時,先對條件表示式進行求值判斷,如果值為true,則執行迴圈體,迴圈體執行完畢以後,繼續對錶達式進行判斷
  • 如果為true,則繼續執行迴圈體,以此類推
  • 如果值為false,則終止迴圈
do...while迴圈
			- 語法:
				do{
					語句...
				}while(條件表示式)
  • 執行流程:

    • do…while語句在執行時,會先執行迴圈體,迴圈體執行完畢以後,在對while後的條件表示式進行判斷,
    • 如果結果為true,則繼續執行迴圈體,執行完畢繼續判斷以此類推
    • 如果結果為false,則終止迴圈
  • 實際上這兩個語句功能類似,不同的是while是先判斷後執行,而do…while會先執行後判斷,do…while可以保證迴圈體至少執行一次,而while不能

  • for語句,也是一個迴圈語句,也稱為for迴圈

  • 在for迴圈中,為我們提供了專門的位置用來放三個表示式:

    • 初始化表示式
    • 條件表示式
    • 更新表示式
  • for迴圈的語法:

for(①初始化表示式;②條件表示式;④更新表示式){
					③語句...
				}
  • for迴圈的執行流程:
    ①執行初始化表示式,初始化變數(初始化表示式只會執行一次)
    ②執行條件表示式,判斷是否執行迴圈。
    如果為true,則執行迴圈③
    如果為false,終止迴圈
    ④執行更新表示式,更新表示式執行完畢繼續重複②

  • 任意一種迴圈都可以互相巢狀

  • 以下是死迴圈的寫法

    • 像這種將條件表示式寫死為true的迴圈,叫做死迴圈
    • 該迴圈不會停止,除非瀏覽器關閉,死迴圈在開發中慎用
    • 可以使用break,來終止迴圈
while(true){
				if(j>10){
					break;//退出整個迴圈
				}
				j++;
			}
for迴圈的死迴圈寫法
			for(;;){
  • break關鍵字可以用來退出switch或迴圈語句
  • 不能在if語句中使用break和continue
  • break關鍵字,會立即終止離他最近的那個迴圈語句
  • continue關鍵字可以用來跳過當次迴圈
  • 同樣continue也是預設只會對離他最近的迴圈迴圈起作用
  • 可以為迴圈語句建立一個label,來標識當前的迴圈,label:迴圈語句
  • 使用break語句時,可以在break後跟著一個label,這樣break將會結束指定的迴圈,而不是最近的

陣列去重

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>陣列去重</title>
	<script type="text/javascript">
		var aRr = [1,3,4,1,6,9,1,2,5,3,1,6,5,4,4];
		var aRr2 = [];

		for(var i=0; i<aRr.length; i++){
			//判斷元素第一次出現的位置,恰好是當前索引時,就將元素放入新陣列
			if(aRr.indexOf(aRr[i]) == i){
				aRr2.push(aRr[i]);
			}
		}

		alert(aRr2);//1,3,4,6,9,2,5
	</script>
</head>
<body>
	
</body>
</html>

字串處理方法

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>字串處理的方法</title>
	<script type="text/javascript">
		/*字串切斷轉成陣列*/
		var sTr = '2018-06-20';
		var aRr = sTr.split('-');
		// alert(aRr);//2018,06,20
		// console.log(aRr);

		var aRr2 = sTr.split('');
		// console.log(aRr2);

		/*實際上就是修改了<title>標籤的內容*/
		// document.title = aRr2;

		var sTr2 = '#div1';
		var sTr3 = '.div1';

		/*獲取指定索引的字元*/
		var sTr4 = sTr2.charAt(0);
		if(sTr4 == '#'){
			// alert('id選擇器');
		}

		/*檢視子串第一次出現的位置*/
		var sTr5 = 'Microsoft Yahei';
		var num = sTr5.indexOf('Yahei');
		// alert(num);//10

		var num2 = sTr5.indexOf('xihei');
		// alert(num2);//沒有找到就彈出-1

		/*substring擷取子串*/
		//從10開始,截到15(包括開始位置,不包括結束位置)
		// var sTr6 = sTr5.substring(10,15);//Yahei
		//從10開始擷取到末尾
		var sTr6 = sTr5.substring(10);//Yahei
		// alert(sTr6);

		/*全部轉為大寫字母*/
		// alert(sTr6.toUpperCase());//YAHEI
		/*全部轉為小寫字母*/
		alert(sTr6.toLowerCase());//yahei
	</script>
</head>
<body>
	
</body>
</html>

字串反轉

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>字串反轉</title>
	<script type="text/javascript">
		var sTr = "123asdf79888asdfe21";
		//1、split字串轉成陣列
		//2、reverse陣列反轉
		//3、join陣列轉成字串
		var sTr2 = sTr.split('').reverse().join('');
		alert(sTr2);//12efdsa88897fdsa321
	</script>
</head>
<body>
	
</body>
</html>