Reakcja tylko na ostatnim if'ie

pytanie zadane 11 marca 2018 w JavaScript przez Oskar Szkurłat Bywalec (2,780 p.)

Witam, napisałem sobie skrypt, gdzie w zależności od nazwy mojej wczytywanej karty, zmienia się klasa obiektu o pewnym ID na manualnie zdefiniowaną nazwę classy. (nameOfFirstCardInStore, findIdOfSlot działa poprawnie)

if(nameOfFirstCardInStore = "Succubus, Lady of Lust"){var classNameOfBoughtCard = "SuccubusLadyofLust";}
	if(nameOfFirstCardInStore = "Demonic Lord"){var classNameOfBoughtCard = "DemonicLord";}
	if(nameOfFirstCardInStore = "Primeval Dragon"){var classNameOfBoughtCard = "PrimevalDragon";}
	if(nameOfFirstCardInStore = "Resurrected Undead"){var classNameOfBoughtCard = "ResurrectedUndead";}
	if(nameOfFirstCardInStore = "White Werewolf"){var classNameOfBoughtCard = "WhiteWerewolf";}
	if(nameOfFirstCardInStore = "Halfblood Vampire"){var classNameOfBoughtCard = "HalfbloodVampire";}
	document.getElementById(findIdOfSlot).className = classNameOfBoughtCard;

Skrypt z niewiadomego mi powodu działa tak, że reaguje, ale mimo, że nazwa karty to "Succubus, Lady of Lust", wczytuje zawsze ostatniego Ifa (w tym przypadku dla "Halfblood Vampire").
Gdzieś pominąłem jakiś znak lub popełniłem jakiś błąd logiczny?
Sprawdzałem już czy to nie podwójny == powinien być, ale nie, wtedy jest nieidentyfikowane.

Dziękuję z góry ;)

2 odpowiedzi

odpowiedź 11 marca 2018 przez Tomek Sochacki Ekspert (227,510 p.)
wybrane 11 marca 2018 przez Oskar Szkurłat

Najlepsza

A pytanie po co w ogóle robisz te IFy?

Po pierwsze to w takim wypadku lepszy jest nie wielokrotny if tylko po prostu switch i odpowiednie case.

Ale tak właściwie to w ogóle ja bym zrobił tak:

document.getElementById(findIdOfSlot).className = nameOfFirstCardInStore.replace(/[,.\s]/g, '');

i od razu regexp odpowiednio przetwarzasz ciąg aby nie zawierał spacji, przecinków i co tam jeszcze możesz mieć. W ten sposób masz rozwiązanie bardziej uniwersalne - gdy za chwilę dojdzie kolejna możliwość nazwy to nic w kodzie nie zmieniasz, o ile nie wprowadzisz w nazwie dodatkowych znaków nie usuniętych w regexp.

Oczywiście powyższy zapis jest niezbyt fajny, wypadało by zrobić np. zmienną zawierającą referencję do obiektu DOM itp. ale to już zostawiam Tobie.

Powyższy sposób przy założeniu, że masz pewność co do danych w nameOfFirstCardInStore. Jeśli nie, to można ewentualnie machnąć tablicę i sprawdzić, czy zawiera ona element z tej tablicy:

const acceptableValues = [
    "Succubus, Lady of Lust",
    "Demonic Lord",
    "Primeval Dragon",
    // i kolejne
];

//i potem:
if(acceptableValues.includes(nameOfFirstCardInStore)) {
    //i tutaj rozwiązanie z regexp
}

komentarz 11 marca 2018 przez Oskar Szkurłat Bywalec (2,780 p.)

Dziękuję za radę, zrezygnowałem z ifów, na rzecz switchów. Faktycznie kod jest bardziej przejrzysty (za to obszerniejszy), ale pozwoliło mi to zrobić z 6 funkcji jedną :) i podczas dodawania nowych kart mniej roboty ;) Jeszcze raz dzięki

komentarz 11 marca 2018 przez Tomek Sochacki Ekspert (227,510 p.)

Nie patrz aż tak na obszerność kodu - to nie zawsze idzie w parze z uniwersalnością rozwiązania. Ja stosuję najczęściej zasadę, że jeśli miałbym mieć więcej niż 3 warunki to zapominam już o IF i rozważam albo switch albo np. wzorzec command, ale to już zależy od konkretnej sytuacji.

odpowiedź 11 marca 2018 przez pablop76 VIP (123,120 p.)

Zapoznaj się dokładnie z instrukcją if. Zwróć uwagę na 'else' oraz 'else if'

komentarz 11 marca 2018 przez Oskar Szkurłat Bywalec (2,780 p.)

czyli nie ma opcji nie robic if ifa ifa ifa ifa ifa (oczywiście przy else if )?

komentarz 11 marca 2018 przez Oskar Szkurłat Bywalec (2,780 p.)

Cóż , myślałem, że to bez znaczenia, że zrobię na 6 ifach czy na 1 if i 5 else if. Ale dobra, dzięki :) pomogło, temat zamknięty

if(nameOfFirstCardInStore = "Succubus, Lady of Lust"){var classNameOfBoughtCard = "SuccubusLadyofLust";
	} else if(nameOfFirstCardInStore = "Demonic Lord"){var classNameOfBoughtCard = "DemonicLord";
	} else if(nameOfFirstCardInStore = "Primeval Dragon"){var classNameOfBoughtCard = "PrimevalDragon";
	} else if(nameOfFirstCardInStore = "Resurrected Undead"){var classNameOfBoughtCard = "ResurrectedUndead";
	} else if(nameOfFirstCardInStore = "White Werewolf"){var classNameOfBoughtCard = "WhiteWerewolf";
	} else if(nameOfFirstCardInStore = "Halfblood Vampire"){var classNameOfBoughtCard = "HalfbloodVampire";
	}
	document.getElementById(findIdOfSlot).className = classNameOfBoughtCard;