camelCase or under_score

[djfarrelly]

Hey team!

:camel: or :heavy_minus_sign:

I wanted to kick off our javascript style guide with a friendly discussion here! Currently our js is not in either camp as far as variable naming conventions are concerned. Methods are almost all camelCase while some variables declared within functions scope are mixed between camelCase and under_score. It would be nice to push toward a common style for our variables. I think having a common style here makes the code more readable and easier to write.

Opinion: I personally prefer camelCase. To me it feels like the defacto style in the js community. Popular libraries like jQuery, Backbone, Angular, Ember as well as the Node.js source uses camelCase for everything. I think with good naming any confusion between methods, function and variables should be fairly easily avoided. I do also believe that the majority of the code is in camelCase too which would make it easier to move fully towards. I think leaning towards the style of the community overall here helps us too!

I do think that if we're serializing PHP models to JSON then using those in Models and collections, underscores make sense.

As a side note, pre-ES6 "constants" would be all caps like var MAX_TWEET_LENGTH = 140.

That's just a quick scribble of my thoughts, I would love to hear what people think here :grinning:

[hovsater]

I'd cast my vote with camelCase as well. I'm used to that and that is what I have seen browsing other JavaScript libraries.

Open for counter-arguments if there is any. :smile:

[colinscape]

:camel: :thumbsup:

[sunils34]

I'm down for :camel: for javascript!

[michael-erasmus]

:camel: all the way from my side too. The only downside is see is that the bit of cognitive load when switching between PHP and Javascript(assuming we're going for underscores in PHP).

But that's not such a big deal in my opinion.

:+1: on constants too

[nieldlr]

I prefer camelCase as well. However, with a slight distinction. My tendency is to go for camelCase in functions and methods, and under_score for attributes. Never questioned why I did this though. :)

I think my reasoning comes perhaps from understanding the difference between what is an action and what is an attribute. For example in JS, it's very easy to pass around functions so I felt that perhaps it'd be nice to provide clarity between what is a method/function versus an attribute.

For example:

// Variable (attribute) assignment with under_scores
// Under_scores denote attribute
var has_buffered_update = this.hasBufferedUpdate();

// Variable (attribute) assigment with camelCase
// Is this is a function or an attribute?
var hasBufferedUpdate = this.hasBufferedUpdate();

// Variable (function) assignment with camelCase
// Is this is a function or an attribute?
var hasBufferedUpdate = this.hasBufferedUpdate;

This is my personal preference though. It helps me understand the distinction between attributes and functions/methods more easily when glancing at the code.

There are perhaps two arguments against my case:

• Most function/methods start with verbs. So when looking at a variable one can easily understand the difference. The possible case of confusion mentioned above represents a fringe case where a variable is a representation of the result of a boolean/conditional function. Most attributes will not represent this confusion, for example: var fullName = this.getFullName();. fullName is clearly an attribute not a function/method.
• In the cases of single word functions/attributes there is no way of distinguishing attributes and functions/methods since the camelCase vs under_score identifier is not present. One has to in any case in those circumstances read further or get an understanding of the difference in case there might be a confusion

What do you think guys think? I never questioned these differences though, so it's good to have a discussion! I'll see if I can find any cases or arguments for/against establishing a distinction between attributes and functions/methods.

Keen to hear your thoughts! Either way, I'd be happy to also just use camelCase if the decision is reached. I thought I'd just bring up a different point that might not have been considered yet.

Edit: Just saw @michael-erasmus's comment: cognitive load is a good term here for I think I meant here in understanding the differences. However, this load might not even be that big of a tradeoff for the consistency that we gain with all camelCase

[djfarrelly]

@nieldlr and @michael-erasmus, great points all around, I love the discussion here :+1:

I can see the desire to have that clear distinction, but I guess I'll offer a couple counter-points:

• I think since we're mostly using Backbone most of our attributes would ideally behind getters and setters. model.get('attribute') or special methods like profile.getSentUpdates(). get() doesn't work in that same way in Collections, but then again, it may be good practice that Collections don't keep state or many attributes as they Models should store data/attributes.
• While the cognitive load of switching languages w/ underscore variables is a good point, there is also the cognitive load of writing and reading JavaScript with two types of styles. I think it's more pleasing/easier to read/write a module or function that is written in a single style. While switching from PHP to JS to another language there will always be the process of thinking what function you need to use to replace the contents of a string and what the syntax is:

PHP

preg_replace("/bing/", "google", "bing.com is my search engine");

JS

'bing.com is my search engine'.replace(/bing/, 'google');

And the occasional dogescript :dog2:

very text is 'bing.com is my search engine'
plz text.replace with /bing/, 'google'

One thing of note, I loved @michael-erasmus' line in the PHP style guide:

Always try to write code that clearly demonstrates and communicates it's intent.

I think if we end up writing something that is confusing to follow whether something is a method or an attribute, we might want to think if there may be a clearer way to write the code. I'm always striving to get better at this in my code writing and I think it's a great goal for the team as a whole as Michael' so nicely laid out :smile:

I actually just was looking at @nieldlr's code the other day and thought how nice and bite-size all the methods were. It didn't really require many comments at all to follow it! With clear, short methods like that I could see how using all camelCase could definitely work.

Those are my thoughts!

[michael-erasmus]

Some great conclusions here @djfarrelly! (I love the dogescript reference, didn't even know that's a thing!)

I'm with you on switching languages. I actually think it helps if the language conventions are different, especially when reading code, just to signal to your brain, this is JS or this is PHP.

I also think that @KevinSjoberg makes a good point, it's always good to stick to the de facto community standards, which also seems to be camelCase all the way.

[nieldlr]

Hi guys, all the points you mention are totally valid. Makes a lot of sense! I'm happy to use camelCase for all the things :+1:

[hovsater]