2 : 1; }Introduce Explaining VariableThis will help to explain the meaning of each variable when expressions are hard to read.
if ( (platform.
toUpperCase().
indexOf("MAC") > -1) && (browser.
toUpperCase().
indexOf("IE") > -1) && wasInitialized() && resize > 0 ) { // do something }tofinal boolean isMacOs = platform.
toUpperCase().
indexOf("MAC") >-1; final boolean isIEBrowser = browser.
toUpperCase().
indexOf("IE") >-1; final boolean wasResized = resize > 0; if (isMacOs && isIEBrowser && wasInitialized() && wasResized) { // do something }Now that I have covered some of the refactoring techniques, I am going to tell you about my refactoring experience when I developed a mobile app with Flutter.
I was creating a login page and was obligated to make a 100% coverage test of the code.
Here is the snippet of the login page test, that is very hard to read and redundant.
This is where I realized that I should refactor these codes.
After I looked further, I found that this problem also has been encountered by many other people, and they have decided to make a compact design pattern out of it.
A design pattern is a general, reusable solution to a commonly occurring problem within a given context in software design.
It is not a finished design that can be transformed directly into source or machine code.
One of the design patterns that match with this problem is BLoC pattern.
Business Logic Component (BLoC) pattern is made to handle state changes in Flutter.
It utilizes Reactive Programming (declarative programming paradigm concerned with data streams and the propagation of change) to handle the flow of the data.
BLoC stands as a layer for our UI to interact with our back end.
With this architecture, our team doesn’t need to store data in our UI (Widget, in this case).
The architecture diagram of BLoC pattern can be seen on the image below.
Source: https://pub.
dartlang.
org/packages/blocWith BLoC pattern, I successfully separated the front end page (login) and the logic.
This means, now I can create the mock of the front end page without having to consider the logic.
The test is now much simpler.
Also, by implementing BLoC pattern, the code is more maintainable and open for further improvement.
I can easily use the mock classes that I have created on login test page for another test pages.
Final Words:When life gives you lemons, make lemonade.
You should remember when you think you’re developing an application with overwhelming codes that you could barely understand, it is probably because of the “bad smells”.
You should refactor it!References:Fowler, M.
(2018).
Refactoring: improving the design of existing code.
Addison-Wesley Professional.
Freeman, E.
, Robson, E.
, Bates, B.
, & Sierra, K.
(2004).
Head first design patterns.
“ O’Reilly Media, Inc.
”.
.. More details