1
\$\begingroup\$

I have just written this code for toggling between two possible states of an object.

// This can't change, and only ever has two states
const MODES = {
  ON: 'ON',
  OFF: 'OFF'
}

// this is my method
const toggleMode = currentMode => {
  const modes = Object.values(MODES);
  const newMode = modes.find(mode => mode !== currentMode);
  return newMode
};

// toggle state
const firstState = MODES.ON;
console.log(firstState);
const secondState = toggleMode(firstState);
console.log(secondState);
const thirdState = toggleMode(secondState)
console.log(thirdState)

Is this a good way of toggling between the two states? I'm concerned it's less readable than the verbose if one state, then pick the other, else pick the current state. But this way also means that so long as we know there's only two states, then nothing needs to be hardcoded in the function doing the toggling.

\$\endgroup\$
8

1 Answer 1

4
\$\begingroup\$

You currently only print the currently selected mode to the console, but you probably will use this mode for other purposes, such as the business logic of your application. To that end, I suggest splitting the toggling logic from the presentation and use booleans to store the value which you can easily use for branching depending on the currently selected mode.

// Logic: Define the two modes and toggling logic
const MODES = { ON: true, OFF: false }
const toggleMode = currentMode => !currentMode;

// Presentation: Display a selected mode
const displayMode = currentMode => currentMode ? 'ON' : 'OFF';

// Demo
const firstState = MODES.ON
console.log(displayMode(firstState));
const secondState = toggleMode(firstState);
console.log(displayMode(secondState));
const thirdState = toggleMode(secondState);
console.log(displayMode(thirdState));

\$\endgroup\$
2
  • \$\begingroup\$ This is a clever distinction, but I don't' think it applies in my case as I'm not going to be displaying the state (the console logs were just to show the function working). I'm also not keen on(sort of) handling two lots of state/processes to get to state. \$\endgroup\$ Sep 4, 2019 at 8:11
  • \$\begingroup\$ All the better, if you don't need to display it. The toggling function can be used stand-alone and you can alway check either against truthiness (if(firstState){ … }) or against the "Enum" (if(firststate == MODES.ON){ … }) so not to depend on the inner value. \$\endgroup\$
    – gitcdn
    Sep 4, 2019 at 8:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.