【JavaScript超入門コース】08.配列｜変数を箱。配列をロッカーに例えて解説します【プログラミング初心者向け入門講座】

この動画では、JavaScriptの配列について説明します。文字の書き起こし、ソースコードも完全無料です。サイトでの登録なども一切不要です。概要欄の下部にサイトURLあります。 ▼目次 0:10 配列とは？ 1:27 配列の作り方　1つめ 2:55 配列の作り方　2つめ 3:30 配列の要素の変更方法 3:55 多次元配列 ▼関連動画 【JavaScript超入門コース】01.コース紹介（   • 【JavaScript超入門コース】01.コース紹介｜初心者にわかりやすい...  ) 【JavaScript超入門コース】02.JavaScriptとは (   • 【JavaScript超入門コース】02.JavaScriptとは？｜Ja...  ) 【JavaScript超入門コース】03.環境構築(for Mac) (   • 【JavaScript超入門コース】03.環境構築 for Mac｜プログ...  ) 【JavaScript超入門コース】03.環境構築(for Windows) (   • 【JavaScript超入門コース】03.環境構築 for Windows...  ) 【JavaScript超入門コース】04.プログラムの基本構造 (   • 【JavaScript超入門コース】04.プログラムの3つの基本構造｜プロ...  ) 【JavaScript超入門コース】05.実行 (   • 【JavaScript超入門コース】05.プログラム実行方法 ｜プログラム...  ) 【JavaScript超入門コース】06.変数 (   • 【JavaScript超入門コース】06.変数 ｜変数は、例えるなら「箱」...  ) 【JavaScript超入門コース】07.データ型 (   • 【JavaScript超入門コース】07.データ型 ｜変数に入れるデータの...  ) 【JavaScript超入門コース】08.配列 (   • 【JavaScript超入門コース】08.配列｜変数を箱。配列をロッカーに...  ) 【JavaScript超入門コース】09.演算子 (   • 【JavaScript 超入門コース】09.演算子｜足し算や引き算、2つの...  ) 【JavaScript超入門コース】10.条件分岐 (   • 【JavaScript超入門コース】10.条件分岐｜条件にあてはまればAと...  ) 【JavaScript超入門コース】11.繰り返し (   • 【JavaScript超入門コース】11.繰り返し｜同じ処理を何度も実行で...  ) 【JavaScript超入門コース】12.関数 (   • 【JavaScript超入門コース】12.関数 ｜関数を料理ロボットに例え...  ) 【JavaScript超入門コース】13.クラス (   • 【JavaScript超入門コース】13.クラス｜クラスとは、「データ」と...  ) 【JavaScript超入門コース】14.実践 (   • 【JavaScript超入門コース】14.実践｜すべて理解できればJava...  ) 【JavaScript超入門コース】15.総集編（   • JavaScript超入門コース 合併版【JavaScriptの超基本的な...  ) ▼各超入門コース 合併版（約1時間） 【Python超入門コース】(   • Python超入門コース 合併版｜Pythonの超基本的な部分をたった1時...  ) 【JavaScript超入門コース】(   • JavaScript超入門コース 合併版【JavaScriptの超基本的な...  ) 【Java超入門コース】(   • Java超入門コース 合併版【Javaの超基本的な部分をたった1時間で学べ...  ) 【PHP超入門コース】(   • PHPのプログラミング初心者向けの超入門講座｜たった1時間で学べる【文字書...  ) 【Go超入門コース】(   • 【たった1時間で学べる】Go言語のプログラミング初心者向けの超入門講座【文...  ) 【Ruby超入門コース】(   • 【たった1時間で学べる】Rubyのプログラミング初心者向けの超入門講座【文...  ) 【Kotlin超入門コース】(   • 【たった1時間で学べる】Kotlinのプログラミング初心者向けの超入門講座...  ) ▼自己紹介 現在：フリーランス（マーケティング関連の人工知能開発、データ分析や業務自動化など） 前職：リクルート ▼SNS Twitter : https://twitter.com/kino_code/likes Facebook : https://www.facebook.com/%E3%82%AD%E3%83%8E%E3%82%B3%E3%83%BC%E3%83%89-105693727500005/ Website : https://kino-code.com/ ▼文字書き起こし 配列とは？ 配列とは、複数のデータを格納することができるデータ型です。 変数のレッスンでは、変数は「箱」と説明しました。 例えるなら、変数は1つのデータしかいれらない「箱」なのに対して、配列は複数のデータを入れることができる「ロッカー」です。 1列の配列のことを1次元配列といい、2列以上ある配列は多次元配列といいます。 配列の1つ1つの箱のことを要素といい、箱の数を要素数といいます。 配列のそれぞれの要素には、場所の情報が割り当てられています。 データが住んでいる住所のようなものです。 この住所には、インデックスという番号というものが割り当てられています。 インデックスのことを「添え字」といったりもします。このレッスンでは、インデックスという名前で進めていきます。 一番左のインデックスは0から始まります。1から始まるわけではないので注意です。 そのため、1番最初のインデックスは「0」、2番目のインデックスは「1」、3番目は「2」、4番目は「3」といったように、インデックスは配列が格納されている「順番 – 1」となっています。 配列の作り方　1つめ それでは、配列の作り方をみていきましょう。 配列の作り方はいくつかあるのですが、2つ紹介します。 Arrayを使う方法と、角括弧（[ ]）を使う方法です。 まず、Arrayを使う方法をみていきます。 書き方のきまりは次のとおりです。 var 変数 = new Array(要素数); var、変数、イコール、小文字のnew。Array書いて丸括弧。丸括弧の中に要素数を書きます。 Arrayはコンストラクタといいます。コンストラクタを使用した配列の宣言方法を「コンストラクタの初期化」といいます。 これだけではわかりにくいと思うので、ソースコードを見ていきましょう。 var arr = new Array(3); a[0] = "sato"; a[1] = "suzuki"; a[2] = "takahashi"; console.log(arr[0]); console.log(arr[1]); console.log(arr[2]); このコードは、aという変数に、’sato’,’suzuki’,’takahashi’という3つのデータを代入する配列を作るものです。 コードの意味を説明していきます。 最初にvarを書いて、変数を記述します。 イコールを書いて、new。次にArrayを書いて丸括弧内に配列の要素数を記述します。 これで要素数3の配列ができました。 それぞれの要素にデータをいれていきます。 変数のあとに要素数を書いて代入です。変数のあとにインデックスを書いて代入です。 代入がされているか表示させてみましょう。 表示されました。 var a = new Array("sato","suzuki","takahashi"); 　 console.log(a[0]); console.log(a[1]); console.log(a[2]); 要素数を指定せずに、直接、データを記述することもできます。 Arrayの中に直接データを記述します。 実行してみましょう。 表示されました。 これが配列の作り方の1つめです。 配列の作り方　2つめ 配列の作り方の2つめです。 角括弧（[ ]）を使う方法です。 リテラルの意味は、直接、文字や数字を記述すると言う意味です。 書き方のきまりは次のとおりです。 var 変数 = [データ1,データ2,….]; この書き方を「配列リテラルの初期化」といいます。 varのあとに変数。イコールを書いて、各括弧の中にデータを直接記述します。 データとデータの間はカンマで区切ります。 コードを書いてみていきましょう。 ※続きは、文字書き起こしブログで ▼文字書き起こし&ソースコードは下記ブログ https://kino-code.com/course-javascript08-array/ ▼タグ #JavaScript初心者 #プログラミング入門 #配列