Code Smell 90 - Implementative Callback Events
Maxi Contieri
Posted on October 7, 2021
When creating events, we should decouple the trigger from the action.
TL;DR: Name your functions acording to what happened.
Problems
Observer Pattern violation
Coupling
Solutions
- Name the events after "what happened", not "what you should do"
Sample Code
Wrong
const Item = ({name, handlePageChange)} =>
<li onClick={handlePageChange}>
{name}
</li>
//handlePageChange is coupled to what you decide to do
//instead of what really happened
//
//We cannot reuse this kind of callbacks
Right
const Item = ({name, onItemSelected)} =>
<li onClick={onItemSelected}>
{name}
</li>
//onItemSelected will be called just when a item was selected. KISS
//Parent can decide what to do (or do nothing)
//We defer the decision
Detection
This is a semantic smell. We can detect it on peer code reviews.
Tags
Coupling
Naming
Conclusion
Names are very important. We should delay implementation coupled names until the very last moment.
More Info
Credits
Photo by Ashim D’Silva on Unsplash
Thanks to @macsikora for this tip
Beyond basic mathematical aptitude, the difference between good programmers and great programmers is verbal ability.
Marissa Mayer
Software Engineering Great Quotes
Maxi Contieri ・ Dec 28 '20
#codenewbie
#programming
#quotes
#software
This article is part of the CodeSmell Series.
💖 💪 🙅 🚩
Maxi Contieri
Posted on October 7, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
javascript Goodbye Exceptions! Mastering Error Handling in JavaScript with the Result Pattern
November 22, 2024