JavaScript プログラムのループ構造の詳細な説明

JavaScript プログラムのループ構造の詳細な説明

構造を選択

単一分岐構造の場合

if(条件){
条件が満たされた後に実行されるコード}

中括弧内にステートメントが 1 つしかない場合は、中括弧を省略できますが、これは強くお勧めしません。

if(条件)
	console.log('ドット ドット ドット')

2分岐のif構造文

if (条件) {
条件が満たされた後に実行されるコード}
それ以外{
条件が満たされない場合に実行されるコード}

複数分岐の if 構造ステートメント

if(条件1){
コード 1
}
そうでない場合(条件2){
コード2
}
......
それ以外{
上記の条件のいずれも満たされず、コードが実行される}

スイッチ構造

var 今日=1
スイッチ(今日){
	ケース1:
		console.log('勤務日')
		壊す
	ケース2:
		console.log('勤務日')
		壊す
	ケース3:
	ケース4:
	ケース5:
		console.log('勤務日')
		壊す
	デフォルト
		console.log('休息日')
		壊す

switchとifの違い

  • スイッチは、次の場合にのみ等価判定を実行できます。
  • 連続区間の判定に制限はありません。

ループ構造

操作を繰り返し実行することをループと呼びます。

その間

// 10 回ループ var i=1
i<=10 の場合
コンソールログ('111111')
私は++
}
//例: 100 以内の整数の合計を計算する var i=1
var 合計 = 0
i<=100 の場合{
 合計+=i
 私は++
}
例: [1,200] の間のうち 7 で割り切れるが 4 で割り切れないすべての整数を出力し、その数を数えます。同時に、出力には各行に 5 つの var i=1 が表示される必要があります。
変数カウント = 0
i<=200 の場合
	if(i%7==0 && i%4!=0){
		document.write(i+"&nbsp;&nbsp;&nbsp;&nbsp;")
		count++; // 数を数える // 5 つの出力が新しい行に変更されるかどうかを判定する if (count%5==0){
		ドキュメント..write('<br>');
		}
	}
	私は++;
	document.write('<br>合計: '+count+'')

…しながら

まずコードを実行し、次に条件を判断する

var i = 1;
        する{
            console.log('一生懸命勉強して毎日進歩しましょう!')
            私は++;
        }while(i<=10)
  #Case#1~50 の倍数を計算する<script type="text/javascript">
        var i = 1;
        var 合計 = 0;
        する{
            if(i%6==0){
                合計+=i
            }
            私は++;
        }while(i<=50)
        コンソール.log(合計)
    </スクリプト>
#Case# ループしてユーザーに 5 つの数字を入力するよう促し、終了するには q を押してから、最大値と最小値を出力します。# ユーザーに 1 回入力するよう促し、その数字を最大値と最小値として使用します。var num = Number(prompt('特性を入力してください (終了するには q を押します):'))
 var max = 数値;
var min = 数値;
var flag = true // ループを続行するかどうかを示します var i = 1;
する{
var num=Number(promot('整数を入力してください!'))
#ユーザーがqを入力したかどうかを判定する
if(num=='q'){
flag=false //q を入力した場合は、フラグを false に変更してループが停止することを示します}else{
num=数値(num)
if(num>max){
	最大=数値;
}
(数値<最小値)の場合{
最小=数値
}
}while(フラグ)
コンソール.log(最大)
コンソール.log(分)

forループ

文法

for(初期化:条件:反復){
コードブロック}

ループの最初に初期化部分が実行され、初期化部分は一度だけ実行されます。

初期化が完了したら、条件が満たされているかどうかが判断され、満たされている場合はコード ブロックが実行され、その後反復部分が実行されます。

…のために…で

コレクションデータを横断する

ループの走査は、データ自体ではなく、コレクション内の走査されたデータのインデックス順序(0から始まる)です。

<script type="text/javascript">
        var str = 'abc'
        for(var index in str){
            console.log(インデックス,str[インデックス])
        }
    </スクリプト>

ここに画像の説明を挿入

…の…のために

コレクションデータを反復処理する

これは値を直接取得するためです

<script type="text/javascript">
        var str = 'abc'
        for(var strのインデックス){
            コンソール.log(インデックス)
        }
    </スクリプト>

ここに画像の説明を挿入

まとめ

  • ループ回数が決まっている場合は、通常forが使用される。
  • ループ回数が不明な場合は、whileとdo...whileが一般的に使用されます。
  • コレクションを反復処理するには、for...in と for...of を使用します。

ループの終了

壊す

breakはループ全体を抜け出し、ループの実行を終了します。

場合

// 1 から 20 までの整数を加算し、累積値が 66 を超えると加算を停止し、現在の整数と累積値を出力します。var sum = 0
(var i=1;i<=20;i++){
	合計+=1
	合計が66以上の場合
	壊す
}
}

続く

このループから抜け出して次のループを実行します。このループはまだ完了していません。

// 1~10 までのすべての偶数の合計を計算します var sum=0;
(var i=1;i<=10;i++){
	if(i%2!=0){
	続く
	}
	合計+=i
}

第2層サイクル

ループは別のループ内にネストされ、二重ループを形成します。さまざまなループを互いにネストできます。

外側のループ変数は1回変更され、内側のループは1回実行されます。

//ケース //あるプログラミングコンテストに、4人の生徒が参加する3つのクラスがあります。各クラスの各生徒のスコアを入力し、各クラスの平均スコアを計算します。for(var i=1;i<=3;i++){
	alert('+i+'番目のクラスの生徒情報を入力してください---')
	// 内部ループはクラスの生徒数を制御します var sum=0
	(var j=1;j<=4;j++){
	var score=Number(prompt('j+番目の生徒のスコアを入力してください:'))
	合計+=スコア;
}
	console.log('+i+'番目のクラスの平均スコアは: '+sum/4)
}
  <script type="text/javascript">
        (var i=1;i<=9;i++){
            (var j=1;j<=i;j++){
                document.write(j+'*'+i+'='+i*j+'&nbsp;&nbsp')
            }
            ドキュメント.write('<br>')
        }
    </スクリプト>

ここに画像の説明を挿入

要約する

この記事はこれで終わりです。皆さんのお役に立てれば幸いです。また、123WORDPRESS.COM のその他のコンテンツにも注目していただければ幸いです。

以下もご興味があるかもしれません:
  • JS の基礎: 論理構造とループ操作の例
  • JavaScript データ構造における双方向リンクリストと双方向循環リンクリストの実装
  • JavaScript データ構造: 単方向リンクリストと循環リンクリスト
  • JavaScript データ構造の詳細な説明: 優先キューと循環キューの例
  • JavaScript の for 文のループ構造を簡単に学ぶ

<<:  ラジオボタンと複数選択ボタンは画像を使用してスタイル設定されます

>>:  CSS3 を使用して左上または右上隅にリマインダー ドットを表示するサンプル コード

推薦する

Centos6.6 で php7 + nginx 環境をインストールする方法

この記事では、centos6.6 で php7 + nginx 環境をインストールする方法について説...

JavaScript配列の一般的なメソッドの詳細な説明

目次一般的な配列メソッドポップ()シフト解除()シフト()スライス()スプライス()配列から重複した...

jQueryはすべてのショッピングカート機能を実装します

目次1. すべて選択2. 商品の数量を増やすか減らす3. 商品の小計を変更する4. 合計と合計額を計...

MySQLの外部ネットワークアクセス権を開く方法

以下のように表示されます。主に認証コマンドを実行します: 2つの方法1. 任意のホストがユーザー b...

HTML テーブルの境界線を設定する際のヒント

HTML を初めて使用する多くの人にとって、テーブル <table> は最もよく使用され...

HTMLページ内の検索機能を完了する

最近、たくさんの人に改変してもらったフレームワークに取り組んでいます。毎日コードを見ていると目が回り...

HTMLフロートの使用法の簡単な分析

float の使用例左サスペンション: float:left;右サスペンション: float:rig...

NodeとPythonの双方向通信実装コード

目次プロセスコミュニケーションプロセス間の双方向通信問題要約するサードパーティのデータ サプライヤー...

新しい要素を作成する3つの方法のまとめ

1つ目: テキスト/HTML経由var txt1="<h1>テキスト。<...

複雑なSQLクエリを含むMySQLの一般的なSQL文の概要

1. 複雑なSQLクエリ1.1. 単一テーブルクエリ(1)指定の列を選択する[例] 全生徒の生徒ID...

Vue+element ui はアンカーの配置を実現します

この記事では、アンカー配置を実現するためのVue +要素UIの具体的なコードを例として紹介します。具...

jQuery ツリービュー ツリー構造アプリケーション

この記事では、jQueryツリービューツリー構造のアプリケーションコードを例として紹介します。具体的...

Vue3+TypeScriptはaxiosをカプセル化し、リクエスト呼び出しを実装します

まさか、2021年になってもTypeScriptについて聞いたことがない人がいるなんて?プロジェクト...

一般的な XHTML タグの紹介

<br />しばらくの間、多くの人が XHTML の使い方を知らないことに気付きました。...

Linux にソフトウェアをインストールするときにソフトウェア パッケージが存在しない問題を解決する方法

ソフトウェア パッケージが存在しない場合は、インストールされているソフトウェアのソフトウェア ソース...