I agree with this answer https://softwareengineering.stackexchange.com/a/409460/262662 by Mike Nakis, but there's more.
Additionally, you can namespace and group some of this. such as
PageReloaders.EditorCommentsVector
PageReloaders.EditorDescriptionsVector
Then if you had more variables with equally long names, you could (only in short functions/blocks)...
Reloaders = Utilities.Reloaders.PageReloaders;
Reloaders.EdtiorCommentsVector.doSomething(); // small scope only.
// equivalent to...
Utilities.Reloaders.PageReloaders.EdtiorCommentsVector.doSomething();
// And with prettier, so long as the segments are within about 40 characters, it doesn't matter. As it will look like this:
ReallyLongPath
.filledWithLongStrings
.JustToGetTo
.Utilities
.Reloaders
.PageReloaders
.EditorCommentsVector
.doSomething();
Update
If I had to actually come up with my own names, based on the original, instead of Naki's answer, I would use the following.
PageReloaders.VectorGraphicsPages.EditorComments
PageReloaders.VectorGraphicsPages.EditorDescriptions
Or maybe
PageReloaders.EditorComments.WithVectorGraphics
PageReloaders.EditorDescriptions.WithVectorGraphics
But honestly, it depends on how much stuff you've got going on. If you really need a different pageReloader for editorComments vs editorDescriptions, or a different pageReloader for vectorGraphics pages vs normal? pages vs plainText pages, then you gotta do what you gotta do. If you don't have that much stuff, like if any page might or might not have vector graphics, just go with PageReloaders.EditorComments
. Do NOT be afraid to change your variable names as a project grows. And Do NOT use stuff like pgrldr.VGraph.EtrCmnt
to try to get shorter variable names. Just don't do it. The goal is to lower the amount of brain strain on future developers (including yourself) when trying to figure out what you did the first time around.
End Update
I believe what Robert C. Martin was actually referring to was the following:
<!-- We actually had this in our codebase -->
<button class="btn-submit pers pers_cp"></btnbutton
<!-- What it meant, using the Clean Code standards -->
<button class="btn-submit btn-personnel_module btn-copy_action"></button>
This button got copied/pasted across all the modules and to actions that were not copy. When writing css, people did not know what the classes meant, so they used those classes for sizing, instead of just colors. It was hell to detangle it.
This also applies to for loops. What is better...? (again, actually pulled from our codebase)
for (let k=0; k < vehsAr.length; k++) {
let vehs = vehsAr[k];
}
/*---- OR -----*/
for (let vehicleIndex=0; vehicleIndex < vehiclesArray.length; vehicleIndex++) {
let vehicle = vehiclesArray[vehicleIndex];
}
With the for(i)
loop, if I decided to change the nesting level, I would end up reusing i
and then having to shift everything inside to k
. If I instead actually used descriptive variables, there is less work to do.
A little effort goes a long ways.
for (let r = 0; r < width; r++) {
for (let c = 0; c < height; c++) {
grid[r][c].doSomething();
// I see immediately that rows is the first layer, and columns is the second layer.
// "row" and "column" is better than "r" and "c", but "r" and "c" still go a long ways.
invertedGrid[c][r].doSomething(); // If it goes in natural English reading order, I only have to check in one spot that r and c are backwards.
}
}
// Invert the nesting order
for (let c = 0; c < height; c++) {
for (let r = 0; r < width; r++) {
grid[r][c].doSomething();
invertedGrid[c][r].doSomething();
// Notice how the inner formulas don't change?
// If I used 'i' and 'k', convention is that 'i' is top layer, then 'j', then 'k', then 'l' which looks like '1'. It get messy.
// If I swapped height/width while using 'i' and 'k', I'd have to put in much more brain power to make sure height matched with the right letter and that letter matched with the right spot.
}
}
Update
Using i
j
and k
in for loops is perfectly acceptable and is the most common way to write a loop. But the Clean Code standard, based on what little I've read of it, does not like it. At all. Just like Prettier 1.0 hated trailing commas and Prettier 2.0 loves trailing commas. It's a standard. It has a reason behind it. It's not the only way. But using longer/more descriptive variable names is the standards directive being examined here.
said Penny from over the road, born in the blue house, friend to Bob
. If you are in that contextPenny
is sufficient, or maybePenny White
if there are two possible Pennies around. Or mayBob's friend Penny
when we are already talking aboutBob
. Chances are this class is already in the UI, therefore it is already graphical. Its probably in the namespace for the editor so how about:CommentsReloader
andDescriptionsReloader
?