Need Help With An Example of Clean, Elegant code VS Bad, Messy Code

Evening everyone,

I currently teach a programming class and am teaching them from Scratch, my current batch of students are all exceptionally clever but end up doing a huge massive chunk of code for something that could really only take a handful of lines of code.

When I sat with them and talked about how you should think about how clean, elegant code is far more impressive than huge chunks of code that’s all over the place - it seemed to fall on deaf ears. I think they’re currently thinking the more code they have on the screen the more epic their program is.

What I wanted to bring them in their next class is an example of code (hopefully for the same problem) showing a really messy and bad piece of code, and also the clean, elegant solution to show the point I am trying to make.

Does any one have any examples they could point me in the direction of? It can be a really basic problem and solution, I just want to show how say, sure you could write 200 lines of code to do one thing, but a bit of thought could lead to say 25-50 lines doing the same thing, far more efficiently and cleaner.

Thanks in advance!

Have them read their classmate’s code and explain it line-by-line. They might be less impressed by a bunch of code if they have to read and understand code they didn’t write.

Make them understand the computer doesn’t much care how the code was written but people do and that is the absolute most important part of well-written code, that it is readable by a human. Not how it runs, but how it reads.

Show examples of declarative vs imperative code. Explain the exact details of the “how” is often not as important as the “what”. Array methods and higher-order functions are often good examples. Show them some light functional programming without getting too far into the weeds.

https://eloquentjavascript.net/05_higher_order.html


I don’t really have any code examples on hand I can point you to.

maybe something like this

var day = "monday";
var weather ="sunny";

let daytime = function(){
if(day == "monday"){
  if(weather == "sunny"){
    console.log(`this is a good sunny monday`);
  }else if(weather == "cloud"){
    console.log("this is a cloudy monday");
  }else if(weather == "storm"){
    console.log("this is a stormy monday")
  }
}else if(day == "tuesday"){
    if(weather == "sunny"){
    console.log(`this is a good sunny tuesday`);
  }else if(weather == "cloud"){
    console.log("this is a cloudy tuesday");
  }else if(weather == "storm"){
    console.log("this is a stormy tuesday")
  }
}else if(day == "wednesday"){
  //other day of the week
}


}

daytime();

and cleanest version

var day ;
var weather ;

weathers = {
  sunny:"sunny",
  cloud:"cloudy",
  storm:"stormy"
}

let daytime = function(day, weather){
  console.log(`this is a good ${weathers[weather]} ${day}` )
}

daytime("monday", "cloud");

edit: also as it happens to me usually they just are going on with the first idea they have to resolve a problem, even if its mean a lot of dirty code

Students will respond to self-interest before anything else. If you find assignments that lead to @jesusMAes long example, keep tweaking that assignment to produce longer and longer code and then focus on making changes to the output that require a bunch of fixes that makes looping more attractive (assuming you’ve covered iteration). You could also try automated tests that look for things you want them to avoid or want them to include, like linting and formatting tests in real projects. Or, offer bonus points for the shortest solution, subject to whatever rules you like.

Part of the problem for me is scratch. I use it for teaching basic coding for VEX robotics (it can use a version of scratch) before transitioning to C++, but I find it difficult to factor code like I would in Python, for instance. My programs in scratch are long and inelegant because I find the alternatives are not there or too aggravating to do. Perhaps it’s the coding for robotics that is my problem but perhaps your students feel like I do for the same reasons.

1 Like

I see this clearly when i get into game development ¿how do you manage a dialog between two characters? you can make every dialog option in a nested if and then the other character say his line then the player has options with another nested if then the other character says his line
in code would be something like this

begin
char first dialog
player options
if(option one){
  player options
   if(option1.1){
   char dialog
   player options
  if(option1.1.1){....}
  }else if(option1.2){
  char dialog
 }

}else if(option2){
 player options
   if(option2.1){
   char dialog
  }else if(option2.2){
  char dialog
 }

}else if(option3){
 player options
   if(option3.1){
   char dialog
  }else if(option3.2){
  char dialog
 }}

this only for a conversation with one character with a few phrases. Instead they could do a character class that get the “count” of the option and store the lines on a json

char1 = new char()
begin
player options
if(option 1){

char 1.getdialog(1)
player options

}else if(option2){
player options
 char1.getdialog(2)
}

**this is a quick example i don`t have time to a real implementation, once i tried to do this in a practice game and was funny and interesting. But require that they take a back step and analyze the problem and the best way to solve, not just figure out a way to do it and then, 300 lines of code later, see that if they have to do this with every little conversation it would be impossible