LoginSignup
1
0

More than 3 years have passed since last update.

Javascirptのメソッドチェーンの説明(初心者向け)

Last updated at Posted at 2020-10-15

この記事の対象者

配列とメソッドはなんとなくわかる方

メソッドチェーンとは

こんなやつです。

test.html
<body>
    <script>
        arrayA = ["リンゴ","ゴリラ","ラッコ"];
        value = arrayA.slice(1).length;
        console.log(value) //2
    </script>
</body>

2行目の右辺のことですね。ドットを挟んで3つつながってます

value = arrayA.slice(1).length;

解説

このvalue = arrayA.slice(1).length;が何を一体しているのかというと

1、配列arrayAに対して .slice(1) で "リンゴ" を配列arrayAから削除した配列を新たに作成。
  ["リンゴ","ゴリラ","ラッコ"]  ⇒  ["ゴリラ","ラッコ"]
2、その削除した配列に対して .length で配列の長さを取得。
  ["ゴリラ","ラッコ"] ⇒ 配列の要素の数は2個

という仕組みになっています。

左側から順番に処理をしていくだけですね。
この順番を必ず意識するようにしてください。

見たことがないメソッドが出てきても基本的にこの考えで解決できると思います。
これがわかれば最初は良いと思います。

ちなみに

左から順番にやっていくというのが分かっていれば

value = arrayA.slice(1).slice(1)

こういうへんてこな書き方も可能というのが理解できると思います。

1
0
0

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
1
0