Goedenavond,


Is de onderstaande array en loop ook mogelijk in JavaScript?

<?php
$options = array(
	'Kleur' => array('blauw', 'geel', 'wit'), 
	'maat' => array('39', '40', '41'),
);

foreach($options as $option => $values){
	echo $option.'<br>';
	foreach($values as $value){
		echo $value.' ';
	}
	echo '<br>';
}
?>


Had dit op het net gevonden URL maar hier word steeds een nieuwe array aangemaakt.
Hier wat voorbeelden die je op de interwebs kan vinden.
Voor elck wat wils
Om te oefenen.
 <?php
$options = array(
	'Kleur' => array('blauw', 'geel', 'wit'),
	'Maat' => array('39', '40', '41'),
);

foreach( $options as $option => $values )
{
	echo $option.'<br />';
	foreach( $values as $value )
	{
		echo $value . ' ';
	}
	echo '<br />';
}
?>

<hr />

<script>
var options = [
	['Kleur', ['blauw', 'geel', 'wit'] ],
	['Maat' , ['39', '40', '41'] ],
	['Overig', 'n.v.t']
];

for ( var i = 0; i < options.length; i++ )
{
	if ( Array.isArray( options[i][1] ) )
	{
		document.write( '<b>' + options[i][0] + '</b><br />' );
		for ( var y = 0; y < options[i][1].length; y++ )
		{
			document.write( options[i][1][y] + ' ' );
		}
		document.write( '<br />' );
	} else {
		document.write( '<b>' + options[i][0] + '</b><br />' + options[i][1] + '<br />' );
	}
}
</script>

<hr />

<p id="demo"></p>

<script>
// Create an object:
const cars = {
	fiat: {
		brand:"Fiat",
		model:"500",
		color:"white"
	},
	bmw: {
		brand:'BMW',
		model:'M3',
		color:'Red'
	}
};

// Display some data from the object:
document.getElementById("demo").innerHTML = "The car brand &amp; type is " + cars.fiat.brand + ' ' + cars.fiat.model;

for( let item in cars )
{
	document.write(`${cars[item].brand} ${cars[item].model} heeft kleur <b> ${cars[item].color} </b><br />`);
}

</script>

<hr />

<script>

storeItems = {
   eggs: {price: 3.77, quantity: 30},
   milk: {price: 2.22, quantity: 23},
   butter: {price: 2.00, quantity: 22},
   carrots: {price: 3.00, quantity: 11},
   beef: {price: 6.18, quantity: 34},
   chicken: {price: 5.44, quantity: 34}
};
//Using a for..in loop, we can iterate over this object by property name to access all the properties.
for(let item in storeItems){
   document.write(`${storeItems[item].quantity} ${item}s each cost
   ${storeItems[item].price} <br />`);
}
</script>

<hr />

<script>
const mobiles = [
	{
		brand: 'Samsung',
		model: 'Galaxy Note 9'
	},
	{
		brand: 'Google',
		model: 'Pixel 3'
	},
	{
		brand: 'Apple',
		model: 'iPhone X'
	}
];

mobiles.forEach( mobile => {
	for ( let key in mobile ) {
		document.write( `${key}: ${mobile[key]} <br />` ); // een manier. je moet ` gebruiken
		//document.write( key + ' : ' + mobile[key] + '<br />' ); // andere manier
	}
});

</script>

<hr />

<script>
var p = {
	"p1": "value1",
	"p2": "value2",
	"p3": "value3"
};

for ( var key in p) {
	if ( p.hasOwnProperty( key ) )
	{
		document.write( key + " -> " + p[key] + '<br />'); // een manier
		//document.write( `${key} -> ${p[key]} <br />` ); // andere manier
	}
}
</script>

<hr />

<p>https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects</p>
<p>https://attacomsian.com/blog/javascript-iterate-objects</p>

Reageren