Supprimer des éléments de tableau avec de jonction pour la boucle

Je veux mettre en œuvre une sorte de jQuery live search.
Mais avant d'envoyer les données d'entrée du serveur, je voudrais supprimer tous les éléments dans mon tableau qui ont 3 ou moins de personnages (parce que dans la langue allemande, ces mots peuvent généralement être ignorées en termes de recherche)
Donc ["this", "is", "a", "test"] devient ["this", "test"]

$(document).ready(function() {
var timer, searchInput;
$('#searchFAQ').keyup(function() {
    clearTimeout(timer);
    timer = setTimeout(function() {
        searchInput = $('#searchFAQ').val().match(/\w+/g);
        if(searchInput) {
            for (var elem in searchInput) {
                if (searchInput[elem].length < 4) {
                    //remove those entries
                    searchInput.splice(elem, 1);
                }
            }
            $('#output').text(searchInput);
            //ajax call here
        }
    }, 500);
});
});

Maintenant, mon problème est que pas tous les éléments sont supprimés dans ma boucle for.
Si j'ai par exemple typ "ceci est un test" "est" est supprimée, "une" reste.
JSFIDDLE

Je pense que le problème est pour la boucle parce que les indices de la matrice de changement si je supprime un élément avec l'épissure, donc, il va avec le "mauvais" index.

Peut-être quelqu'un pourrait m'aider?

  • Je ne vois pas pourquoi ce ne devrait pas être fait côté serveur. Rappelez-vous, il est toujours possible que JavaScript soit désactivé par l'utilisateur.
  • Vous avez raison, mais les deux façons devrait être possible. Serveur et côté client.
  • Quel est l'avantage de le faire côté client, si? Vous êtes seulement enlever une douzaine de caractères avant de les transférer à la chaîne de recherche, et que vous allez répéter la vérification côté serveur, de toute façon. Cela est valable uniquement si vous souhaitez retourner des erreurs de l'utilisateur avant de l'envoyer.
  • Eh bien, j'ai aussi pensé à cela, mais disons que c'est plus comme un exercice pour moi. En fait, il est plus intelligent de laisser le serveur faire le travail, mais j'ai commencé et je voulais une solution de travail 😉
InformationsquelleAutor SirDerpington | 2013-04-25
  1. 134

    Solution 1

    Vous pouvez faire une boucle à l'envers, avec quelque chose comme ce qui suit:

    var searchInput, i;

searchInput = ["this", "is", "a", "test"];
i = searchInput.length;
while (i--) {
    if (searchInput[i].length < 4) {
        searchInput.splice(i, 1);
    }
}

    DÉMO: http://jsfiddle.net/KXMeR/

    C'est parce que l'itération progressivement par le biais de la matrice, lorsque vous splice, le tableau est modifié, de sorte que les éléments sont "décalés" et vous vous retrouvez le saut de l'itération de certains. Boucle vers l'arrière (avec un while ou même un for boucle) résout ce parce que vous n'êtes pas en boucle dans la direction que vous êtes épissage.

    Solution 2

    Dans le même temps, il est généralement plus rapide pour générer un nouveau tableau au lieu de modifier un en place. Voici un exemple:

    var searchInput, newSearchInput, i, j, cur;

searchInput = ["this", "is", "a", "test"];
newSearchInput = [];
for (i = 0, j = searchInput.length; i < j; i++) {
    cur = searchInput[i];
    if (cur.length > 3) {
        newSearchInput.push(cur);
    }
}

    où newSearchInput ne contiennent validité de la longueur des articles, et vous avez encore les éléments d'origine dans searchInput.

    DÉMO: http://jsfiddle.net/RYAx2/

    Solution 3

    En plus pour la deuxième solution ci-dessus, un semblable, de nouveaux Array.prototype méthode est disponible pour le gérer mieux: filter. Voici un exemple:

    var searchInput, newSearchInput;

searchInput = ["this", "is", "a", "test"];
newSearchInput = searchInput.filter(function (value, index, array) {
    return (value.length > 3);
});

    DÉMO: http://jsfiddle.net/qky7D/

    Références:

    • Grâce à ce fait. Parfois, vous avez juste à aller à plein retardée et votre cerveau bloquer toutes les façons intelligentes de penser 😀 je vais accepter cette réponse le plus tôt possible 😉
    • haha pas de problème, et merci 🙂 Oui, tout dépend de votre mise en œuvre. Je préfère le premier exemple, sauf si vous avez besoin de l'original de la matrice de référence, même si splice est un peu plus lent (que vous ne voyez pas la différence de vitesse à moins que ce code a couru plusieurs fois rapidement sur un immense tableau).
    • looping in the direction you're splicing concept étonnant.
    • Je dirais que vous avez sauvé ma journée, mais j'ai déjà perdu ma journée à essayer de comprendre pourquoi mon code ne fonctionnait pas 😀
    • Solution exacte avec les explications appropriées. Merci beaucoup.
    • Cela m'a bien aidé! Pourrait décrémentation de l'index lors de l'épissage être la solution #4?
    • Grand, la solution! Une chose que dans la première solution, i doit être pré-décrémenté? Je pense, c'est la façon dont il a travaillé pour moi.

    InformationsquelleAutor Ian
  2. 5
    var myArr = [0,1,2,3,4,5,6];

    Énoncé du problème:

    myArr.splice(2,1);

  \\ [0, 1, 3, 4, 5, 6];

    maintenant 3 se déplace à la deuxième position et la longueur est réduite de 1 qui crée problème.

    Solution: Une solution simple serait de l'itération dans le sens inverse lors de l'épissage.

    var i = myArr.length;
while (i--) {
    //do your stuff
}
    InformationsquelleAutor Arun Pratap Singh
  3. 2

    Si vous avez la lodash installé la librairie, ils ont un doux bijou que vous pourriez envisager.

    La fonction est _.forEachRight (itère sur les éléments d'une collection à partir de la droite vers la gauche)

    Ici est un exemple.

    var searchInput = ["this", "is", "a", "test"];

_.forEachRight(searchInput, function(value, key) {

    if (value.length < 4) {
        searchInput.splice(key, 1);
    }
});
    • très joli.. vraiment utile..Merci
    InformationsquelleAutor Clinton Dobbs
  4. 1

    Vous pouvez également utiliser $.grep fonction pour filtrer un tableau:

    var timer, searchInput;
$('#searchFAQ').keyup(function () {
    clearTimeout(timer);
    timer = setTimeout(function () {
        searchInput = $('#searchFAQ').val().split(/\s+/g); //match is okay too
        searchInput = $.grep(searchInput, function(el) {
            return el.length >= 4;
        });
        console.log(searchInput);
    }, 500);
});

    http://jsfiddle.net/dfsq/4Wdp9/

    InformationsquelleAutor dfsq
  5. 0

    Une autre approche serait de décrémenter l'index à chaque fois que vous tranche de tableau (x--), de sorte que lorsque le tableau devient décalée vers le bas de l'élément suivant à ne pas avoir sauté.

    var searchInput;

searchInput = ["this", "is", "a", "test"];
for (var x = 0; x < searchInput.length; x++) {
    if (searchInput[x].length < 4) {
        searchInput.splice(x--, 1);
    }
}

console.log(searchInput);

    DÉMO: https://jsfiddle.net/alinaeem229/n2kq3690/1/

    InformationsquelleAutor Muhammad Ali