今日の参考コード

array.length

さてまずはコードを見てみましょう。

初めて使う機能でも、我々にはテストという強い味方がありますから、これを使うことでどんなことが起きるのかを確かめることができます。

それから以下のようにテストコードを示すことで、他人にその機能を示すことも容易です。

describe("length", () => {
  it("配列の長さ = element の個数", () => {
    const members = ["nakanishi", "jim", "john"];
    const res = members.length;
    expect(res).toEqual(3);
  });
});

まずは length の使用対象が、 members という配列がしまわれた変数であることを確認してください。

length は配列に対して使える

.length を配列に対して実行していますね。

そう、配列だったらどんなものでも、この .length が実行できます。

array.length は配列の長さを教えてくれる

array.length は配列の長さを返してくれます。

配列の長さとはつまり、配列の中に入っている要素 = element の数です。

今回の配列は 3 人の名前が入っていますから、配列の element は 3個あります。ですから length は 3 です。

describe("length", () => {
  it("配列の長さ = element の個数", () => {
    const members = ["nakanishi", "jim", "john"];
    const res = members.length;
    expect(res).toEqual(3);
  });
});

配列以外にも .length は使えるのか

実はできます。

describe("length", () => {
  it("文字列の長さ = 文字数", () => {
    const strings = "my awesome strings";
    const res = strings.length;
    expect(res).toEqual(18);
  });
});

文字列の長さはつまり、文字数です。空白も数えています。

.length は少なくとも配列と文字列に対して使えるということはわかりました。

配列と文字列に .length とつなげるだけでこんなことが起こるのは、最初から JavaScript が用意してくれているから

さて、何も自分では用意していないのに、なぜ「配列や文字列の後ろに length とつなげるだけで」こんな機能が発動するのでしょうか。

実は、これは JavaScript が最初から用意してくれているからです。

こんなふうに JavaScript が最初から用意していくれているものはたくさんあります。

こういう最初から用意されているものの一つが、.length です。

.length と . でつなぐのは、平たく言えば object のプロパティにアクセスしている

. でつなぐ書き方、見覚えがありませんか。

そうです。オブジェクトのプロパティにアクセスするときの書き方です。

思い出してください。

const nakanishi = {
  name: "nakanishi",
  age: 34
};

const nakanishiName = nakanishi.name

実は、array.length も array の length というプロパティにアクセスしています。

勝手に用意されてるんですね。

ここに配列の長さを示す数値を、JavaScript が常に用意してくれています。

ありがとう JavaScript!!!

宿題

• テストを書きながら、
• 配列を作ってその長さをチェックする
• 文字列を作ってその長さをチェックする

今日は以上です！！