javascriptリスト

| | | | | | | | | | | | | | | | | | | | | | | | | | |

自分たちで果物のリストを作成します。リストを「フルーツ」と呼び、次の値を追加します:バナナ、メロン、ブドウ。ああ、フルーツが大好きです。これはショッピングリストのチュートリアルのように聞こえるかもしれませんが、実際にはテーブルを作成しただけです。

このガイドでは、配列とは何か、配列がどのように機能するか、コードで配列を使用する理由について説明します。JavaScriptボードの忍者になるために、実際のサンプルボードについて説明します。< / p>

配列とは何ですか?

配列はデータを格納するオブジェクトです。配列には要素の順序付けられたコレクションが含まれ、0個以上の要素を格納できます。配列は次のことを可能にするためプログラミングに役立ちます。同様の値を変数に格納します。

たとえば、お気に入りの果物を一覧表示するために10個の単純な変数を記述する必要はありません。配列を使用すると、お気に入りの果物をすべてに追加できます。 1つの変数。

次の例を検討してください。

ここで「fruits」という配列を作成しました。 3つの異なる値が格納され、それぞれが食料品店で購入したい果物を反映しています。配列を宣言するために、要素のリストを角かっこで囲みました。

配列の宣言

配列を宣言する方法は2つあります。ほとんどの人がこれを行うのを見る方法は、前に行ったように、角かっこで囲まれたアイテムのリストを丸で囲むことです。

この例では、3つの値を持つ配列を宣言しています。 newキーワードを使用して配列を宣言する配列コンストラクターを使用することもできます。

これらのコードスニペットは同じ配列を作成しますが、異なる方法を使用します。 2番目の例では、循環サポートを使用して配列を宣言していることに注意してください。また、 new Arrayコンストラクターを使用して配列を宣言します。ほとんどの人が最初の方法を好むのはこのためです。角かっこは覚えやすく、入力も速くなります

テーブルに同じものが含まれていない場合がありますデータの種類私たちのネットワークは、さまざまな種類のデータを格納できます。

この配列には、文字列、数値、ブール値の3つの異なるデータ型が格納されます。配列の宣言方法に慣れたら、その内容にアクセスする準備が整いました。

配列の読み取り

配列を読み取ることができなければ、配列はあまり役に立ちません。値。これがインデックスが存在する理由です。インデックスは、の個々の要素にアクセスする方法です。リストとしての反復可能なオブジェクト。

配列内の配列の各要素には、そのインデックス番号が割り当てられます。 er。これらの数値は0から始まり、電流を配列内の個々の要素に交流させるために使用できます。 「フルーツ」テーブルを覚えていますか?

この配列に割り当てられたインデックス値は次のとおりです。

これらの番号を使用して、リスト内のさまざまなアイテムにアクセスできます。果物が配列のインデックス位置1にあることを識別したいとします。これは、テーブル名の後に角かっこで囲まれたインデックス値を示すことで実行できます。

コードが返されます。ブドウインデックスの位置1を参照し、値「レーズン」を格納します。値0を渡すと、「バナナ」が返されます。存在しない要素にアクセスしようとすると、「undefined」が返されます。

出力:未定義。インデックス付けが特に役立つのは、配列内の要素をループする場合です。コンソールのステンシルにある各果物を印刷するとします。これは、次のようなループを使用して実行できます。

このコードは次を返します:

コードはリスト内の各アイテムを通過し、各アイテムをコンソールに出力します。また、長さを使用していることにも気付くでしょう。この関数は、リストの長さを返します

配列に要素を追加する

ほとんどの場合、最初に配列を宣言した後で配列に新しい値を追加したい場合があります。これは、 push()配列を使用して行うことができます。

フルーツリストに「Strawberry」を追加するのを忘れました。いや、心配しないでください。 push()を使用していつでも追加できます:

このコードを実行したので、配列は次のようになります。

バナナブドウメロンストロベリー
1 2 3

コード<>unshift()を使用して、テーブルの先頭にデータを追加できます。イチゴはショッピングリストで非常に重要なので、最初に表示する必要があります。

これにより、「フルーツ」リストは次のようになります。

< td>イチゴ
バナナブドウ メロン
1 2 3

配列から要素を削除する

家にはすでにメロンがあることがわかったので、必要ありませんでした1つ購入します。メロンを買う意味は何ですか?メロンはリストの最後にあるため、削除するには2つのオプションがあります。

  • splice():。インデックス番号に従って要素を削除します
  • pop():配列の末尾から要素を削除します

Letを使用します例としてsplice():。

コードが返されます:

splice()は2つのパラメーターを受け入れます。 1つ目は配列から削除するインデックス番号で、2つ目は削除するアイテムの数です。この場合、インデックス値3の要素を削除したかったので、パラメータとして「3、1」を指定しました。

pop()はパラメータを受け入れません。リストから最後のアイテムのみを削除します。

コードは次を返します:

shift()を使用して、リストの先頭から要素を削除することもできます。

コードは次を返します:

push()およびunshift()はリストにアイテムを追加します。 pop()およびshift()アイテムをリストから削除します。アセンブリメソッドを使用して、インデックス値に基づいてリストからアイテムを削除することもできます

変更シリーズの要素

バナナはおいしい果物ですが、大きすぎて少し緊張しているとおやつとして食べられないことがよくあります。あえてお腹が空いています。バナナの赤ちゃんの方が簡単です。

ここで、「フルーツ」リストを変更して、通常のバナナの代わりにベビーバナナを購入するとします。これは、すべての変数として割り当て演算子を使用して行うことができます。

私たちのコードは次を返します:

エントリを変更しましたインデックス位置0に値「babybananas」を格納します。この変更を行うために特別なメソッドを使用する必要はありません。割り当て演算子を使用してvalを変更します。 ues、配列内。

結論

これは、JavaScript配列について知っておくべきことの基礎です。学ぶべきことはまだたくさんありますが、それがプログラミングを楽しくするものです。取り組むべき新しい課題が常にあります。他に何もなければ、あなたは私のお気に入りの果物について学びました。私はブラックカラントが好きだと思いますが、このチュートリアルでは言及していません。

これで、JavaScript配列のような作業を開始する準備が整いました。エキスパート!