非天マザー by B-CHAN

iPhoneの使い方、IT、金融、経済、不動産、保険、ビジネス、音楽、映画、ニュース、自己啓発などを語ります。

オブジェクト、メソッド、プロパティ

プログラム

 

 

WEBサービスを作りたいので、プログラミングの学習をしていると言う話をしています、最近。

ボクは昔のBASIC言語のプログラマーなので、最近の言語に関しては素人です。

最近の言語のキモとなるのは、たぶん、オブジェクト指向ですよね。

これが、昔のプログラマーにとって、何とも難解で。

と言うか、そんな概念を知らなかったので、概念を身に付けるのが大変です。

 

前回の記事で、ボタンを押すと画像の大きさが変わるプログラムを書きました。

 

www.b-chan.jp

 

 

ソースコード

 

 

そのソースコードはとてもカンタンです。

 

<script>

 

var j = 120;

 

 function big() {  // 大きくする関数を定義

   j = j + 20;  // 20増やす

   if (j > 320) {  // 320を超えたら320にする

   j = 320;

   }

  // pictと言うidのstyle.widthエレメントを決める

  document.getElementById("pict").style.width = j + "px";

}

 

function small() {  //小さくする関数を定義

   j = j - 20;  // 20減らす

   if (j < 120) {  // 120を下回ったら120にする

   j = 120;

   }

  // pictと言うidのstyle.widthエレメントを決める

  document.getElementById("pict").style.width = j + "px";

}

 

</script>

 

<button onClick="big()">大きくなる</button>

<button onClick="small()">小さくなる</button>

<img id="pict" style="width: 120px;" src="https://c2.staticflickr.com/8/7157/6445750229_bd5fea8d92_b.jpg" />

 

 

 

オブジェクト指向は、まだよくわかりませんが、

 

  • オブジェクト
  • メソッド
  • プロパティ

 

 と言う3つの記述をよく見かけます。

英語を理解できる人なら、だいたい意味はわかると思います。

オブジェクトは物体とか対象。

メソッドは方法、手段。

プロパティは属性。

 

数多くの言語が同じ書き方なんですが、

 

  • オブジェクト.メソッド
  • オブジェクト.プロパティ

 

と言う語順です。

例えば、

 

document.bgColor="red";

 

と書けば、documentはオブジェクトで、それにbgColorと言うプロパティを定義します。定義の中身は、redです。

documentはページ全体を指し、それのbgColor、つまり背景色を定義します。ここでは、red、つまり赤色です。

 

では、上記のソースコードを見てみましょう。

 

document.getElementById("pict").style.width = j + "px";

 

getElementByIdは長いですが覚えるしかありません。

これは、documentと言うオブジェクトに付くメソッドです。つまり手段です。

 

  • get
  • Element
  • By
  • Id

 

と分ければカンタンです。

idによって要素をゲットしろ!ってことです。ここではpictと言うidのstyle要素のwidth属性をゲットする、つまり幅を決めるってコトです。

ここに150を入れれば、画像の幅が150ピクセルになるんですね。

 

getElementByIdと言うメソッドがたまたま長い名前なのでややこしいですが、そもそもプログラミング言語は、人間にとってわかりやすくなるように設計されています。

 

document.bgColor="red";

document.getElementById("pict").style.width = j + "px";

 

よく見たら、どちらも同じですよね。

 

 

初心者(ボクも含めて)は、これだけでも、何が何やらと思うかもしれませんが、ボク自身もとりあえず、これだけのことが書けるようになりました。

いつか、この記事を見たときに、ああ、こんなカンタンなことを書いていたんだな、となるかもしれませんね。