プログラミング講座第4回

第4回の目標：javascriptのやや複雑な機能を確認する。

1.オブジェクト

整数値や文字列などの基本的なデータ型の他に、オブジェクトという概念がある。一つのオブジェクトはいくつかの基本的なデータ型のデータやいくつかのオブジェクトを含む。

例

  person = { name   : "ひろし" ,
             age    : 45       ,
             height : 186      ,
             weight : 75        };

上の例ではpersonという変数の値としてオブジェクトを設定している。

オブジェクトはプロパティを持ち、プロパティはキーとなる名前と値の組である。

上の例では、nameプロパティの値を"ひろし"に設定し、ageプロパティの値を45に設定し、・・・をしている。通常オブジェクトは何らかの意味をもつひとまとまりのデータである。

例

  person = { name   : "ひろし" ,
             age    : 55       ,
             height : 186      ,
             weight : 75        };

  passengerWeight = person.weight;

  person.age = 45;

オブジェクトに格納されている値を使う場合、上の例の6行目のようにする。ここではpassengerWeight変数にpersonに格納されたオブジェクトのweightプロパティの値を設定している。

オブジェクトに格納されている値を変更する場合、上の例の8行目のようにする。ここではpersonに格納されたオブジェクトのageプロパティの値を45に更新している。

例

  car = { };

プロパティを持たないオブジェクトを作ることもできる。

例

  car = { };

  car.color = "red";

オブジェクトへ新たなプロパティを設定することもできる。

例題1 nameプロパティとageプロパティを持つオブジェクトをパラメータとして受け取り、ageが18未満である場合は、"〇〇は未成年"を返し、ageが18以上の場合は"〇〇は成人"を返す関数checkSeijinを定義せよ。〇〇はnameプロパティの値である。また文字列は+で結合することができる。

結果:

例

  students = [ { name: "鈴木", math: 80 },
               { name: "高橋", math: 70 },
               { name: "佐藤", math: 90 },
               { name: "田中", math: 75 },
               { name: "渡辺", math: 85 } ];

  function sumMath (argArray) {
    let i;
    let sum = 0;

    for (i = 0; i < argArray.length; i++) {
      sum = sum + argArray[i].math;
    }
    return sum;
  }

  x = sumMath(students);

オブジェクトの配列を扱うこともできる。上の例ではmathプロパティの値たちの合計を計算する関数を定義して呼んでいる。結果的にxには400が格納される。

例題2 mathプロパティとenglishプロパティを持つオブジェクトの配列を受け取り、mathプロパティの値たちの平均と、englishプロパティの値たちの平均を比べ、mathプロパティの方が大きければ"math"を、englishプロパティの方が大きければ"english"を、等しければ"same"を返す関数mathOrEnglishを定義せよ。

結果:

例題3 nameプロパティとmathプロパティを持つオブジェクトの配列を受け取り、最もmathプロパティの大きいオブジェクトのnameプロパティの値を返す関数goodAtMathを定義せよ。なお、最もmathプロパティが大きい者が複数いれば、nameプロパティの値を配列の順にコンマ(,)で連結して返せ。

結果:

2.高階関数

関数もオブジェクトである。

例

  multiFunc = function (x) {
    return x * 2;
  };

  y = multiFunc(10);

上の例では、1から3行目で変数multiFuncに引数を2倍して返す関数を代入している。変数multiFuncに代入されている関数を呼び出すには5行目のようにする。結果的に変数yには20が代入される。

例

  student = { name      : "太郎" ,
              classroom : "1-1" ,
              greeting  : function () {
                            console.log("hi! I am " + this.name );
                          }
            }

  student.greeting();

オブジェクトのプロパティとして、関数を定義することもできる。上の例では、変数studentにオフジェクトを代入しているが、greetingプロパティにログを出力する関数を設定している。この関数を呼び出すには8行目のようにする。結果的にコンソールに"hi! I am 太郎"が出力される。このようにオブジェクトが持つ関数をメソッドと呼ぶことがある。なお、4行目で使わているthisは特殊なキーワードで、このメソッドを持つオブジェクトを指す。

例

  let myArray = [1, 5, 3, 7, 4, 2, 9, 6, 11];

  f = function (item) {
        if (item % 2 == 0) {
          return true;
        } else {
          return false;
        }
      };

  resultArray = myArray.filter(f)

関数をパラメータにとる関数を高階関数という。上の例では、11行目のfilterが配列myArrayのメソッドであり、高階関数である。filterに渡す関数は3から9行目で定義し、変数fへ代入している。fはパラメータが2で割り切れるならtrueを返し、そうでなければfalseを返す。filterはmyArrayの配列の一つ一つを関数fに渡し、fがtrueを返したものからなる新しい配列を作って返す。結果的に、resultArrayには[2, 4, 6]が代入される。

上の例の処理は繰り返しによっても実現できるが、高階関数を上手に使うと簡潔に分かりやすくプログラミングができる。

例題4 パラメータとして配列をとり、その中で奇数であるものからなる新しい配列を返す関数oddArrayを定義せよ。ただし、上の例のようにfilterを使うこと。また、パラメータの配列は0以上の整数からなるとする。

結果:

例題5 パラメータとしてオブジェクト(nameプロパティ, mathプロパティ, englishプロパティを持つ)の配列をとり、englishプロパティの値のほうがmathプロパティの値より大きいオブジェクトからなる配列を返す関数goodAtEnglishを定義せよ。ただしfilterを使うこと。

結果:

第3回へ目次へ第5回へ

プログラミング講座 第4回

1.オブジェクト

2.高階関数

プログラミング講座第4回