IT Share you

window.variable 또는 var를 사용해야합니까?

shareyou 2021. 1. 6. 08:10
반응형

window.variable 또는 var를 사용해야합니까?


우리는 다른 많은 JS 파일에서 사용될 패널, 버튼 등을 정의하는 많은 설정 JS 코드를 가지고 있습니다.

일반적으로 다음과 같은 작업을 수행합니다.

grid.js

var myGrid = .....

combos.js

var myCombo = .....

그런 다음 애플리케이션 코드에서 다음을 수행합니다.

application.js

function blah() {
    myGrid.someMethod()
}

someother.js

function foo() {
    myCombo.someMethod();
    myGrid.someMethod();
}

그래서 우리는 var myGrid또는 사용하는 것이 더 나은window.myGrid

차이점이 뭐야?


네임 스페이스 변수를 만드는 것이 좋습니다. var App = {};

App.myGrid = ...

이렇게하면 글로벌 네임 스페이스의 오염을 제한 할 수 있습니다.

편집 : 변수 수 문제-두 가지 가능한 해결책이 떠 오릅니다.

  1. 유형 (그리드, 버튼 등) 또는 관계 (ClientInfoSection, AddressSection 등)별로 네임 스페이스를 추가로 지정할 수 있습니다.
  2. 보유한 구성 요소로 인스턴스화되는 객체에 메서드를 캡슐화합니다.

예 : 당신은

function foo() {
    myCombo.someMethod();
    myGrid.someMethod();
}

된다 :

var Foo = function(combo, grid) {
    var myCombo = combo;//will be a private property
    this.myGrid = grid;//will be a public property
    this.foo = function() {//public method
        myCombo.someMethod();
        myGrid.someMethod();
    }
}
App.myFoo = new Foo(someCombo, someGrid);
App.myFoo.foo();

이런 식으로 작은 객체의 양을 제한하고 필요한 것만 노출합니다 (즉, foo 함수).

추신 : 내부 구성 요소를 노출해야하는 경우 생성자 함수 내부에 추가하십시오.


기능에 잠재적으로 중요한 차이는 즉 window.myGrid일 수 delete(D)와 var myGrid수 없다.

var test1 = 'value';
window.test2 = 'value';


console.log( delete window.test1 ); // false ( was not deleted )
console.log( delete window.test2 ); // true  ( was deleted )


console.log( test1 );  // 'value'         ( still accessible )
console.log( test2 );  // ReferenceError  ( no longer exists )

한 가지 좋은 용도 window.variable는 자바 스크립트 오류없이 확인할 수 있다는 것입니다. 예를 들어 다음이있는 경우 :

if (myVar) {
    //do work
}

myVar페이지의 어디에도 정의 되어 있지 않으면 javascript 오류가 발생합니다. 하나:

if (window.myVar) {
    //do work
}

오류가 없으며 예상대로 작동합니다.

var myVar = 'test'window.myVar = 'test'거의 동일합니다.

그 외에도 다른 사람들이 말했듯이 전역 네임 스페이스를 오염시키지 않으려면 하나의 전역 개체에서 내려 와야합니다.


In global scope the two are in fact equivalent functionality-wise. In function scope, var is certainly preferable when the behaviour of closures is desired.

I would just use var all of the time: firstly, it's consistent with the usually preferred behaviour in closures (so it's easier to move your code into a closure if you decide to do so later), and secondly, it just feels more semantic to me to say that I'm creating a variable than attaching a property of the window. But it's mostly style at this point.


The general answer to the question would be to use var.

More specifically, always put your code in an Immediately Invoked Function Expression (IIFE):

(function(){
  var foo,
      bar;
  ...code...
})();

This keeps variables like foo and bar from polluting the global namespace. Then, when you explicitly want a variable to be on the global object (typically window) you can write:

window.foo = foo;

JavaScript has functional scope, and it's really good to take full advantage of it. You wouldn't want your app to break just because some other programmer did something silly like overwrote your timer handle.


In addition to other answers, worth noting is that if you don't use var inside a function while declaring a variable, it leaks into global scope automatically making it a property of window object (or global scope).


To expand on what Liviu said, use:

App = (function() {
    var exports = {};
    /* code goes here, attach to exports to create Public API */
    return exports; 
})();

By doing that you can hide some of your implementation specific code, which you may not want exposed by using var's inside. However, you can access anything attached to the exports object.

ReferenceURL : https://stackoverflow.com/questions/6904166/should-i-use-window-variable-or-var

반응형