読者です 読者をやめる 読者になる 読者になる

リスを倒す 『初めてのPHP,MySQL,JavaScript&CSS』

『初めてのPHP,MySQL,JavaScript&CSS』勉強奮闘記

15-1.Javascriptの関数、オブジェクト、配列①Javascriptの関数

さあ、15章入ります。
15章は、Javascriptの関数、オブジェクト、配列を勉強します。
関数とオブジェクトの使い方やシンタックスPHPと似ているそうなので、またもおさらいという感じです。
はよ、放置していたとこに着手したいので、さくさくやっていきます。


1-1. 関数の定義


javascriptではdocument.writeで使用してきたwriteなど、数多くのビルドイン関数やメソッドにアクセスできますが、独自の関数も簡単に作成できます。

関数の一般的なシンタックスは以下です。


function function_name([parameter[, ...]])

 statements
}

【関数の定義】
①関数の定義はfunctionではじめる
②そのあとに関数の名前(function_name)をつづけます。これは英字かアンダースコアで始める必要がある
 そのあとは英数字やドル記号、アンダースコアが何文字でも続けることができる
③関数名は大文字、小文字の区別がある(getTinput、GETINPUT、getinputは別々の関数として扱われる)
④関数名には一般的な慣習があり、名前に含まれる単語の最初の文字は関数名の1文字めをのぞいて大文字にする
⑤かっこは必須
⑥1つまたは複数のパラメータはオプション
 (オプションであることは角かっこで表される)
⑦関数の呼び出し時に実行するステートメントは、左の中かっこ({)から始まる

1-2.arguments配列


arguments配列はどの関数でも利用できます。これを使用すると、関数に渡された引数の数と引数の中身を調べることができます。

◎agreements配列を使用しない例


<script>
displayItems("Dog", "Cat", "Pony", "Hamster", "Tortoise")

function displayItems(v1, v2, v3, v4, v5)
{
document.write(v1 + "
")
document.write(v2 + "
")
document.write(v3 + "
")
document.write(v4 + "
")
document.write(v5 + "
")
}
</script>

このスプリクトを呼び出すと次の結果が表示されます。
f:id:taro-blog2323:20161203111913p:plain

これでもいいのですが、何度もdocument,weiteを呼び出すのはプログラミン鵜gとしては無駄なので、agreements配列を使って、少しスリムにします。

◎arguments配列を使用した例


<script>
function displayItems()
{
for (j = 0 ; j < displayItems.arguments.length ; ++j)
document.write(displayItems.arguments[j] + "
")
}
</script>

1-3.値を返す


関数はただ何かを表示するためのものではなく、通常は計算やデータ操作を実行してその結果を返すために使用されます。

一例として、関数fixNamesを使ったコードを見てみます。この関数はarguments配列を使って一連のストリングを受け取り、それを単一のストリングとして返します。この関数が実行する"fix"とは、argumentsに含まれる引数の最初の文字だけを大文字にし、あとの文字を小文字に変換することです。

◎関数fixNamesで名称を整える


<script>
document.write(fixNames("the", "DALLAS", "CowBoys"))

function fixNames()
{
var s = ""

for (j = 0 ; j < fixNames.arguments.length ; ++j)
s += fixNames.arguments[j].charAt(0).toUpperCase() +
fixNames.arguments[j].substr(1).toLowerCase() + " "

return s.substr(0, s.length-1)
}
</script>

結果はこちら。
f:id:taro-blog2323:20161203112858p:plain

1-4.配列を返す


1つのパラメータのみ返すのではなく、複数のパラメータを返したい場合は、配列として返すことで実現できます。

◎値を入れた配列を返す


<script>
words = fixNames("the", "DALLAS", "CowBoys")

for (j = 0 ; j < words.length ; ++j)
document.write(words[j] + "
")

function fixNames()
{
var s = new Array()

for (j = 0 ; j < fixNames.arguments.length ; ++j)
s[j] = fixNames.arguments[j].charAt(0).toUpperCase() +
fixNames.arguments[j].substr(1).toLowerCase()

return s
}
</script>

結果はこちら。
f:id:taro-blog2323:20161203113130p:plain


いじょーーー
きょうは湯けむり温泉にいってまいります。
個人的にこういうのを希望(´-`).。oO