ホームページ >ウェブフロントエンド >jsチュートリアル >JSループ学習:whileループ文の使用(詳細例)

JSループ学習:whileループ文の使用(詳細例)

青灯夜游
青灯夜游オリジナル
2022-08-03 18:04:318417ブラウズ

JSループ学習:whileループ文の使用(詳細例)

ループとは、1 つのことを繰り返し実行することです。コードを記述するプロセスでは、一部のデータを走査したり、文字列を繰り返し出力したりするなど、繰り返し実行する必要がある操作に遭遇することがよくあります。 1行ずつ書くのは面倒なので、このような繰り返しの操作はループを使って完了させましょう。

ループの目的は、特定のコードを繰り返し実行することです。ループを使用すると、プログラミングの負担が軽減され、コードの冗長性が回避され、開発効率が向上し、後のメンテナンスが容易になります。 while ループは JavaScript で提供される最も単純なループ ステートメントです。while ループと do-while ループの使い方について学びましょう。

1: while ループ

while ループ文は when type ループ文で、最初にループ条件が判定されます。満たされた場合はループ本体を実行し、満たされない場合は停止します。

関数: 指定された条件が真でなくなるまで操作を繰り返します。

機能: 最初に式を判定し、式の結果が true の場合に対応するステートメントを実行します。

1. JS while ループ構文

while(表达式){    //表达式为循环条件
     // 要执行的代码
}

ステートメント分析:

  • 最初に「」を計算します。式 値が true の場合、ループ本体内の「PHP 文ブロック」が実行されます;

    説明: 「式」の計算結果はブール型 (TRUE または FALSE) になります。他の型も自動的にブール値に変換されます (PHP は弱い言語型であり、変数の値に基づいて変数を正しいデータ型に自動的に変換するため)。

    「ステートメント ブロック」は、{ } で囲まれた 1 つ以上のステートメントの集合です。ステートメント ブロックにステートメントが 1 つしかない場合は、 を省略することもできます。 { }

  • #実行終了後、式に戻って式の値を再度計算して判定し、式の値が true の場合は引き続き実行します。 "ステートメント ブロック" ...このプロセスは、式の値が false になるまで

  • 繰り返してから、ループから抜け出して while 以下のステートメントを実行します。

while ステートメントのフローチャートは次のとおりです。

JSループ学習:whileループ文の使用(詳細例)

通常、「式」は次のとおりです。比較を使用した演算子または論理演算子で計算された値

サンプルコードは次のとおりです。

<script>
var i = 1;
while( i <= 5) {
    document.write(i+", ");
    i++;
}
</script>

JSループ学習:whileループ文の使用(詳細例)

#注意事項ループ ステートメントを作成するときは、条件式の結果が false (つまり、ブール値 false) になる可能性があることを必ず確認してください。式の結果が true である限り、ループは永遠に継続し、自動的に停止することはないため、このような自動的に停止できないループのことを、通常、「無限ループ」または「無限ループ」と呼びます。

誤って無限ループを作成すると、ブラウザまたはコンピュータがフリーズする可能性があります。

式が常に true で、ループ条件が常に true の場合、while ループは実行を続けて終了せず、「無限ループ」になります。

var i = 1;
while(i){
    console.log(i);
}

プログラムの実行後、変数ユーザーが強制的に閉じるまで、常に

i

の値が出力されます。

JS while ループの例

[例 1] while ループを使用して 1 ~ 100 のすべての整数の合計を計算します。

<script>
var i = 1;
var sum=0;
while(i<=100){
	sum+=i;
	i++;
}
console.log("1加到100的值为:"+sum);
</script>

出力結果:


JSループ学習:whileループ文の使用(詳細例)[例 2] 1900 年から 2020 年までの閏年をすべて検索し、1 行に 6 個として出力します。

<script>
var i = 1900;
var count = 0; //计数闰年的个数
while (i <= 2020) {
    //判断是否是闰年
    if (i % 4 == 0 && i % 100 != 0 || i % 400 == 0) {
        document.write(i + "  ");
        count++;
        if (count % 6 == 0) {
            document.write("<br/>");
        }
    }
    i++;
}
</script>

JSループ学習:whileループ文の使用(詳細例)

2. JS while ループのネスト構造 while ループはネスト効果も実現できます。つまり、while ループ内で 1 つ以上をネストできます。 while ループ。

文法形式:

while(条件1){
     // 条件1成立执行的代码

     while(条件2){
          // 条件2成立执行的代码
           ......
     }
}

要約:

ネストとは包含を意味します。いわゆる while ループのネストは while 内にあります。ネストされた while を記述するには、各 while の基本構文が前の構文と同じであるということです。 ここでは、2 つの while ループのネストを定義していますが、もちろん、while ループは必要なだけネストできます。

while ループの実行処理を理解する

内側のループの実行が完了すると、次の外側のループの条件判定が実行されます。

JSループ学習:whileループ文の使用(詳細例)#例 1: ループのネストを使用して、カウンターを出力します

<script type="text/javascript">
	var i = 0;
	while(i < 2){
	   console.log("i =", i);
	   var j = 0;
	   while(j < 2){
		console.log("\tj =", j);
		j += 1;
	   }
	   i++;
	}
	console.log("Over");
</script>

首先,我们定义了一个最外层的 while 循环嵌套,计数器 变量 i 从 0 开始,结束条件是 i

在最外层循环的里面,同时又定义了一个内部循环,计数器变量 j 从 0 开始,结束条件是 i

while循环嵌套总结

JavaScript 的 while 循环也可以实现嵌套的效果,即 while 循环里面嵌套一个或多个 while 循环。

示例2:

<script>
/*
1. 循环打印3次媳妇,我错了
2. 刷碗
3. 上面是一套惩罚,这一套惩罚重复执行3天----一套惩罚要重复执行---放到一个while循环里面
*/
var j = 0
while(j < 3){
    var i = 0
    while(i < 3){
        document.write(&#39;媳妇,我错了<br>&#39;)
        i += 1;
	}
    document.write(&#39;刷碗<br>&#39;)
	document.write(&#39;一套惩罚就结束了!!!!!!!!!!!!<br>&#39;)
    j += 1;
}
</script>

JSループ学習:whileループ文の使用(詳細例)

二:do-while循环

除了while循环,还有一种 do-while 循环。

do-while循环语句是一种“直到型”循环语句,它是先在执行了一次循环体中的“语句块”之后,然后再对循环条件进行判断,如果为真则继续循环,如果为假,则终止循环。

因此:不论表达式的结果,do-while循环语句至少会执行一次“语句块”。

do-while循环语句的特点:先执行循环体,然后判断循环条件是否成立。

1、JS do-while 循环语法

do{
    语句块;  
}while(表达式);//表达式为循环条件

语句解析:

  • 先执行一次循环体中的“语句块”,然后判断“表达式”的值,当“表达式”的值为真时,返回重新执行循环体中的语句块……这个过程会一直重复

  • 直到表达式的值为假时,跳出循环,此时循环结束,执行后面的语句。

说明:

  • 和while循环一样,do-while循环中“表达式”的计算结果一定是布尔型的 TRUE 或 FALSE,如果是其他类型的值也会自动转换为布尔类型的值。

  • do-while语句最后的分号;是无法省略的(一定要有),它是do while循环语法的一部分。

do-while循环语句的流程图如下所示:

JSループ学習:whileループ文の使用(詳細例)

JS do-while 循环示例

【示例1】使用 do-while 输出1~5数字:

<script>
var i = 1;
do {
    document.write(i+", ");
    i++;
}while( i <= 5);
</script>

JSループ学習:whileループ文の使用(詳細例)

【示例2】使用 while 循环计算 1~100 之间所有整数的和:

<script>
var i = 1;
var sum=0;
do{
	sum+=i;
	i++;
}while(i<=100);
console.log("1 + 2 + 3 + ... + 98 + 99 + 100 = "+sum);
</script>

JSループ学習:whileループ文の使用(詳細例)

【示例3】找出 1900 年到 2020 年之间所有的闰年

<script>
var i = 1900;
var count = 0; //计数闰年的个数
do {
    //判断是否是闰年
    if (i % 4 == 0 && i % 100 != 0 || i % 400 == 0) {
		console.log(i);
    }
    i++;
}while (i <= 2020);
</script>

JSループ学習:whileループ文の使用(詳細例)

2、JS do-while 循环嵌套结构

do while循环 也可以实现嵌套的效果,即 do while 循环里面嵌套一个或多个 do while 循环。这种写法就类似于 while 循环 的嵌套。

语法:

do{
    // 语句块1;
    do{
    	// 语句块2;
    	do{
    		// 语句块2;
    		......
	}while(条件3);
    }while(条件2);
}while(条件1);

这里,我们定义了三个 do while 循环的嵌套,当然,我们可以嵌套任意多个的 do while 循环。

案例:使用循环嵌套,打印计数器

<script type="text/javascript">
	var i = 0;
	do{
		console.log("i =", i);
		var j = 0;
		do{
			console.log("\tj =", j);
			j += 1;
		}while(j < 2);
		i++;
	}while(i < 2);
	console.log("Over");
</script>

JSループ学習:whileループ文の使用(詳細例)

首先,我们定义了一个最外层的 do while 循环嵌套,计数器 变量 i 从 0 开始,结束条件是 i

在最外层循环的里面,同时又定义了一个内部循环,计数器变量 j 从 0 开始,结束条件是 i

do while循环嵌套总结

JavaScript 的 do while 循环也可以实现嵌套的效果,即 do while 循环里面嵌套一个或多个 do while 循环。

【推荐学习:javascript高级教程

以上がJSループ学習:whileループ文の使用(詳細例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。