How to develop in JavaScript

13.06.18 IT / JavaScript 2070

JavaScript is the language primarily used on websites. Its support is now implemented in almost all browsers, exceptions may be specific browsers. The language has several versions; during its development, it has acquired new features. At the moment, the latest release is ECMAScript 2017 . Generally speaking, JavaScript is based on the ECMAScript specification.

It's easy to write code in this language. In the simplest case, code can be injected directly into a page using script tags . Such tags are usually tried to be placed at the top of the page so that the code is available throughout the page, and to implement some operations in cases where the page has not yet been fully loaded. Often this approach is used in the embedded code of third-party services, metrics, statistics, etc., it is necessary to take into account that the html validator considers specifying a script type as an error. This is because in HTML5 the type attribute is optional and takes the value text / javascript if not explicitly specified.

In other cases, it is better to write the code in a separate js-file and include it on the necessary pages. It is desirable to minimize all code on production sites, and if there are a lot of files with scripts, it would be a good practice to combine such files into one and then connect it to the page. This approach will significantly speed up the loading of your pages. Download speed can be viewed in the browser console in the network tab or use services like Goggle PageSpeed ​​.

JavaScript development requires at least basic knowledge of the language. Novice developers write event handlers directly from html tags in attributes, for example, onclick event . This approach is not recommended as it mixes code with tags.

It will be correct to register classes for tags, in the class attribute , and access the elements from the js-code placed in the file. Sometimes you can write identifiers, id attribute of the tag. But classes are preferable, as this way you can also use them in css .

There are some rules to follow when writing code. For example, before developing it is important to decide how functions and variable names will be named. You should check whether the page elements are loaded, and only then access them from JavaScript .

Elements (selectors) are accessed using 6 basic methods for finding DOM elements: getElementById , getElementsByName , getElementsByTagName , getElementsByClassName , querySelector , querySelectorAll . Thus, having found an element on the page, you can set a handler for it, delete the element itself, change its properties, etc., that is, give the page interactivity, animate it.

Many libraries have been written for this language, the most popular is of course jQuery . It greatly simplifies coding and maintains cross-browser compatibility. But such a library must be constantly connected to the page and monitor its version. Therefore, most developers prefer using native JavaScript .