Freigeben über


Einbetten von JavaScript in SharePoint

Sie können Namespaces verwenden, um Konflikte zwischen Ihren JavaScript-Anpassungen und standardmäßigen SharePoint-JavaScript- oder JavaScript-Anpassungen zu vermeiden, die von anderen Entwicklern bereitgestellt werden.

Die OfficeDev/PnP-Beispiele und -Lösungen enthalten häufig JavaScript-Code. Um die Techniken verständlich zu machen, sind diese Beispiele in der Regel einfach und verwenden keine Namespaces beim Einbetten von JavaScript-Code in SharePoint. Es ist wichtig, dass Sie die in diesem Artikel beschriebenen einfachen Schritte ausführen, wenn Sie PnP-Beispiele in Ihre Lösungen integrieren.

Warum die Verwendung von Namespaces wichtig ist

JavaScript ist eine lose typisierte Sprache. Wenn Sie eine Variable oder Funktion definieren und eine Variable oder Funktion mit demselben Namen bereits im aktuellen Kontext vorhanden ist, ersetzt der neue Wert oder die neue Implementierung die vorhandene. Daher ist es beim Einbetten von JavaScript-Code in SharePoint ganz einfach, standardmäßigen SharePoint-JavaScript-Code oder von anderen Entwicklern bereitgestellte Anpassungen zu überschreiben. Dies kann zu Konflikten führen, die möglicherweise schwer zu identifizieren und zu debuggen sind.

Um dies zu vermeiden, empfiehlt es sich, benutzerdefinierte Namespaces für Ihren JavaScript-Code zu verwenden.

Verwenden von Namespaces

Das folgende Beispiel zeigt ein einfaches Muster zum Organisieren von JavaScript-Code in Namespaces und Klassen.

var MySolution = MySolution || {};

MySolution.MyClass1 = (function () {
    // private members
    var privateVar1 = 1;
    var privateVar2 = 2;
    
    function privateFunction1(){
      return "";
    }
    
    return {
        // public interface
        myFunction1: function() {
          return privateVar1;
        },
        myFunction2: function(){
          return privateVar2;
        }
    };
})();

Funktionen, die in der öffentlichen Schnittstelle definiert sind, können wie folgt aufgerufen werden:

MySolution.MyClass1.myFunction1();

MySolution.MyClass1.myFunction2();

Da ihr gesamter Code den benutzerdefinierten MySolution-Namespace verwendet, können Sie Benennungskonflikte vermeiden.

Namespaces und Minimale Downloadstrategie (MDS)

Wenn das Feature "Minimale Downloadstrategie" aktiviert ist, werden globale Namespaces und Variablen in der MDS-Navigation gelöscht.
Um Ihren Namespace beizubehalten, deklarieren Sie ihn als:

    Type.registerNamespace('MySolution');

Der Typnamespace ist für SharePoint spezifisch, um eine generische JavaScript-Bibliothek zu verwenden:

if (window.hasOwnProperty('Type')) {
    Type.registerNamespace('MySolution');
} else {
    window.MySolution = window.MySolution || {};
}

Namespaces, MDS und CSR (clientseitiges Rendering)

Die RegisterModuleInit Funktion deklariert einen richtigen Type Namespace.
Dateien, die mit JSLink angefügt sind, werden in der MDS-Navigation nicht erneut ausgeführt. Verwenden Sie hierfür die Funktionen AsyncDeltaManager.

Siehe auch: