with文を使ってみる - cutmail's blog

javascriptってPHPとは違った書き方がいろいろあっておもろいです。

たまたま読んでいたソースのなかにwith文があったのですが、そんなの知らない自分は早速リーフって見たわけです。

with文を使用すると、親オブジェクトの名前を予約することができ、あとあと省略することができるらしいです。

具体的には以下のソースを。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>javascriptのwith</title>
<script type="text/javascript">
function test() {
  with(document.getElementById('hoge')){
	alert(innerHTML);
  }
}
</script>
</head>
<body>
<div id="hoge">hogehoge</div>
<input type="button" onclick="test();" value="クリック" />
</body>
</html>

demo

ものすごいわかりにくいので、下のサンプルがわかりやすいかと。
以下の二つの関数は同じ意味なのです。

function math1(){
document.write( Math.ceil(10.5) ); //　小数点切り上げの値を表示
document.write( Math.PI ); // 円周率πを表示
}
function math2(){
with( Math ){
document.write( ceil(10.5) ); //　小数点切り上げの値を表示
document.write( PI ); // 円周率πを表示
}
}
math1();
math2();
JavaScript with文