L'équivalent de trait de Soulignement _.plumer en JavaScript

Je suis en train de recréer le trait de Soulignement arracher la fonction à l'aide de pure JS. Cependant, je reçois un tableau de undefineds être retourné, au lieu de la valeur réelle des propriétés des objets dans un tableau.

De vérifier un autre thread ici j'ai trouvé que vous pouvez reproduire en jQuery avec le code suivant...

$.pluck = function(arr, key) { 
    return $.map(arr, function(e) { return e[key]; }) 
}

...cependant, je vais avoir de la difficulté à reproduire simplement ce dans le plus pur JS. J'ai essayé le suivant, mais ce n'est qu'en retournant un tableau de undefineds pour moi. 

var pluck = function(arr,key){
  var newArr = [];
  for (var i = 0, x = arr.length; i < x; i++){
    if (arr[i].hasOwnProperty(key)){
      newArr.push(arr[i].key)
    }
  }
  return newArr;
}

Ainsi, le but serait la suivante, sauf qu'au lieu d'utiliser le trait de soulignement"_.plumer, il suffit d'utiliser un JS nom de la fonction, par exemple. var arracher = function(arr,key){...}

var Tuts = [{name : 'NetTuts', niche : 'Web Development'}, {name : 'WPTuts', niche : 'WordPress'}, {name : 'PSDTuts', niche : 'PhotoShop'}, {name : 'AeTuts', niche : 'After Effects'}];
var niches = _.pluck(Tuts, 'niche');

console.log(niches);

//["Web Development", "WordPress", "PhotoShop", "After Effects"]

Quelqu'un pourrait-il m'orienter dans la bonne direction?

  • La bonne chose à propos de Souligner, c'est que son code source est disponible en ligne dans annoté de la forme, de sorte qu'il est assez facile de le lire et de voir ce qu'ils font. Voici la source pour _.pluck(), bien qu'il est principalement composé de _.map() et _.property().
InformationsquelleAutor wesleysmyth | 2014-09-08
  1. 29

    Dans l'ES5:

    function pluck(array, key) {
  return array.map(function(obj) {
    return obj[key];
  });
}

    Dans ES6: 

    function pluck(array, key) {
  return array.map(o => o[key]);
}
    • +1 pour la plus simple ES2015 version. Encore plus simple serait d'utiliser theArray.map(item => item.theKey) sans créer pluck fonction.
    • J'aime la ES2016 version. Une fois que vous avez utilisé avec lamba fonctions qu'ils sont comme l'herbe à chat.
    • const pluck = (arr, key) => arr.map(o => o[key])
    InformationsquelleAutor Gilles Castel
  2. 14

    Vous pouvez le faire avec du JavaScript natif .map():

    Array.prototype.pluck = function(key) {
  return this.map(function(object) { return object[key]; });
};

    modifier — modification intégrée prototype des objets doit être fait avec soin; une meilleure façon d'ajouter de la fonction (si vous êtes OK avec l'idée de le faire en général) serait avec Object.defineProperty de sorte qu'il peut être rendu non énumérable:

    Object.defineProperty(Array.prototype, "pluck", {
    value: function(key) {
        return this.map(function(object) { return object[key]; });
    }
});
    • +1, mais map est IE9+ seulement.
    • pas de "besoin" vraiment, mais si .map() est sur le prototype c'est symétrique pour .pluck() d'être là. Cependant, je vais ammend la réponse avec la bonne façon de l'ajouter.
    • Je suis d'accord, mais il dépend de l'environnement. Je n'aime pas utiliser les bibliothèques qui font cela (même si je l'avais vraiment aimé Prototype de retour dans la journée), mais si je suis convaincu que je suis le seul à le faire dans un projet, il est pratique et il peut rendre le code plus propre. J'ai utilisé le truc que très rarement cependant.
    InformationsquelleAutor Pointy
  3. 7

    Vous sont proches. Vous avez besoin de changer:

    newArr.push(arr[i].key);

    à:

    newArr.push(arr[i][key]);

    Considérez ceci:

    var obj = { myKey: 'my Value', theKey: 'another value' };
var theKey = 'myKey';

alert(obj.theKey); //another value
alert(obj[theKey]); //my Value
//You can also send in strings here:
alert(obj['theKey']); //another value

    Espère que vous comprenez mon point.

    • Incroyable, merci! Je l'ai eu à travailler...Et je crois que je comprends ce concept maintenant. Chaque arr[i] objet n'est pas nécessairement un .de propriété de la clé... au Lieu de la valeur de la clé de passé à l'arracher de la fonction doit être transmis à l'aide du support de la notation, en s'assurant que vous tentez d'accéder à la propriété correcte de l'objet donné à l'arracher de la fonction en tant que deuxième argument. Est-ce à son droit?
    • Oui, lors de l'utilisation du support de la notation, vous pouvez utiliser des variables comme la clé que vous essayez d'accéder, en utilisant la notation point, la clé sera ce que vous écrivez. Cela vous aide également lorsque vous traitez avec des touches avec des points, des espaces réservés mots, etc. obj['my weird key...'] est valide alors que obj.my weird key... lèvera une erreur de syntaxe. Vous aurez également besoin d'écrire obj['enum'], obj['catch'] lors du ciblage < IE9
    InformationsquelleAutor andlrc
  4. 0

    Voici un solution de travail

    function pluck(array,key){
  var a = [],
     i1 = -1, i2 = array.length,
      o ;

    while(++i1 < i2)
    {
        o = array[i1] ; //you have to use the bracket operator here
        if(o.hasOwnProperty(key)) a[a.length] = o[key] ;
    }
  return a ;
}

    Je n'ai pas vraiment changer grand chose. La raison pour laquelle votre code échoué, c'est parce que vous avez utilisé l'opérateur point .key pour accéder à la propriété nommée des éléments du tableau à la place du support de l'opérateur [key]. Lors de l'utilisation d'une référence comme l'un des principaux que vous devez utiliser le support de l'opérateur.

    InformationsquelleAutor FK82
  5. -1

    Quelle est la réduire:

    $.pluck = function(arr, key) { 
    return arr.reduce(function(p, v) { 
      return p.concat(v[key]); 
    }, []); 
}

var people = [
  { name: 'James', age: 26 }, 
  { name: 'Fred', age: 56 }
];

$.pluck(people, 'age');
=> [26, 56]

$.pluck(people, 'name');
=> ['James', 'Fred']
    InformationsquelleAutor Jivings
  6. -3
    var array = {
name: ["Pedro", "João", "Francisco", "Diogo"],
ID: [1,2,3,4]
};
console.log(pluck(array,'name'));

function pluck(array, key) {
   return (array[key]);
};

    JSFiddle

    Vous pouvez utiliser cette fonction, cliquez sur dans JSFiddle pour voir un Exemple!! 🙂

    • Cela n'aide pas, généralement, le tableau sera structuré comme [{id: 1, name: 'Pedro'}, {id: 2, name: 'Joao'}]
    • var tableau = [{ nom: ["Pedro", "João", "Francisco", "Diogo"], ID: [1,2,3,4] },{ nom: ["José", "Maria", "Bruno", "Rui"], ID: [1,2,3,4] }]; console.log(arracher(tableau[1],'nom')); la fonction arracher(tableau, key) { return (tableau[key]); }; A aider maintenant?
    InformationsquelleAutor Pedro Monteiro Arantes