Les boucles For..In en JavaScript - paires clé-valeur
je me demandais s'il y avait un moyen de faire quelque chose comme une boucle PHP foreach
en JavaScript. La fonctionnalité que je cherche est quelque chose comme cet extrait de PHP:
foreach($data as $key => $value) { }
je regardais la boucle JS for..in
, mais il semble qu'il n'y ait aucun moyen de spécifier le as
. Si je fais cela avec un' normal ' pour loop ( for(var i = 0; i < data.length; i++
), y a-t-il un moyen de saisir les couples key => value?
14 réponses
for (var k in target){
if (target.hasOwnProperty(k)) {
alert("Key is " + k + ", value is" + target[k]);
}
}
hasOwnProperty
est utilisé pour vérifier si votre target
possède réellement cette propriété, plutôt que de l'avoir héritée de son prototype. Un peu plus simple serait:
for (var k in target){
if (typeof target[k] !== 'function') {
alert("Key is " + k + ", value is" + target[k]);
}
}
il vérifie simplement que k
n'est pas une méthode (comme si target
était array
vous obtiendrez beaucoup de méthodes alertées, par exemple indexOf
, push
, pop
,etc.)
personne n'a mentionné Object.keys
donc je vais le mentionner.
Object.keys(obj).forEach(function (key) {
// do something with obj[key]
});
le for in
fonctionnera pour vous. Si vous considérez un objet comme une carte:
for(key in obj){
// The key is key
// The value is obj[key]
}
si vous pouvez utiliser ES6 nativement ou avec Babel (js compiler) alors vous pouvez faire ce qui suit:
let test = {a: 1, b: 2, c: 3};
for (let [key, value] of Object.entries(test)) {
console.log(key, value);
}
qui imprimera cette sortie:
a 1
b 2
c 3
la méthode Object.entries()
retourne un tableau de la propriété énumérable propre à un objet donné [key, value]
paires, dans le même ordre que celui fourni par une for...in
boucle (la différence étant que une boucle for-in énumère également les propriétés de la chaîne prototype) .
- objet.entrées documentation
- ...de documentation
- assignation de déstructuration documentation
- Énumérabilité et propriété des biens documentation
Espère que cela aide! =)
var obj = {...};
for (var key in obj) {
var value = obj[key];
}
la syntaxe php n'est que du sucre.
je suppose que vous savez que i
est la clé et que vous pouvez obtenir la valeur via data[i]
(et je veux juste un raccourci pour cela).
ecmascript5 introduit forEach
[MDN] pour les tableaux (il semble que vous ayez un tableau):
data.forEach(function(value, index) {
});
la documentation MDN fournit un shim pour les navigateurs ne le supportant pas.
bien sûr ce ne fonctionne pas pour les objets, mais vous pouvez créer une fonction similaire pour eux:
function forEach(object, callback) {
for(var prop in object) {
if(object.hasOwnProperty(prop)) {
callback(prop, object[prop]);
}
}
}
puisque vous avez étiqueté la question avec jquery , jQuery fournit $.each
[docs] qui boucle à la fois, les structures de tableau et d'objet.
for (var key in myMap) {
if (myMap.hasOwnProperty(key)) {
console.log("key =" + key);
console.log("value =" + myMap[key]);
}
}
en javascript, chaque objet a un tas de paires de valeurs clés intégrées qui ont des méta-informations. Lorsque vous faites une boucle à travers toutes les paires de valeurs clés pour un objet, vous faites une boucle à travers elles aussi. L'utilisation de hasOwnProperty () les Filtre.
vous pouvez utiliser le for..in
pour cela.
for (var key in data)
{
var value = data[key];
}
ES6 fournira la carte.prototype.forEach (callback) qui peut être utilisé comme ceci
myMap.forEach(function(value, key, myMap) {
// Do something
});
vous pouvez utiliser une boucle 'for in' pour ceci:
for (var key in bar) {
var value = bar[key];
}
ci-dessous est un exemple qui se rapproche autant que vous obtenez.
for(var key in data){
var value = data[key];
//your processing here
}
si vous utilisez jQuery voir: http://api.jquery.com/jQuery.each /
let test = {a: 1, b: 2, c: 3};
Object.entries(test).forEach(([key, value]) => console.log(key, value))
// a 1
// b 2
// c 3
oui, vous pouvez avoir des tableaux associatifs aussi en javascript:
var obj =
{
name:'some name',
otherProperty:'prop value',
date: new Date()
};
for(i in obj)
{
var propVal = obj[i]; // i is the key, and obj[i] is the value ...
}
var global = (function() {
return this;
})();
// Pair object, similar to Python
function Pair(key, value) {
this.key = key;
this.value = value;
this.toString = function() {
return "(" + key + ", " + value + ")";
};
}
/**
* as function
* @param {String} dataName A String holding the name of your pairs list.
* @return {Array:Pair} The data list filled
* with all pair objects.
*/
Object.prototype.as = function(dataName) {
var value, key, data;
global[dataName] = data = [];
for (key in this) {
if (this.hasOwnProperty(key)) {
value = this[key];
(function() {
var k = key,
v = value;
data.push(new Pair(k, v));
})();
}
}
return data;
};
var d = {
'one': 1,
'two': 2
};
// Loop on your (key, list) pairs in this way
for (var i = 0, max = d.as("data").length; i < max; i += 1) {
key = data[i].key;
value = data[i].value;
console.log("key: " + key + ", value: " + value);
}
// delete data when u've finished with it.
delete data;