即時関数とイベントハンドラについて

質問

javascriptは全体を即時関数で囲って、変数の有効範囲を制限したほうが良いということを知りました。しかしスクリプト全体を囲ってしまうと、関数にもアクセスできなくなってしまいます。イベントハンドラで外部から関数を使用したい場合は、全体を囲うべきではないということでしょうか。
もし対処方法がありましたら、教えてくださると助かります。

回答No.1

Gotthold · ベストアンサー

イベントリスナの追加は、関数をグローバルに公開しなくてもできますよね。
=================================
<input type="button" value="test" id="test">
<script>
(function(){
　var test = document.getElementById('test');
　test.addEventListener('click', function() {
　　alert("クリックされた");
　}, false);
})();
</script>
=================================

公開したい関数などがあるならその関数だけを公開すれば良いです。
公開したい関数が多い場合は、1つのオブジェクトを名前空間代わりにして
グローバル汚染を最小限にした方が名前の衝突の恐れが減ります。
=================================
<script>
(function(global){
　var mylib = {}; //名前空間代わりのオブジェクト
　mylib.func1 = function(){alert("func1");};
　mylib.func2 = function(){alert("func2");};
　global.mylib = mylib; //mylibにはグローバルからアクセスできるように

　var func3 = function(){alert("func3");}; //非公開
})(this);

mylib.func1(); //外から参照
mylib.func2();
</script>
=================================

お礼

お礼が遅くなり申し訳ありません。
大変参考になりました。
ありがとうございました。