Fighting Boolean Traps

Fighting Boolean Traps

Presented at WaffleJS meetup. Jan 10, 2018. San Francisco.

Ever encounter some code that looks like new Slider(true /*horizontal*/)? Perhaps you are confused by the semantics exhibited by setState(true, false)? Did you get a headache when trying to unpack double negatives as in filter.caseInsensitive = false? These are typical API blunders often denoted as Boolean Traps. Learn how to recognize such a mistake and also more importantly, how to prevent it from happening!

0284b8950e0f4a57bcc092d4dbb98d97?s=128

Ariya Hidayat

January 10, 2018
Tweet

Transcript

  1. Fighting Boolean Traps

  2. Readable, consistent, crystal clear Thank you, Captain Obvious!

  3. https://twitter.com/AriyaHidayat/status/455892955765551105

  4. I HAVE A BAD FEELING ABOUT THIS…

  5. A long time ago in a galaxy far far away…

  6. var powerSlider = new Slider();

  7. None
  8. var anotherSlider = new Slider(false);

  9. IT’S A TRAP!

  10. IT’S A BOOLEAN TRAP!

  11. s2 = new Slider(false); s1 = new Slider(true);

  12. s2 = new Slider(false /*horiz*/); s1 = new Slider(true /*vertical*/);

  13. Code is written once, read many times.

  14. s1 = new Slider({ orientation: "vertical" }); s2 = new

    Slider({ orientation: "horizontal" });
  15. s2 = new VerticalSlider(); s1 = new HorizontalSlider();

  16. contacts.find(str);

  17. None
  18. // Check the cache first contacts.find(str, true); // Fresh search

    only contacts.find(str, false);
  19. IT’S A MODIFIER TRAP!

  20. the more the merrier

  21. Ping-pong, Anyone? // Expand + animate treeItem.setState(true, true); // Expand

    + don't animate treeItem.setState(true, false); // Collapse + animate treeItem.setState(false, true);
  22. DOM Event event.initKeyEvent("keypress", true, true, null, null, false, false, false,

    false, 9, 0);
  23. Double Negatives X.disabled = false; Y.setHidden(true); filter.caseInsensitive = true; X.enabled

    = true; Y.setVisible(false); filter.caseSensitive = false;
  24. picker.yearFrom = 1980; picker.yearTo = 2020; picker.minimumYear = 1980; picker.maximumYear

    = 2020;
  25. this.callMe = "Adam"; flight.from = SFO; flight.to = JFK; this.name

    = "Adam"; flight.departure = SFO; flight.destination = JFK;
  26. var x = Math.sqrt(-2) isNaN(x) true x === NaN false

    isNaN('hola') true x == NaN false
  27. https://twitter.com/AriyaHidayat/status/393034774245171200

  28. GarlicNaN != NaN Future JavaScript?

  29. Best Practices

  30. #1: Private by Default Public = Irreversible

  31. None
  32. SHStripMneumonic “Why is the function SHStripMneumonic misspelled?” Raymond Chen, Microsoft

    http://blogs.msdn.com/b/oldnewthing/archive/2008/05/19/8518565.aspx
  33. -- yours truly “You’d fail your first two attempts anyway.”

  34. None
  35. #2: Mandatory API Review

  36. “Write 3 examples which use the API.”

  37. #3: Build and Use TOOLS

  38. Summary

  39. Boolean traps (and other API mistakes) lead to FEAR

  40. [Yoda]

  41. Thank You Some artworks are from https://unsplash.com/ and http://openclipart.org. speakerdeck.com/ariya

    @ariyahidayat