0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

[JavaScript] 配列とオブジェクトについて

Last updated at Posted at 2020-11-18

4回目の投稿です。
記事を投稿する度に少しずつ要領を掴めてきた気がします。
ノートにさっとまとめながら勉強しています。

#配列
##基本的な書き方
配列は他の言語と書き方はほぼ同じ。

const 定数名 = [要素1,要素2,要素3];
console.log(定数名);
console.log(定数名[インデックス番号]);
定数名[インデックス番号] = "文字列"; //数値の場合は""で囲まない。
console.log(定数名[インデックス番号]);

このように書く。
一行目は、定数を宣言し、定数に配列を代入
二行目は、(定数を記述することで)配列を出力
三行目は、配列の中でも指定のインデックス番号の要素(文字列や数値)を更新
四行目は、二行目と同様に(定数を記述することで)配列を出力

具体的には以下のように書く。

sample1
const names = ["itiro","jiro","saburo"];
console.log(names);
console.log(names[0]);
names[0] = "hanako";
console.log(names[0]);
["itiro","jiro","saburo"]
itiro
hanako

と表すことができる。

##配列とfor文の組み合わせ
配列とfor文を組み合わせることによって、配列内のすべての値を簡単に出力できる。

sample2
const names = ["itiro","jiro","saburo"];
for (let i = 0; i < names.length; i++) {
  console.log(names[i]);
}
itiro
jiro
saburo

となる。これは、変数i が 0~ 配列namesの要素数まで繰り返すという意味。
また、配列.length とすることで配列の要素数を取得できる。

sample3
const names = ["itiro","jiro","saburo"];
console.log(names.length);
3

#オブジェクト
オブジェクトとは、複数のデータをまとめて管理するのに用いる。
オブジェクトがそれぞれの値に名前を付けたものをプロパティという。

配列
[値1,値2,値3]

オブジェクト
{プロパティ1:値1,プロパティ2:値2}

書き方は配列とほとんど変わらない。要素を更新することもできる。

sample4
const item = {name:"pen",price:150};
console.log(item);
console.log(item.name);
item.price = 300;
console.log(item.price);
{name:"pen",price:150}
pen
300

#オブジェクトを要素に持つ配列
[配列]内に{オブジェクト1},{オブジェクト2}が存在する。

[{プロパティ1:値1},{プロパティ2:値2}]
sample5
const items = [
      {name:"pen",price:150},
      {name:"note",prce:200}
];
console.log(items);
console.log(items[0]);
console.log(items[0].name);
console.log(items[1]);
conlole.log(items[1].price);
[{name:"pen",price:150}, {name:"note",price:200}]
{name:"pen",price:150}
pen
{name:"note",price:200}
200

#参考
Progate>JavaScriptⅡ

0
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?