Incorporation de JavaScript dans SharePoint

Vous pouvez utiliser des espaces de noms pour éviter les conflits entre vos personnalisations JavaScript et les personnalisations JavaScript standard SharePoint JavaScript ou JavaScript déployées par d’autres développeurs.

Les exemples et solutions OfficeDev/PnP incluent souvent du code JavaScript. Pour faciliter la compréhension des techniques, ces exemples sont généralement simples et n’utilisent pas d’espaces de noms lors de l’incorporation de code JavaScript dans SharePoint. Il est important de vous assurer que vous suivez les étapes simples décrites dans cet article lorsque vous incorporez des exemples PnP dans vos solutions.

Pourquoi l’utilisation d’espaces de noms est-elle importante ?

JavaScript est un langage peu typé. Si vous définissez une variable ou une fonction, et qu’une variable ou une fonction du même nom existe déjà dans le contexte actuel, la nouvelle valeur ou l’implémentation remplacera celle existante. Par conséquent, lorsque vous incorporez du code JavaScript dans SharePoint, il est facile de remplacer le code javaScript SharePoint standard ou les personnalisations déployées par d’autres développeurs. Cela peut créer des conflits qui peuvent être difficiles à identifier et à déboguer.

Pour éviter cela, nous vous recommandons d’utiliser des espaces de noms personnalisés pour votre code JavaScript.

Utilisation des espaces de noms

L’exemple suivant montre un modèle simple utilisé pour organiser le code JavaScript dans des espaces de noms et des classes.

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;
        }
    };
})();

Les fonctions définies dans l’interface publique peuvent être invoquées comme :

MySolution.MyClass1.myFunction1();

MySolution.MyClass1.myFunction2();

Étant donné que tout votre code utilise l’espace de noms MySolution personnalisé, vous pouvez éviter tout conflit d’attribution de noms.

Espaces de noms et stratégie de téléchargement minimal (MDS)

Une fois la fonctionnalité Stratégie de téléchargement minimal activée, les espaces de noms globaux et les variables sont effacés MDS navigation.
Pour conserver votre espace de noms, déclarez-le comme :

    Type.registerNamespace('MySolution');

L’espace de noms type est spécifique à SharePoint, pour une utilisation de bibliothèque JavaScript générique :

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

Espaces de noms, MDS et CSR (rendu côté client)

La RegisterModuleInit fonction déclare un espace de noms Type approprié.
Les fichiers joints à JSLink ne sont pas réexécutés sur MDS navigation, utilisez les fonctions AsyncDeltaManager pour cela.

Voir aussi :