Hoe kan ik een if else statement gebruiken in een javascript array

Door Snelle Jaap op 06-04-2021 11:04

1.895 views

Ik heb een array die er zo uitziet:


const hotspots = [{
		top: (90* scaleToWidth),
		left: (680* scaleToWidth),
		radius: 10,
		fill: 'rgba(0, 159, 227, 0)',
		id: 'cirkel1',
		hoverCursor: 'pointer',
		selectable: false,
		imgtop: 71,
		imgleft: 236,
		imgheight: 335,
		imgwidth: 514,
		placement: 'bottom',
		tooltipid: 'cirkel1',
		imgUrl: 'https://website.nl/new/cms/images/canvas/woonkamer/gordijnen.jpg'
	},
];

Ik wil deze twee waardes:

top: (90* scaleToWidth),
left: (680* scaleToWidth),

Aanpassen adhv van een if else statement, dus dat probeer ik zo:


const hotspots = [{
		if(window.outerWidth > 991) {
			top: (90* scaleToWidth),
			left: (680* scaleToWidth),
		}else{
			top: (250* scaleToWidth),
			left: (680* scaleToWidth),
		}
		radius: 10,
		fill: 'rgba(0, 159, 227, 0)',
		id: 'cirkel1',
		hoverCursor: 'pointer',
		selectable: false,
		imgtop: 71,
		imgleft: 236,
		imgheight: 335,
		imgwidth: 514,
		placement: 'bottom',
		tooltipid: 'cirkel1',
		imgUrl: 'https://website.nl/new/cms/images/canvas/woonkamer/gordijnen.jpg'
	},
];

Maar hiermee krijg ik: Unexpected token '.'

Hoe kan zoiets?

- Ariën -

06-04-2021 11:07

in een array gaat dit nooit werken, omdat je geen logica erin kan verwerken.

Je moet de logica naar buiten je array plaatsen, waarbij je een variabele aanmaakt, die je wel in je array kan plaatsen.

S Snelle Jaap

06-04-2021 11:14

Is dit niet met een dirtyfix op te lossen? Ik heb een hoop wisselende waardes dus die plaats ik het liefste direct in de array ipv nog een hele brei aan code erbuiten.

- Ariën -

06-04-2021 11:22

Nee, de enige beste oplossing is om je logica naar boven te verhuizen en er een variabele aan te hangen.

Lijkt mij in jouw code geen probleem.

S Snelle Jaap

06-04-2021 11:33 gewijzigd op 06-04-2021 11:34

Oke, iets zoals dit?


if(window.outerWidth > 991) {
	var $gordijnenpos = 'top: (90* scaleToWidth),left: (680* scaleToWidth),';
}else{
	var $gordijnenpos = 'top: (250* scaleToWidth),left: (680* scaleToWidth),';
}

const hotspots = [{
		$gordijnenpos,
		radius: 10,
		fill: 'rgba(0, 159, 227, 0)',
		id: 'cirkel1',
		hoverCursor: 'pointer',
		selectable: false,
		imgtop: 71,
		imgleft: 236,
		imgheight: 335,
		imgwidth: 514,
		placement: 'bottom',
		tooltipid: 'cirkel1',
		imgUrl: 'https://website.nl/new/cms/images/canvas/woonkamer/gordijnen.jpg'
	},
];

Want als ik dit doe komt die variabele er gewoon als variabele in te staan, ipv de inhoud ervan, dit is de broncode:


const hotspots = [{
	$gordijnenpos,
	radius: 10,
	fill: 'rgba(0, 159, 227, 0)',
	id: 'cirkel1',
	hoverCursor: 'pointer',
	selectable: false,
	imgtop: 71,
	imgleft: 236,
	imgheight: 335,
	imgwidth: 514,
	placement: 'bottom',
	tooltipid: 'cirkel1',
	imgUrl: 'https://website.nl/new/cms/images/canvas/woonkamer/gordijnen.jpg'
},

- Ariën -

06-04-2021 11:36

Klopt.

Hoewel ik het dollarteken in JS bijzonder vind. ;-)

S Snelle Jaap

06-04-2021 11:37

Haha ja een gewoonte

? Onbekende gebruiker

06-04-2021 12:59

Zoiets?

const hotspots = [{
  gordijnenspots: window.outerWidth > 991
   ? 'top: (90* scaleToWidth),left: (680* scaleToWidth),'
   : 'top: (250* scaleToWidth),left: (680* scaleToWidth),',
  radius: 10,
  fill: 'rgba(0, 159, 227, 0)',
  id: 'cirkel1',
  hoverCursor: 'pointer',
  selectable: false,
  imgtop: 71,
  imgleft: 236,
  imgheight: 335,
  imgwidth: 514,
  placement: 'bottom',
  tooltipid: 'cirkel1',
  imgUrl: 'https://website.nl/new/cms/images/canvas/woonkamer/gordijnen.jpg'
}];
alert(hotspots[0].gordijnenspots);

Reageren

Inloggen om te reageren