자바 스크립트 전역 대안

Question

내가 프레임 워크 사용하고 있습니다 (유성,하지만 난 생각 문제에 대한 문제가되지 않습니다) 별도의 기능을 제공합니다 ..

내 문제는 내가 있습니다 내가 더 많은 전역 변수를 사용하고 실현 이러한 기능들 사이에서 이들을 액세스 가능하게 만들 수 있습니다. 예를 들어, 지도 객체 : 나는 같은 문제가

Template.messages.events({ 
    'click .delete-message': function (e,t) { 
    e.stopPropagation(); 
    removeItem(e.target.id); 
    }, 
    'click .message': function (e,t) { 
    console.log('event clicked'); 
    map.setView([e.target.getAttribute('data-lat'),e.target.getAttribute('data-lng')], 16); 
    } 
}); 

:

Meteor.startup(function() { 
    map = L.map('map_canvas').locate({setView: true, maxZoom: 21}); 
    L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
     attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' 
    }).addTo(map); 
}); 

나는 예를 들어 (리플릿의 사용) 내지도를 조작 할 수 지도 사방에 접근 할 필요가 다른 곳에서 사용하고 싶은 표식 개체를 만들고 싶을 때 ...

유성이 이런 방식으로 만들어 졌는가, 아니면 더 적절한/깨끗한 JS인지 글로벌하게 물건을 만드는 것보다 오히려 전구적일까요?

편집 답장을 보내 주셔서 감사합니다. 예를 들어 언급 한 패턴 중 하나를 사용하지만 코드를 기반으로 한 코드 예제를 추가 할 수 있습니까? 이 방법으로 나는 그것을 훨씬 더 잘 이해할 수있었습니다.

Answer 1

js 변수 과 기능을 전역으로 만들지는 여러 가지 방법이 있습니다.

1. 당신은 해시 맵 같은 객체를 사용하고 점 표기법으로 변수에 액세스 할 수 있습니다. 객체는 여전히 글로벌하지만 적어도 충돌 할 수있는 전역 이름은 적습니다.
2. namespace.js을 사용할 수 있습니다.
3. pseudo-oo style using closures을 사용할 수 있습니다.
4. coffeescript을 사용할 수 있습니다.
5. namespace.js 외에도 dojo.js과 같은 많은 프레임 워크가 모듈을 허용합니다.
6. 아마도 다른 많은 옵션이 있습니다.

Dojo.js와 나는 require.js이 모듈 식 디자인을 권장한다고 생각합니다. (그 중에서도) 네임 스페이스는 포함하고 사용하기가 쉽고 코드 변경이 가장 적은 문제를 해결할 수 있습니다. 나는 과거에 그것을 글로벌 스타일에서 더 많은 스타일로 바꾸기 위해 사용했습니다.

옵션 1, 해시 맵

var GKApp = new Object(); 
GKApp.map = blah; 
GKApp.size = 1; 
GKApp.doSomethingWithMap = function() { 
    GKApp.map.blah(); 
} 
// Now the only global is GKApp. 
// Later, make the call. 
GKApp.doSomethingWithMap.call(); 

옵션 3, 클로저

당신은 아래와 같이 순수 자바 스크립트 클로저를 사용하거나 define 사용 dojo.js이 포장 또는 요구할 수 있습니다. js.

GKApp = function(pmap) { 
    // dbg.log("GKApp constructor."); 
    // You can consider the closure to 'begin' here. 

    // ******************************************************** 
    // @private variables: 
    // ******************************************************** 
    var map = pmap; 

    /** 
    * @privileged method which has access to variables in the closure. 
    * These variables are not available outside of the closure. 
    * An anonymous function has access to variables in the outer scope or, the closure. 
    */ 
    this.doSomethingWithMap = function() { 
     map.blah(); 
    }; 
}; 

// Later, instantiate an object and use it. 
var gkApp = new GKApp(map); 
gkApp.doSomethingWithMap();