Étiquette : array

[Javascript] Accéder dynamiquement et via un chemin sous forme de chaîne de caractères à une information consignée dans un objet ou un tableau JS

Source: DYNAMICALLY Accessing nested JavaScript objects and arrays by string path et un petit jsFiddle pour la route.

[javaScript] Rechercher si une valeur est déjà présente dans un tableau bi-dimensionnel

[Javascript] Supprimer les entrées dupliquées d’un tableau clé/valeur

Source: Removing elements from an array of objects based on duplicate values of multiple keys

[javaScript] boucler dans un tableau

Source: How to loop through array in jQuery?

javaScript

jQuery

ES5

[javaScript] Mettre en cache un sous-niveau de navigation pour éviter un crash du navigateur sous iOS (iPhone)

Inspiration pour ce code:


Je pars d’un menu dont la structure HTML est la suivante (une liste imbriquée simple) : https://jsfiddle.net/xpvt214o/513005/.

Sous iPhone, le menu a visiblement trop d’entrées. En tout cas lorsqu’on l’affiche, le navigateur Safari crashe et recharge la page. J’ai remarqué au cours de mes tests qu’en supprimant le dernier sous-niveau d’arborescence (.level2 dans mon exemple), le navigateur ne crashait plus. J’ai donc mis en place un système de cache du dernier sous-niveau d’arborescence de mon menu.

Ce système consiste à mettre en cache dans un tableau javaScript array et à l’aide des méthodes .push() et .detach() (jQuery) tous les derniers sous-niveaux d’arborescence. Ils ne sont, de cette manière, plus présents dans le DOM lorsqu’on ouvre le menu qui se trouve ainsi beaucoup plus léger à manipuler.

A l’activation d’un sous-menu mis en cache, on le fait ré-apparaître dans le DOM en le sortant du tableau. On fait le lien entre la rubrique activée et la sous-rubrique correspondante via un système d’IDs:

On invoque la fonction searchStringInArray pour rechercher dans l’intégralité des entrées du tableau cachedMenuEntries l’information [*].context.id qui va matcher avec l’ID de la rubrique que nous venons d’activer:

Axes d’amélioration

  • Utiliser un tableau clé/valeur (key/value)

D’autres pistes si vous avez des crashes iOS

[Javascript] Filtrer les éléments d’un tableau et stopper à la première occurrence qui matche

ECMAScript:

Sources: JavaScript filter that stops at the first result et Array.prototype.find().

Javascript:

Source: How to Search Arrays in JavaScript: Searching Arrays Using for Loops.

[jQuery] Alimenter un tableau à partir d’une boucle .each() avec .push() et générer une liste UL LI avec les données stockées dans celui-ci

Sources: How to create an array from .each loop with jQuery et How to generate UL Li list from string array using jquery?.

[LESS] Un mixin pour boucler dans un tableau contenant des valeurs allant par pairs

Attention: le plugin for.less utilisé dans l’exemple ci-dessous est déprécié selon un commenatire laissé dans le code source de l’auteur. Il faut désormais utiliser List/Array manipulation for Less.

Source: Loop over an array of name value pairs in LESS et mixin sous Git.

CSS color codes & names (tableaux de correspondances Nom de couleur > Code hexadécimal).

Mixin LESS (ne pas oublier d’inclure le mixin for.less) :

Rendu CSS :