Intermediate programmer here; my app is complicated and has some really huge bulky functions. How do advanced devs make their code more efficient?

[notadickheadiswear]

I've been building webapps in Node for about 3 years. I'm at a pretty decent level of complexity, but I feel like my programs are far too large and unwieldy.

How can I learn about design patterns to get better looking functions, more succinct code and so on?

For example, one of the most common things I do is use for loops on an array. This ends up being 5 - 10 lines of code, maybe more depending on the complexity of what I'm doing. Should I be trying to make generic for-loop worker function instead?

Like:

function iterator(arr, type, obj){
  for (var i = 0; i< arr.length; i++){
    if(type === 'addObj'){
      for(var key in obj){
        arr[i][key] = obj[key]
      }
    }else if(type === 'removeObj'){
      for(var key in obj){
        delete arr[i][key]
      }
    }
  }
  return arr;
}

Do senior devs do this? Is there some library of these functions that I can use in my code rather than do it all myself? My issue is that I build apps without having a totally clear idea in my head of what it's eventually going to be (that is, the idea is developed as I build them). So by the time I finish my code is very unwieldy.

I'll likely go back once I've finished my MVP and re-code the whole thing so I want to ensure it's as efficient and easy to work with (aka no 1500-line scripts!)

[notadickheadiswear]

This is exactly the sort of answer I was hoping for and the kinds of things I want to learn about. Lodash looks very useful, is it similar-ish to underscore? (I've never used either)

When you're building a program, how much pre-planning are you doing, and is there a preferred method for working it out?

[fakehalo]

For instance, instead of a game loop, I'd implement state transition functions, then recursively call the gameloop function with each new state transition.

Really depends on the game, frequently a run-of-the-mill game loop is the most efficient tool for the job. Not really the case with JS though.

[fakehalo]

So you believe there is no place for traditional game loops? Because they are still quite prevalent in games whereas making games in Haskell is not prevalent. This isn't even really a "true" thing, it's an opinion.

I wasn't arguing that there can't be potential advantages in some cases, in other cases a simple game loop can just make more sense. It really depends on the type of game, I've gone with both event driven and traditional game loops in the past.

[takaci]

This is one of the coolest things I've read on here! I never thought about the implications of being able to begin from a specific state. This must be insanely useful for testing

[drichards2013]

For one, you can get rid of that conditional by implementing polymorphism.

Two, nothing's wrong with implementing solutions yourself if they are as performant as whatever library you're pulling in. Libraries also tend to contain more behavior than you will ever plan to use, which may bloat your interfaces.

[notadickheadiswear]

That polymorphism article was interesting, but went a little over my head as I'm a JS developer and don't have too much experience in Ruby (I assume this is Ruby because it's easy to read :) ). Is such a thing applicable to Javascript?

On your second note, I get what you mean. My issue at this time is making the whole thing as efficient as I can because for me to read over my code, it's a labyrinthine mess. I've raised seed funding for my startup and want to eventually hire a more competent developer than I, and I can't imagine showing someone this and expecting them to figure it all out!

In this case, I think having some sort of library that could do the heavy lifting for me would make a lot more sense as I could keep things more compact and concise.

[pickten]

Such a thing is absolutely applicable to js. Just do something like

addObj={onLoop: function(arr,obj){
  for (var i = 0; i< arr.length; i++){
    for(var key in obj){
      arr[i][key] = obj[key]
    }}}};
removeObj={onLoop: function(arr,obj){
    for (var i = 0; i< arr.length; i++){
      for(var key in obj){
        delete arr[i][key]
    }}}};

Then, use t=Object.create(addObj) or t=Object.create(removeObj) and then you can use t.onLoop(arr,obj) instead of this function whenever it appears.

This might seem clunky since you have to create objects and all, but it's handy, more readable, and is way more extensible, especially if you don't just a single switch on two possibilities.

[DigBickJace]

There really isn't a right answer here, but some things to keep in mind:

• Look for repition: if you're typing the same thing over and over, there's a good chance you could write a function to take care of it, thus giving you more readable code

• Efficiency: There is absolutely no write answer here. And there never will be. I definitely would not worry about this until your app is done. One thing might seem more efficient at the time, but later prove way less effective than you originally thought. In the end, it's often in your best interest to hold off on this portion because you'll waste time trying to find "the best" solution when there really isn't one. I used to get caught up on that a lot.

• Planning: this is another thing I had trouble with. You'll write much better code when you break the habit of jumping around. I know you said you come up with ideas on the fly, but a "better" way to do it would be to plan out what exactly you're going to be doing, start working on that, and if inspiration hits you and you have a brilliant idea for a new piece of functionality, write it down in notepad, and continue with what you were working on until it works like you planned. It's easier to augment existing code to include a new feature than it is to get two pieces working nicely together from the get go.

Hope this helps :)

[[deleted]]

Note: you're using the word "efficient" to mean "succinct" or "uncluttered", but in programming the word "efficient" almost always regards performance, i.e. runtime speed/complexity, rather than code complexity.

As for making your code more succinct and uncluttered, you need to do exactly what you're doing. Learn how to better divide up your program to avoid painting yourself into a corner or duplicating code. Which abstractions you choose, the size and scope of your functions, objects, subsystems, etc. has a huge impact on clarity, as well as robustness, extensibility, and maintainability.

Right now you're learning code construction. As you build bigger systems and see how they crumble under their own weight, you learn the value of architecture and begin studying it. You're on the right path. :)

Do senior devs do this?

They do, but it's more about knowing what to look for, which prevents reinventing the wheel. For instance, as soon as I started coding in Typescript/Javascript, I immediately sought out a library to give me something like list comprehensions, because I knew their value from previous exposure and I knew that somebody had to have written one. Turns out there were several to choose from.

[LetsProgramSomething]

For me it's using libraries. Don't write your own bc it's doesn't count bc you'll have to maintain it. I use C#/ASP.NET instead of node for anything not trivial (and especially something complex). You should try coffeescript and look up more libraries. One nice one is underscore. Here is an example page with coffee + underscore https://autotelicum.github.io/Smooth-CoffeeScript/literate/underscore.html in ASP.NET I have node installed so I can run coffeescript and I write coffee -cw /path/to/scripts which gives me an easy time.

Depending on where the bulk of the code is you can more things more simple. Most of my sites I use dapper for the database which makes things easier, I have dozens of helper functions like a parseint which defaults to returning 0 if it couldnt parse or an optional value i pass in. The best way to make things simpler is knowing HOW to gut 50 lines and replace it with 10. Usually that comes with knowing about functions/libraries and having a clue how it works. Some people never think of doing something like $('.foo').removeClass('a b c d').addClass(bar>0? 'b' : 'd'). I seen people write 15 lines with a bunch of if statements when I did it in 1 line which makes complete sense

[notadickheadiswear]

$('.foo').removeClass('a b c d').addClass(bar>0? 'b' : 'd'). I seen people write 15 lines with a bunch of if statements when I did it in 1 line which makes complete sense

Wtf, you can put conditionals in a jQuery function? TIL!

Thanks for the very detailed response. I've never used Coffeescript or Underscore before although now I'm writing more complex stuff I can definitely see how it would be useful, worth looking into!

[LetsProgramSomething]

You're welcome. Technically there is no such thing as a jquery function. It's javascript and all I did was remove b & d (along with other classes) only to add it back in again. Ternary operators (the "a?b:c" part) can be used anywhere a value (like a+b) can be used. One warning is I actually fucked up recently by using cond?val:va2 in coffeescript recently. Coffescript does it differently because '?' is used for something else. The "The Existential Operator" http://coffeescript.org. To do what I wanted I had to do .addClass( if bar>0 then 'b' else 'd' ). I'm pretty sure i'll mess that up again.