Variable names in javascript

Lecture



  1. Variable names
  2. Reserved names
  3. Choosing the right name

One of the most important skills of a programmer is the ability to name variables correctly .

Variable names

There are only two restrictions on the name of a variable in JavaScript.

  1. The name can consist of: letters, numbers, symbols $ and _
  2. The first character must not be a number.

For example:

var myName;
var test123;

What is especially interesting here is that the dollar '$' and the underscore character '_' are the same ordinary characters as the letters:

1 var $ = 5; // объявили переменную с именем '$'
2 var _ = 15; // переменная с именем '_'
3
4 alert($);

And such variables would be wrong:

var 1a; // начало не может быть цифрой
var my-name; // дефис '-' не является разрешенным символом

Case of letters matters

The variables apple and AppLE are two different variables.

Russian letters are allowed but not recommended.

You can use Russian letters:

1 var имя = "Вася" ;
2 alert(имя);
Technically, there is no mistake here, but in practice there is a tradition to use only English letters in names.

Reserved names

There is a list of reserved words that cannot be used when naming variables, as they are used by the language itself, for example: var, class, return, implements , etc.

Some words, such as class , are not used in modern JavaScript, but they are busy for the future. Some browsers allow you to use them, but this can lead to errors.

The following example will work in many older browsers that allow the use of the word 'class' and will not work in modern ones. They will give a syntax error, try, run:

1 var class = 5;
2 alert(class);

Choosing the right name

Choosing the right variable name is one of the most important and difficult things in programming that distinguishes the beginner from the guru.

The fact is that most of the time we spend not on the original writing of the code, but on its development.

What is development? This is when I wrote code yesterday, and today (or a week later) I come and I want to change it. For example, to display a message wrongly, but in this way .. Process the goods differently, add functionality .. And where do I keep the message there? ..

It is much easier to find the necessary data if they are correctly labeled, i.e. The variable is named correctly .

  • Rule 1. No translit. English only.

    Unacceptable:

    var moiTovari;
    var cena;
    var ssilka;

    Will fit:

    var myGoods;
    var price;
    var link;

    If you suddenly do not know English - it's time to learn. I still have to ...

  • Rule 2. Use short names only for variables of "local value".

    Name variables with no semantic meaning, such as a , e , p , mg , can only be used if they are used in a small code fragment and their use is obvious.

    In general, the name of the variable should be clear. Sometimes you need to use a few words.

  • Rule 3. Variables of several words are written вместеВотТак .

    For example:

    var borderLeftWidth;

    This way of recording is called “camel notation” or, in English, “camelCase”.

    There is an alternative standard when several words are written with an underscore '_' :

    var border_left_width;

    Mostly JavaScript uses the borderLeftWidth variant, in particular in the built-in language and browser functions. Therefore, it is advisable to stay on it.

    Another reason to choose “camel notation” is to write a bit shorter in it than with underscore, since no need to insert '_' .

  • The last rule, the main thing. The name of a variable should correspond as clearly as possible to the data stored in it.

    Coming up with such names - both short and precise, comes with experience, but only if you consciously strive for it.

Let me share one little secret that will improve your variable names and save you time.

It happens that you wrote the code, after a while you come back to it, and you need to fix something. For example, change some border “ border

... And you remember that the variable in which the value you want is stored is called something like this: borderLeftWidth . You are looking for it in the code, do not find, understand, and discover that in fact the variable was called like this: leftBorderWidth . Then make the necessary changes.

In this case, the best move is to rename the variable to the one you were looking for initially . That is, you have leftBorderWidth in the code, and you rename it to borderLeftWidth .

What for? The fact is that the next time you want to correct something, you will search by the same name. Accordingly, it will save you time.

In addition, since it is this variable name that occurred to you - most likely, it corresponds more to the data stored there than the one you originally invented.

The meaning of the variable name is “the name on the box”, according to which we can find the data we need as quickly as possible.

Do not be afraid to rename variables if you come up with a better name. Modern editors allow you to do this very conveniently. This will ultimately save you time.

Store in the variable what follows.

There are lazy programmers who, instead of declaring a new variable, use an existing one.

As a result, it turns out that such a variable is like a box into which one, then another, then the third is thrown, without changing the name. What is in it now? And who knows .. You need to come, check.

Such a programmer will save time on declaring a variable - will lose two times more on debugging code.

The "extra" variable is good, not evil.

Importance: 3

  1. Create a variable for the name of our planet with the value "Земля" . Choose the correct name yourself.
  2. Create a variable for the name of the visitor with the value "Петя" . The name is also to your taste.
Decision

Each line of the solution corresponds to one step of the task:

1 var ourPlanetName = "Земля" ; // буквально "название нашей планеты"
2
3 var visitorName = "Петя" ; // "имя посетителя"

The names of the variables could be abbreviated, for example, to planet and name , but then it becomes less clear what we are talking about. How permissible it is depends on the script, its size and complexity.

created: 2014-10-07
updated: 2021-08-10
132508



Rating 9 of 10. count vote: 2
Are you satisfied?:



Comments


To leave a comment
If you have any suggestion, idea, thanks or comment, feel free to write. We really value feedback and are glad to hear your opinion.
To reply

Scripting client side JavaScript, jqvery, BackBone

Terms: Scripting client side JavaScript, jqvery, BackBone