- When my code isn’t working and I don’t understand why, that’s frustrating.
- When I make a change so the code works, but I don’t understand why, that’s even more frustrating.
- When my local code in Dreamweaver works and Firebug gives it love but that same code doesn’t work in FCC, that’s frustrating.
- When I then make a change to the code in FCC and, suddenly, it works and I don’t understand what the difference is, I want to spit, say naughty words, and throw rocks.
Here’s my latest tale of woe.
In this tale, there’s also the sub-plot of nothing ever succeeds or fails in a consistent way on my computer at work (I study there sometimes outside office hours because it’s quiet) regardless of whether the code is local or in FCC. But, that’s pain I should avoid because I know better yet I keep trying so I have nobody to blame but me and I won’t waste anyone’s time writing about the lies & illusions that spew out of what might not really be FCC or even Dev Tools while I’m at work.
Assignment: Find the longest word in a string
I always try at least something in FCC but eventually end up in Dreamweaver because I want to test it with Dev Tools so I can get some clues as to why my code isn’t working. Here’s an early version (in Dreamweaver):
Why it’s broken: I’m telling it to change longestWordLength to the current word’s length if the current word’s length is greater than longestWordLength which it is each time because I reset longestWordLength to zero with every iteration.
You might be saying to yourself (and me), “Move line 15 outside the for loop!” And my defense is that line was originally outside the for loop using FCC at work which gave me errors so I started messing with the code. I now know that’s the problem … but … sometimes FCC works just fine at work so I keep trying. I should stop that.
When the code didn’t work, I remembered that people are always telling me to put my variable declarations inside my function or inside some place I didn’t think it needed to be so I thought moving it there would fix it. As I’ve said, that is a “solution” to a non-existent problem I thought I had. So, yes, I know moving that line inside the loop doesn’t make sense but the fact that it already wasn’t working and that didn’t make sense … doing something else that doesn’t make sense didn’t seem to make any less sense which is why I should stop trying to practice at work.
Situations like this cause me to focus on the wrong things while troubleshooting. Instead of recognizing that, obviously, the variable is resetting back to zero each time, I was puzzled by the console’s output above because it looked to me as if the longestWordLength variable’s value was changing regardless of whether my if statement‘s condition is true. Same with console.log, I thought– shouldn’t those two commands only execute if the condition is met? Looking back, I now see that the condition was being met each and every time because the variable was being set back to zero and each word’s length is greater than zero.
I made a minor edit just wondering if some more detail would enlighten me:
I wasn’t enlightened.
Again, all of these mistaken paths and solutions are based on being told, incorrectly, that my original code didn’t work.
Eventually, after some directionless trial and error based on less than helpful FCC feedback, helpful advice from FCC chatroom peeps, and comparing my code to that of others, I made this next change–and I swear this is the code I started off with (at work) which drives me batty:
But … then I paste that into the FCC thingy, replacing line 18 (third screenshot) with a return statement because when I’m testing code, I replace the return statement with console.log so I can see the result(s). Very early on during all this trial and error, I moved that console.log command inside the for loop so I could watch what was happening as it happened. I forgot that fact because it was ten trillion versions/attempts ago. At this point, I couldn’t figure out why I the function was now stuck at the first word of every test array again.
Why it’s broken (now): I’m telling it to stop (return brings everything to a halt) if the current word’s length is greater than longestWordLength.
My train of thought led me to believe the return statement should be inside the condition but the tracks that train was on looked like an Escher painting so I won’t bother trying to put that mess into words. The moral of the story is that I needed to let the for loop finish iterating through the array before returning the longestWordLength, not return it the first time it found a word whose length was greater.
Here’s the final solution:
Trying to put my mistakes and fixes into words is difficult and reading those thoughts might be painful but it helps me understand what I’m doing. I have to do post-mortems like this because if something wonky is messing with my perfectly good code, I don’t learn what I’m doing correctly and–I think it’s incorrect–so when I stumble upon a solution, I don’t understand why it works. As a result, I don’t learn or retain anything and I go into the next exercise or project with no further knowledge. I’m still looking up simple stuff and guessing. That’s what the primary purpose is for this blog … me learning. Yes, sometimes there are tutorials and me passing stuff along but … mostly it’s to show what I’m learning and how so someday I can grow up and have a real job doing this for real.