Partager via


Incorporation de JavaScript dans SharePoint

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

Les exemples et solutions OfficeDev/PnP incluent souvent du code JavaScript. Afin de 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 des espaces de noms est importante

JavaScript est un langage faiblement typé. Si vous définissez une variable ou une fonction, et qu’une variable ou une fonction portant le même nom existe déjà dans le contexte actuel, la nouvelle valeur ou implémentation remplace 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 appelées comme suit :

MySolution.MyClass1.myFunction1();

MySolution.MyClass1.myFunction2();

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

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

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

    Type.registerNamespace('MySolution');

L’espace de noms Type est spécifique à SharePoint. Pour une bibliothèque JavaScript générique, utilisez :

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 approprié Type .
Les fichiers joints avec JSLink ne sont pas réexécutés sur la navigation MDS. Utilisez les fonctions AsyncDeltaManager pour cela.

Voir aussi :