JavaScriptはスタック構造の詳細なプロセスを実装する

JavaScriptはスタック構造の詳細なプロセスを実装する

1. スタック構造を理解する

配列は一般的なデータ構造であり、配列内の任意の位置にデータを挿入したり削除したりできることはご存じのとおりです。ただし、特定の機能を実現するために、この任意性を制限しなければならない場合もあります。スタックとキューは、比較的一般的な制限付きデータ構造です。まずはスタックを見てみましょう。
stack 、後入れ先出し ( LIFO ) 順序を持つ制限された線形テーブルです。

  • 制限は、挿入および削除操作がテーブルの一方の端でのみ許可されることです。この端はスタックの上部と呼ばれ、もう一方の端はスタックの下部と呼ばれます。
  • LIFO (後入れ先出し) とは、最後に入力された要素がスタック スペースから最初にポップされることを意味します。
  • スタックに新しい要素を挿入することを、プッシュ、プッシュ、またはプッシュとも呼びます。これは、新しい要素をスタックの最上位要素の上に配置し、それをスタックの新しい最上位要素にします。
  • スタックから要素を削除することは、スタックの作成またはスタックのポップとも呼ばれます。スタックの最上位の要素を削除し、その隣接する要素をスタックの新しい最上位の要素にします。

構造図は以下のとおりです。

人生における積み重ねに似ている

たとえば、コードを入力しているときにエラーが発生して削除する必要がある場合、最初に入力したコードが最後に削除されます。

次に、スタック構造のカプセル化を一緒に実装してみましょう。採用するメソッドは配列に基づいています。

2. スタック構造のカプセル化

まず、スタック構造をカプセル化するクラスを次のように作成します。

関数 Stack(){
            
        }

その中にプロパティとメソッドを追加し、プロパティ メソッドを通じてクラスに配列を追加します。次に、プロトタイプ メソッドを使用して、よく使用される操作を追加します。

スタックに対する一般的な操作は次のとおりです。

  • push (要素): スタックの一番上に新しい要素を追加します。
  • pop() : スタックの一番上の要素を削除する
  • peek( ) : スタックを変更せずにスタックの一番上の要素を返します。
  • isEmpty() : スタックが空かどうかを判定します。スタックに要素がない場合はtrueを返し、そうでない場合はfalseを返します。
  • size() : スタック内の要素数を返す
  • toString() : スタック構造の内容を文字として返します

次に、これらを 1 つずつ実装します。

 関数 Stack(){
     this.items = [];
     // スタックの先頭に新しい要素を追加します。押す()
     Stack.prototype.push = function(要素){
        this.items.push(要素);
     }
      // スタックの一番上の要素を削除する pop()
     Stack.prototype.pop = function(){
         this.items.pop() を返します。
     }
     // スタックを変更せずにスタックの一番上の要素を返す peek()
     Stack.prototype.peek = 関数(){
         this.items[this.items.length-1]を返します。
     }
     // スタックが空かどうかを判定する isEmpty()
     Stack.prototype.isEmpty = 関数(){
         (this.items.length == 0)の場合{
             true を返します。
         }それ以外 {
             false を返します。
         }
     }
     // スタック内の要素数を返す size()
     Stack.prototype.size = function(){
         this.items.length を返します。
     }
     // スタック構造の内容を文字として返す toString()
     Stack.prototype.toString = 関数(){
         var str = '';
         for(var i =0;i<this.items.length;i++){
             str += this.items[i] + ' ';
         }
         str を返します。
     }
 }
       


注:ここでプロトタイプを通じて追加する必要があるのはなぜでしょうか?これは、このメソッドを通じて追加されたメソッドがクラスに追加されるためであり、これを直接追加すると、特定のインスタンスのオブジェクトに追加され、メモリの無駄が発生します。

最後に確認します。コードは次のとおりです。

var スタック = 新しい Stack();
スタックをプッシュします(1);
スタックをプッシュします(2);
スタックをプッシュします(3);
スタックをプッシュします(4);
スタックをプッシュします(5);
console.log(スタック);
console.log('削除されたスタックの一番上の要素は: '+stack.pop());
console.log('スタックの最上位要素は: '+stack.peek());
console.log('スタックは空ですか: '+stack.isEmpty());
console.log('スタック内の要素数は: ' + stack.size());
console.log('スタック構造の内容は次のとおりです:');
コンソールにログ出力します。

出力は次のようになります。

ビルドに成功しました。
例を見てみましょう!

3. 10進数を2進数に変換する

10進数を2進数に変換するにはどうすればいいですか?

10 進数を 2 進数に変換するには、10 進数を 2 で割り、結果が 0 になるまで余りをスタックにプッシュし、最後にスタック内の要素を 1 つずつポップして最終結果を取得します。

次の図に示すように:

具体的なコードは次のとおりです。

 関数 Stack(){
     this.items = [];
     //スタックにプッシュする Stack.prototype.push = function(element){
         this.items.push(要素);
     }
     //ポップアウト Stack.prototype.pop = function(){
         this.items.pop() を返します。
     }
     //スタックが空かどうかを判断します Stack.prototype.isEmpty = function(){
         (this.items.length == 0)の場合{
             true を返します。
         }それ以外{
             false を返します。
         }
     }
 }
 関数decToBin(decNumber){
      var stack = 新しい Stack;
      while(decNumber>0){
          // 剰余を取得してスタックに格納します。stack.push(decNumber%2);
          //新しい除数を取得します。decNumber = Math.floor(decNumber/2);
      }
      //スタックの一番上の要素を取得します。var str = '';
      while(!stack.isEmpty()){
          str += スタック.pop();
      }
      str を返します。
  }
 console.log('100 をバイナリに変換すると次のようになります: '+decToBin(100));
 console.log('50 をバイナリに変換すると次のようになります: '+decToBin(50));
 console.log('20 をバイナリに変換すると次のようになります: '+decToBin(20));
 console.log('34 をバイナリに変換すると次のようになります: '+decToBin(34));

出力は次のようになります。

JavaScriptのスタック構造の実装の詳細なプロセスに関するこの記事はこれで終わりです。JavaScript のスタック構造の実装に関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScriptでスタック構造を実装するプロセスの詳細な説明
  • JS アルゴリズムとデータ構造におけるスタック例の詳細な説明
  • JS スタッククラスの実装と使用例
  • JavaScript データ構造スタックの使用例

<<:  9999px に別れを告げる新しい CSS 画像置換テクニック (背景表示と画面外へのテキストの移動)

>>:  HTML でテキスト ボックスのプロンプト機能を実装するさまざまな方法

推薦する

WeChatミニプログラム抽選コンポーネントの使い方

WeChatコンポーネントの形式で提供されます。コンポーネント内部ではasync/awaitが使用さ...

Vue プロジェクトで垂直テーブルを 2 つの方法で実装するアイデアの分析

問題の説明私たちのプロジェクトでは、水平方向のテーブルが一般的ですが、必要に応じて垂直方向のテーブル...

画像のプリロードと遅延ロードを実装するJavaScript

この記事では、JavaScriptで画像のプリロードと遅延ロードを実装するための具体的なコードを参考...

MySQL での置換例の詳細な説明

MySQL での置換例の詳細な説明replace into は insert と似ていますが、rep...

nginx httpモジュールのデータ保存構造の概要

このセクションから、http モジュールの実装原理について説明します。http モジュールで非常に重...

上位Nを見つけるためのMySQLグループソートの詳細な説明

MySQLグループソートで上位Nを見つけるテーブル構造grp でグループ化し、num で並べ替えて、...

HTML ページ スタイルの !-- -- の機能は何ですか?

主に低バージョンのブラウザ向け<!-- --> は HTML コメント タグです。上位バ...

Tencent インタビュー: SQL ステートメントの実行が非常に遅くなる理由は何ですか? ---後悔シリーズは見ないで(推奨)

正直に言うと、この質問には MySQL のコア知識がかなり必要で、コンピュータ ネットワークの知識を...

HTMLタグを閉じるのを忘れないでください

Web 標準に準拠した Web ページの構築は、jb51.net が常に全員と議論しているトピックで...

ES6の新機能に関する最もよく使われる知識ポイントのまとめ

目次1. キーワード2. 脱構築3. 文字列4. 正規化5. 配列6. 機能7. オブジェクト8.シ...

WeChat アプレット開発フォーム検証 WxValidate の使用

個人的には、WeChat アプレットの開発フレームワークは VUE と概ね似ていると感じていますが、...

JS でオブジェクトを作成する 4 つの方法

目次1. リテラル値でオブジェクトを作成する2. 新しいキャラクターを使ってオブジェクトを作成する3...

Docker を使用した ElasticSearch:7.8.0 クラスターのインストールに関する詳細なチュートリアル

ElasticSearch クラスターは、クラスターを構築するための動態請求的方式と靜態配置文件をサ...

Nginx での Frp による https への強制リダイレクト設定の詳細な説明

自宅のルーターが300Mの帯域幅を80Mに強制的に減らしたため、3205Uソフトルーターを購入しまし...

Mysqlは隣接リスト(隣接リスト)を通じてツリー構造を保存します。

以下の内容では、隣接リストを使用してツリー構造を保存する MYSQL のプロセスとソリューションを紹...