Prototiplerin global ad alanına girmesine izin vermeden web bileşenleri arasındaki bağımlılıkları nasıl koruyabilirim?

Question

Üzerinde çalıştığım bir uygulamada tanımlanmış bir dizi özel öğe var. Şu anda, elementlerimi prototipledim ve isimleri global isim alanında oturdum. Her öğenin, öğeyi oluşturmam gerektiğinde içe aktardığım kendi HTML dosyası vardır. Temel bir HTML dosyası şu şekilde görünecektir:

<script type="text/javascript" src="hello-world.js"></script> 

Bu aşağıdaki js dosyasına işaret: Diğer özel öğeleri var

var helloWorldPrototype = { 
    is : "hello-world", 
}; 

Polymer(helloWorldPrototype); 

Sonra kullanacağım bu prototipini istiyorum Polimer'in sağladığı 'davranışlar' özelliğini kullanarak gerçekleştirdiğim bir taban olarak web bileşeni. bağımlılıkları tüm HTML ithal, bu yüzden benim ikinci HTML şöyle edilir: Bu, karşılık gelen js hello-earth.js bulunan etti

<link rel="import" href="hello-world.html"> 
<script type="text/javascript" src="hello-earth.js"></script> 

:

var helloEarthPrototype = { 
    is : "hello-earth", 
    behaviors : [helloWorldPrototype] 
}; 

Polymer(helloEarthPrototype); 

Benim sorundur ben gibi şimdi olur o Tüm bu prototip nesnelerini global ad alanından çıkarın. hello-world bileşeni için, ben şöyle bir kendi kendine çalışan fonksiyon bloğunda benim prototipi enkapsüle yapabilirsiniz: bununla

(function(){ 
    var helloWorldPrototype = { 
     is : "hello-world", 
    }; 

    Polymer(helloWorldPrototype); 
})(); 

sorun helloWorldPrototype artık helloEarthPrototype kullanılabilir olmasıdır. Benim özel elementlerimin prototiplerini global isim-alanına yerleştirmekten nasıl kaçınamayım, ama hala miras amaçları için onlara erişim vermelerini nasıl sağlayabilirim?

Answer 1

Nesneleri farklı JavaScript dosyalarında paylaşmak istiyorsanız, en az bir global object referansına sahip olmanız gerekir. İçerisinde paylaşmak istediğiniz kaynakları (attributes olarak) ekleyebilirsiniz. Başka dosyada

MyAppNS.helloWorldPrototype = { 
    is: "hello-world" 
} 
Polymer(MyAppNS.helloWorldPrototype) 

:

var MyAppNS = {} // or window.MyAppNS = {} 

Sonra size tanımlamak ilk prototip ve Özel Eleman edebilirsiniz:

Exemple, bir ad olarak hareket edecek MyAppNS adında bir nesneyi tanımlayabilirsiniz Başka bir prototip ve Özel Öğe tanımlayabilirsiniz:

MyAppNS.helloEarthPrototype = { 
    is : "hello-earth", 
    behaviors : [MyAppNS.helloWorldPrototype] 
} 
Polymer(MyAppNS.helloEarthPrototype)