ジャバスクリプトの基礎


このチュートリアルのソースコードをダウンロードできます.
Download the Source Code
以前は、JavaScriptに組み込まれているデータ型を、文字列、数値、およびブール値のように論じました.この記事では、より複雑な構造を作成するために、これらの値のすべてをグループ化することを可能にする2つの新しいデータ型についてお話します.

アレイ
最初に配列について話しましょう.配列は、コンマで区切られた四角形のブラケットのペアに包まれた値のリストです.
let listOfNumbers = [1, 2, 3, 4, 5];

let listOfStrings = ["1", "2", "3", "4", "5"];
インデックス番号を参照することで、配列の要素にアクセスできます.これはコンピュータの世界では非常に一般的なことです、あなたはそれに慣れるべきです.
let x = listOfNumbers[0]; // x = 1 (index 0 is the first element)

let y = listOfNumbers[2]; // y = 3 (index 3 is the third element)
配列の最後の要素にアクセスしたい場合、配列の長さを知りませんか?値が0かどうかを調べるために0から始まるすべてのインデックスを試みる代わりに、配列の長さにアクセスできますarrayName.length . ここでの長さをプロパティと呼びます. 値のプロパティにアクセスする方法です.例えば、
let z = listOfNumbers[listOfNumbers.length - 1]; // z = 5
この例ではlistOfNumbers.length 我々が長さを計算するとき、我々が1から始めるので、我々に5を与えてください.しかし、インデックスが常に0から始まるので、それは最後の要素のインデックスが長さより1-1 はい.
配列の値を変更することもできます.
let listOfNumbers = [1, 2, 3, 4, 5];
listOfNumbers[2] = 100;

// listOfNumbers = [1, 2, 100, 4, 5];

アレイループ
場合によっては、配列全体を反復処理し、各要素を一つずつアクセスする必要があります.我々がこれをすることができる2つの異なる方法が、あります.
let list = [...];

for (let e of list) {
   ...
   // Do somthing with the variable e
}
これは以前に見た方法です.繰り返しごとに、変数e 配列の次の要素が割り当てられますlist , そして、変数で何かを行うことができますe インサイドfor ループ.
番目の方法はインデックスを使用することです.
for (let i = 0; i < list.length; i++) {
  let e = list[i];
}
この例では、変数i が配列要素のインデックスにバインドされ、e の配列要素にバインドされますi . 式i++ の短縮表記ですi = i + 1 .

スタックとキュー
スタックとキューは、コンピュータプログラミングの2つの非常に重要なデータ構造です.
スタックは最後のin first out(lifo)の原理に基づいた要素の構造である.それは本の積み重ねのようです.あなたがスタックに新しい本を追加する場合は、上部にそれを置くだろうし、本を削除する場合は、同様に上部にあるものを削除します.

スタックデータ構造体には2つの基本的な操作があります.
  • push操作はスタックに新しい要素を挿入(push)する役割を果たします.
  • pop操作はスタックから最も最近の要素を削除して返す責任があります.
  • 幸いにも、JavaScriptはパッケージからこれらの2つの方法を提供します.それらを使用するには、再度、使用することができます. 演算子は、関数の値を持つプロパティです.
    let stack = [];
    
    stack.push(2);
    stack.push(5);
    stack.push(7);
    stack.push(9);
    stack.push(7);
    
    console.log(stack); // -> [2, 5, 7, 9, 7]
    
    stack.pop(); // -> returns 7
    stack.pop(); // -> returns 9
    stack.pop(); // -> returns 7
    stack.pop(); // -> returns 5
    stack.pop(); // -> returns 2
    
    console.log(stack); // -> []
    

    キューは別の非常に有用なデータ構造です.それはスタックで非常に類似しています、それが最初のIn First Out(FIFO)原則に続く以外は.それはレストランでラインで待っているようなものだ、あなたが最初に来た場合は、まず食べ物を取得します.

    キューデータ構造体には2つの基本的な操作があります.
  • Enqueue操作はキューの末尾に新しい要素を挿入する責任があります.
  • dequeue操作は、キューの先頭にある要素の削除と復帰を担当します.
  • これらの2つの操作で私たちを助けるJavaScriptに2つの方法も組み込まれていますが、用語は少し異なります.enqueue操作では、push() メソッドは、新しい要素を配列の末尾にプッシュするためです.dequeue操作については、shift() 配列の最初の要素を削除するメソッドです.
    let queue = [];
    
    queue.push(2);
    queue.push(5);
    queue.push(7);
    queue.push(9);
    queue.push(7);
    
    console.log(queue);
    
    queue.shift();
    queue.shift();
    queue.shift();
    queue.shift();
    queue.shift();
    


    プロパティとメソッド
    さて、我々がちょうど話していたプロパティの概念を詳しく見てみましょう.いくつかの奇妙な表情を見てきたlistOfNumbers.length and Math.max . これらはいくつかの値のプロパティにアクセスする式です.最初の例では、length プロパティlistOfNumbers 配列.番目の例では、max プロパティMath オブジェクト.
    我々が話したデータ型のほとんどすべては、ビルトインプロパティを持っています.例えば、文字列もlength プロパティの配列と同じです.
    に加えてlength プロパティを保持するプロパティは、関数値を保持するプロパティの数もあります.例えば、我々はtoUpperCase 文字列内のすべての文字が大文字に変換される文字列のコピーを取得する文字列のプロパティ.通常、これらのプロパティを関数値をメソッドとして参照します.
    let aString = "abCDefg";
    console.log(aString.toUpperCase()); // -> "ABCDEFG"
    console.log(aString); // -> "abCDefg"
    

    オブジェクト
    我々がこれまでに話した特性のすべては、ビルトイン特性です、そして、彼らはすべてJavaScriptとともに来ます.しかし、もし我々自身のプロパティを作成したいですか?オブジェクトは、我々が我々自身の特性をつくるのを許すここで議論する2番目のデータ型です.
    オブジェクトは任意のプロパティのコレクションです.{} . 例えば、ここでは、オブジェクトMyHousehold :
    let MyHousehold = {
      members: 4,
      names: ["Mason", "Robert", "Lara", "Wynne"]
    };
    
    括弧の内側はコンマで区切られたプロパティのリストです.それぞれのプロパティはname: value 形式.
    この例では、私の家に4人のメンバーがいます.その情報にアクセスするために、我々は以前に使用したのと同じ表記法を使用して、ドットを使用することができます. ).
    console.log(MyHousehold.members);
    // -> 4
    
    オブジェクトも変更可能です.を使用して行うことができます= 演算子.例えば、
    MyHousehold.members = 5;
    
    console.log(MyHousehold.members);
    // -> 5
    
    ただし、これはオブジェクトのデータ型にのみ適用されます.文字列、数値、および配列などの他のデータ型のプロパティは、そのプロパティは変更不能であり、変更できません.例えば、含まれる文字列があれば"cat" , その文字列の文字を変更するためにいくつかのコードを書くことはできません"rat" .
    次の記事では、オブジェクトに深く掘り下げ、オブジェクト指向プログラミングの概念について話します.

    JSON
    プロパティを定義するときname: value ), the name は、value . 代わりに、それはアドレスとしてコンピュータメモリに格納されるvalue が格納される.
    ファイル内のデータを保存したり、インターネット上の他の誰かに送信する場合は、何らかの方法でメモリアドレスのこれらの接線を格納したり、インターネット経由で送信する記述に変換する必要があります.この処理をシリアル化と呼び、データをフラットな記述に変換する.人気のシリアル化形式はJSON(JavaScriptのオブジェクト表記、「Jason」と発音される)と呼ばれます.
    JSONはJavaScriptのオブジェクトを定義する方法をいくつか見ています.プロパティ名はダブルクォートで囲まれていなければならず、実際の計算を含む関数や何もなし、単純なデータ型のみが許可されます.それで、我々が我々を表すならばMyHousehold JSON形式のオブジェクトです.
    {
      "members": 4,
      "names": ["Mason", "Robert", "Lara", "Wynne"]
    }
    
    JSONは、JavaScript以外の言語でさえ、ウェブ上のデータ保管とコミュニケーション形式として広く使われます.我々は将来的にバックエンド開発について話すように再びそれに遭遇する.