Javascript – Main concepts

What is Javascript?

JavaScript is a programming language which means that it has variables, functions, loops and conditionals among other features. Through this we can modify the html elements of the document, process and validate user data or make resource requests to the server.

Basic concepts

In programming, a variable is a name by which we can refer to a space in the computer’s memory. In JavaScript it is not necessary to specify the type of data that the variable will contain and a variable can contain any type of data at any given time. Below are several ways to declare variables.

A conditional is a programming instruction that allows one or another code to be executed depending on whether the result of an operation is false or true. In JavaScript we have comparisons for equality, greater than and less than, and logical operators like and and or. Look at the example.

In programming it is very common to have to apply the same processes to a large amount of data, for this we use cycles, which allow us to repeat the execution of the same code. Below are two examples, the for loop and the while loop.

The purpose of functions in programming is to group code that is used very frequently. In JavaScript, functions can also behave like variables and this is one of its most important features. Check out the comments in the example below.

Object-oriented programming allows us to think of a computer program as a set of things that do something. In practice, an object looks like a data structure that also has functions that operate on its own data. Being JavaScript an object-oriented programming language, you can see several operations with objects in the following example.

Event-driven programming allows us to write programs that do not execute linearly, but instead execute part of the code in response to an event. An event can be something that happens, for example, when you click your mouse or the opening of a network connection. JavaScript is an event-driven language, in which we can connect functions with events, in order to interact with the user. In the example we connect a mouse event with an anonymous function.

JavaScript in the browser

Browsers offer a JavaScript execution environment through which we can manipulate the html document and perform some network operations. The possibilities we have are determined by sitios web creadores and the DOM API (Document Object Model – Application Program Interface) which is, simplifying a bit, a list of objects and methods available for this. There are many operations that we can do on an html document, below We mention a few.

Selection operations
Similar to css selectors, we have operations that return one or more elements of the document. Check out the comments in the example below.

style operations
Through these we can alter the properties of the html elements from JavaScript code, such as the font style in the following example.

Operations with multimedia elements
Media elements in particular have attributes and special events that other elements do not. In the example we see some attributes of the video element.

network operations
It is possible to make requests to the same server that we are visiting to obtain resources such as text, html, data or files, this is done with the AJAX (Asynchronous JavaScript And XML) technique that allows us to make the request without leaving the current document. In the example we see a GET request.

Operations with events
Through JavaScript it is possible to associate functions with events of the html document, in this way we can generate greater interaction with users. In the example we associate a function that will be executed at the end of a video.

The JavaScript code is implemented as a plain text file with a js extension. You must associate the js file to the html document using the script tag.