JavaScript【配列とオブジェクト＆その他】

JavaScript【配列とオブジェクト】

map､filter

See the Pen WNNOzyE by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

mapは、配列の中身それぞれに指定された処理を施した新しい配列を生成し返してくれます。

この例では、配列の中身を全て２倍したものを返却しており、aryとは全く別の新しい内容の配列が出来上がっていることがわかると思います。

また、filter機能を使えば、条件に合ったものだけを抽出した新しい配列を返却してくれます。

forEach

See the Pen yLLXKQE by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

forEachは配列の中身にアクセスし、それぞれに指定された処理をしてくれます。

mapと似ているのですが、forEachは戻り値がないので、新しい配列を生成したりはしません。

用意してある配列そのものに対し処理をしたい場合に使用します。

要素の追加、削除

See the Pen MWWoVLB by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

配列に要素を追加したい場合、先頭であればunshift、末尾であればpushを使用します。

See the Pen JjjJLxg by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

削除する場合は、先頭であれば、shift、末尾であればpopを使用します。

splice

See the Pen GRRExeN by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

先頭と末尾以外の位置の要素を削除、追加したい場合は、spliceを使用します。 splice(開始位置の添字,削除する要素の数,追加要素,,,)

というように、引数を渡します。追加要素がない場合は、引数は２つになります。

スプレッド演算子

See the Pen mddwxYr by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

スプレッド演算子とは...の部分のことです。

配列やオブジェクトの要素をそこで展開してくれます。

分割代入(スプレッド演算子との併用)

See the Pen mddwxNO by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

分割代入というのは、文字通り配列やオブジェクトの中身を分割して各変数に代入できるというもの。

const ary = [1,2,3];
const [a,b,c] = ary;

と書けば、a=1,b=2,c=3となります。

これは先ほどのスプレッド演算子と相性が良く、

要素を取り出しながら残りを変数に代入してくれます。

Math

数学で使うようなものは大体Mathを調べれば良い。

See the Pen qBBjYWB by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

Math.PIは円周率を返してくれます。

Math.roundは与えた値を四捨五入して返してくれます。 ただし、浮動小数点という問題があり、一定の条件で予期しない値になる可能性があります。 詳しくはこちら→ Math.round() - JavaScript | MDN

)

Date

See the Pen poowVjx by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

上記ではローカル日付を取得することが出来ます。

getMonth,getDaysでは0始まりのため、想定した値と少しズレが生じる可能性がありますので注意が必要です。

例外処理

See the Pen mddwLVW by すず@progateでお勉強はじめました (@hpsuzucat) on CodePen.

try{ }catch(){}で例外処理を捕まえることが出来ます。

catchの引数には好きに名前を付けてOKなのですが、errorのeがよく使用されます。