web-dev-qa-db-ja.com

JavaScriptのグローバル関数

私はjsが初めてで、グローバル関数とプライベート関数を理解しようとしています。グローバル変数とローカル変数を理解しています。しかし、test.htmlという名前のhtmlとtest1.jsおよびtest2.jsという名前の2つのjsファイルがある場合。ここで、test1.jstest2.jstest.htmlに含め、test2.jstest1.js内のtest.htmlで記述された関数を呼び出します。

Test2.jsで記述した関数はこの形式です

function abc(){...}

function pqr(){...} etc.

これらの上記の機能はグローバルですか?もしそうなら、どうすればそれらをグローバルにせずにtest1.jstest.htmlでそれらにアクセスできますか?

グローバル関数またはグローバル変数を読んだのは悪いことですか?

15
ugandajs

JSのすべては、包含スコープにバインドされています。したがって、functionをファイルで直接定義すると、windowオブジェクトにバインドされます。つまり、グローバルになります。

「プライベート」にするには、これらの機能を含むオブジェクトを作成する必要があります。グローバルスコープをポイ捨てすることは悪いことですが、アクセスするにはグローバルスコープに何かを配置する必要があります。JSライブラリは同じことを行い、他の回避策はありません。しかし、グローバルスコープに何を入れるかを考えてみると、単一のオブジェクトで「ライブラリ」に十分な量を確保できます。

例:

MyObject = {
    abc: function(...) {...},
    pqr: function(...) {...}
    // other functions...
}

どこかでabcを呼び出すには、同じファイルでも別のファイルでもかまいません。

MyObject.abc(...);
18
Marko Grešak
var SomeName = function() {

    var function1 = function (number) {
        return number+1;
    }

    var anotherFunction = function (number) {
        return number+2;
    }

    return {
        function1: function (number) {
            return function1(number);
        },
        function2: function (number) {
            return anotherFunction(number);
        }
    }
}();

呼び出し

console.log(SomeName.function1(1)); //ログ2

console.log(SomeName.function2(1)); //ログ3

5
fellak

ラッパーの種類なしでファイルに定義されたものはすべて、ウィンドウオブジェクトにバインドされます。ウィンドウオブジェクトにバインドされているものはすべてグローバルです。

例:

//these are global variables
foo = 123;
var ABC = 'school';

//these are "private" variables
test = function(){
  var foo = 123
}

(function(){
  var ABC = 'school';
}).call(this);

すべてのファイルのグローバル変数はwindowオブジェクトの一部になるため、ファイル間でアクセスできます。 「プライベート」変数を作成するときは、varを追加することが重要です。これは、現在の「ラッパー」内のグローバル変数をオーバーライドすることを意味します。グローバル変数fooがあり、varを持つ関数で再度定義すると、それらは分離されます。

var foo = 123;
(function(){
  var foo = 987; //this foo is separate from the above foo
}).call(this);

「ラッパー」があり、グローバル関数を定義する場合は、次のようにします。

window.foo = 123;
(function(){
  window.foo = 123;
}).call(this);

両方の関数は同じことを行います。

個人的には、すべてをラッパーに入れて、windowを使用して必要な場合にのみグローバル変数を定義することを好みます。

(function(){

  //all code goes here

  //define global variable
  window.foo = 123;

})call(this);
2
Christian Juth

グローバル変数が悪い理由を理解していない場合、なぜそれらを回避しようとしていますか?

グローバル関数は必ずしも悪いわけではありません。悪いのは、誰でも何でも変更するという状態です。

一般に、Javascriptを初めて使用するので、htmlタグにscriptタグを介して含める複数のjavascriptファイルにまたがるグローバル関数から始めることは問題ありません。

初心者から中級に移行する際、「モジュール」ソリューションを検討する必要があります(個人的には RequireJS をお勧めします)。

ただし、現時点では、より単純なモジュールパターンで間に合わせることができます。

var T1 = function() {
   return < some module object >
})(); // notice the parenthesis

Google「Javascriptモジュールパターン」。

this answer も参照してください。

1
hasen