5 Good JavaScript Habits for Better Improvement

This JavaScript article tutorial shows full detailed list of 5 good JavaScript habits that JavaScript developers, JavaScript coders and JavaScript programmers should follow to improve JavaScript programming skills, as well as JavaScript applications and JavaScript performance. Please go to the inner post page for details and instructions.


Sampled by © JavaScriptBank.com

Javascript gets a bad rap on the Internet, but there are few languages that are so dynamic, so widespread, and so deeply rooted in our lives as Javascript is. The low barrier of entry leads some people to call it a script kiddie language, others scoff at the concept of a dynamic language while riding their statically typed high horse. You and Javascript just got off on the wrong foot, and now you've made it angry. Here's five reasons why your Javascript code sucks.

1. You're not using a namespace.

Remember in college when the teacher said you can't use global variables in your homework? Using globals in Javascript is no different. Web pages tend to be soups of aggressively pasted scripts and modules from every corner of the Internet. If you're using a variable named loader() you're just asking for a Javascript smack down. If you unwittingly over write a function, Javascript's not going to complain. You called it a script kiddy language, remember? That means you know what's going to happen when you do this.

function derp() { alert("one"); } function derp() { alert("two"); } derp();

Two, the answer is two. It didn't have to be. It could have been one. Namespacing all of your code is good manners, and it's easy to do. Here's an easy way to namespace.

var foospace={}; foospace.derp=function() { alert("one"); } function derp() { alert("two"); } foospace.derp();

2. You're a magician, creating variables out of thin air.

Using magic numbers is a no-no. Finding a seemingly arbitrary number in the middle of a 40 line block of code is a maintenance nightmare. Declaring a variable for the first time in a 40 line block of code is just as much of a scare. When you come across one you may ask yourself, "where was this declared?" and quickly mash Ctrl+F in a mad fit to find the variable's original source. No, instead, it was a Javascript abuse, more of a trick than a magic trick. Always declare your variables at the top of their scope. Just because you don't have to, doesn't mean you shouldn't.

function() { var a, //description b; //description //process... }

3. You don't understand variable scope in Javascript.

You're a brilliant programmer, you eat C++ code for lunch and poop Lisp. You know what variable scope is, you have full control over your variables and watch them like an overlord. Then Javascript put a metaphorical laxative in your coffee and had a good laugh.

var herp="one"; { var herp="two"; } alert(herp);

The value of herp in this case is not one, it's two. Javascript variable scope is not dependent on blocks like other languages. Javascript variable scope is function based. Each function has its own scope, Javascript is far too cool to concern its self with meaningless curly braces. In fact, Javascript is so cool that it will let you pass scope around like any other namespace or variable.

4. You think Javascript OOP is a tack on.

Javascript, from the ground up, is an object oriented language. Everything in Javascript is an object, everything! Even literals like integers and strings are implicitly converted to objects with their built in constructors. The difference Javascript has when compared to other object oriented languages is that it lacks classes. Javascript objects are defined as functions, and even functions themselves are objects. Javascript has a property named prototype inherent in all objects that lets you mutate the structure of objects and decorate them with more variables and functionality.

var derp; // will hold a Herp instance var Herp= function() { this.opinion="Javascript is cooler than BASIC."; } Herp.prototype.speak=function() { alert(this.opinion); } var derp= new Herp(); derp.speak();

If this looks foreign to you, I'd like to introduce you to my good friend Google. Google is good at helping people learn about things. OOP is way too big of a topic for my short, comically condescending, numbered list. If you need help finding Google try using your favorite search engine.

5. You're using the new keyword like a blind guy with a cross bow.

Javascript must be your first girlfriend, because you have no idea how to use that thing. If you want to please Javascript like a real man you're going to need to learn about object literals. With the exception of instantiating objects, and some rare cases where you need lazy data loading, you probably shouldn't be using the new keyword. Allocating lots of new variables is slow in Javascript, and you'll always get better performance using object literals.

var rightway= [1, 2, 3]; var wrongway= new Array(1, 2, 3);

Remember all that talk about Javascript scope being function based? Remember someone mentioning that Javascript objects are defined as functions? Not using the new keyword when instantiating an object will blow your mind as it sets the scope of the object to the global namespace. It's good habit to always instantiate objects with new.

var derp="one"; var Herp=function() { this.derp="two"; } var foo=Herp(); alert(derp);

Javascript won't complain if you do this, and will actually alert the answer two! There are ways to write objects to prevent this behavior using instanceOf() but a better nine to five solution is to use the new keyword correctly like the professional that you are.

Now that you know why your Javascript code sucks, you can make it suck less by remembering these factoids. Of course, there's other reasons that your Javascript code sucks. I like three space tabs, I prefer underscores to camel case, and I like to capitalize my function names that represent classes. Of course, that's a discussion for another day. There's a lot of reasons why your Javascript code sucks, and probably just as many reasons why mine sucks, so feel free to share, add, agree, or tear me a new one in the comments.

Edit Huge thanks to rogeliorv and Jared Wein for pointing out the error in point five. You guys rock.

Language
Translate this page to English Translate this page to French Translate this page to Vietnamese

Recent articles
Insights for Advanced Zooming and Panning in JavaScript Charts
How to open a car sharing service
Vue developer as a vital part of every software team
Vue.js developers: hire them, use them and get ahead of the competition
3 Reasons Why Java is so Popular
Migrate to Angular: why and how you should do it
The Possible Working Methods of Python Ideology
JavaScript Research Paper: 6 Writing Tips to Craft a Masterpiece
Learning How to Make Use of New Marketing Trends
5 Important Elements of an E-commerce Website


Top view articles
Adding JavaScript to WordPress Effectively with JavaScript Localization feature
Top 10 Beautiful Christmas Countdown Timers
Top 10 Best JavaScript eBooks that Beginners should Learn
65 Free JavaScript Photo Gallery Solutions
16 Free Code Syntax Highlighters by Javascript For Better Programming
Best Free Linux Web Programming Editors
Top 50 Most Addictive and Popular Facebook mini games
More 30 Excellent JavaScript/AJAX based Photo Galleries to Boost your Sites
Top 10 Free Web Chat box Plug-ins and Add-ons
The Ultimate JavaScript Tutorial in Web Design


Free JavaScript Tutorials & Articles
at www.JavaScriptBank.com