function(関数・メソッド)

function(関数・メソッド) – メディアデザイン実習J1.関数を使う
プログラムコードは、上から順に実行されます。

次の例は、名前を表示するサンプルです。

ここにある alert は、ダイアログボックスを表示するための「関数」です。
命令のようなものと考えればよいでしょう。

alert関数の引数として、myNameという変数を渡すことで、ダイアログボックスに名前が表示されます。

このようなJavaScriptの関数はたくさんあります。基本的にプログラミングとは、関数をたくさん覚えて使いこなすことで進めていきます。

 

2.関数を作って使う
関数は、プログラム内で自分で定義することができます(ユーザー定義関数)。

これは、ダイアログボックスを10回表示する関数です。
この関数を使用するには、

のように書けば良いです。

引数には、リテラルのところで説明したあらゆるデータ値が使えます。
また、引数はいくつも使えます。引数が無くてもOKです。

 

3.メソッド
関数のうち、オブジェクトクラスに含まれるものは、オブジェクトの「メソッド」と言います。が、これはオブジェクト指向プログラミングを理解した後で考えることなので、「関数」と「メソッド」はだいたい同じ意味だと覚えておいてください。
誰かプログラマーから「このメソッドがね…」なんて言われたときに「ああ、functionのことだな」だと思って聞くことができれば大抵の場合は十分話は通じます。

 

4.スコープ
変数には、有効範囲があります。有効範囲のことをスコープと言います。
JavaScriptのスコープは2種類。

  • プログラム全体で変数が有効となる「グローバルスコープ」
  • 関数(function)のなかだけで変数が有効な「ローカルスコープ」

グローバルスコープの例

hoge変数はグローバルで、プログラムのどこからでも参照できる変数です。
functionの中でも呼べます。
よって、このプログラムでは2回「あうあうあー」と表示されます。

ローカルスコープの例

hoge変数はtest関数のなかのローカルスコープに属しています。
test関数の外からは参照できません。
最初にtest();が実行されたときは「あうあうあー」と表示されますが、
最後の行では「undefined」つまり、変数は定義されていないと表示されてしまいます。

混合した例(※あまりよくない実装だが、動作原理を理解する)

この例では、グローバルスコープのhoge変数と、ローカルスコープのhoge変数がそれぞれ別に定義されています。スコープが違いますので、上書きはされません。
最初にtest();が実行されたときは、test関数内部のローカル変数hogeが参照されます。
最後の行では、グローバル変数hogeが参照されます。
つまり、「(・ω・)」と表示された後に「あうあうあー」と表示されます。

通常このように同じ変数名でいろいろ違う場所に定義するのは、書いてる本人がこんがらがってしまうので良くないです。

わかりやすくするためによく使う手としては、
ローカル変数には頭に _ アンダーバーをつけます。

これで、もし似た名前のものがあっても間違えずに済みますね。


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です