Basic Building Blocks of Programming
Tags: programming, javascript, webdev, tutorial
Published: 2024-04-14 15:27:28


![Basic Building Blocks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w1qgd4frv6rpjt33o717.jpg)

There are basic building blocks of programming. Learning and understanding these building blocks and their relationships are of great importance in the process of learning and making software.

In all programming languages, these basic elements are the same or very similar to each other. Their basic logic of operation is common. For this reason, if you learn a programming language by understanding its foundation, you will not have difficulty in learning other languages.

In this article, we will examine the basic building blocks of programming through JavaScript. When we understand through JavaScript, we will also have understood in every language.

What are the basic elements of programming languages?

- Variables,
- Data types,
- Operators,
- Expressions,
- Control structures,
- Functions,
- Data structures,
- Classes and objects.

Now let's break down what these elements mean:

## Variables
Variables are named memory locations used to store data. Each variable has a data type and its value can be changed within the program. 

In JavaScript, variables can be declared in the following ways:

![Variables](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5z90mf270tg9yvz7uvyy.png)

If we examine each element here:

**var, let, const** are predefined keywords. Each has predefined functions. They have different use cases, but their main function is to declare a variable. So we can call them **Declaration keywords**.

**a, b, c** are the names we give to what we declare. We are making a declaration and we need to give a name to these declarations. We call them **name** or **reference**.

= is an **operator**. The function of this operator is to perform an operation. The operation it performs is to assign a value to the variable we defined. Therefore, = is an **assignment operator**.

**29, "text", "surname"** are the values that these variables take. They consist of data. They can take many data types. We call them **Data types / Value**.

The symbol indicating the end of the line is ; **Terminator**.

![Basic Building Blocks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w1qgd4frv6rpjt33o717.jpg)

What have we done here?

> We defined a value named a using a predefined keyword and assigned the value 29 to this variable using the = operator, thus performing an operation.

As I mentioned at the beginning of the article, every language has its own way of writing. In JavaScript/TypeScript languages, we perform operations using these operators and data types.

Let's briefly look at the other basic elements of programming below:

## Data Types

Programming languages typically support different data types such as numbers, strings (text), and boolean values (true/false)


![Data types](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0flrlf674l009if49tth.png)

---

## Operators

Operators are used to perform operations on variables and values. For example, mathematical operators (+, -, *, /), comparison operators (==, !=, <, >), and logical operators (&&, ||) can be used.

![Operators](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o3aibunapg3jek5tn9zk.png)

The combination of multiple operators is also called an expression. In this example, the line (a + b - 5) * 5 is an expression.


![Expressions](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sf3bbroi9dtwbgl31wef.png)

---

## Control Structures

Control structures are used to control the flow of a program. These structures include if-else statements, loops (for, while), switch-case statements, and functions.

By reading line by line from top to bottom in a code block, we can determine the direction of the code's execution by controlling the flow using these control structures.


![Control Structures](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d7cvsqsqiowpqioi2dlz.png)

---

## Functions

Functions are reusable code blocks that perform a specific task. There are many ways to define functions.


![Funcitons](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sfqmty73kpuqx76faz24.png)

---

## Arrays and Lists

Diziler ve listeler, birden çok değeri saklamak için kullanılan veri yapılarıdır.


![Arrays](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rdtz2xqiwy8vrcollxrc.png)

---

## Objects and Classes

In object-oriented programming languages, objects and classes are fundamental elements. Objects are instances with properties and behaviors. Classes define the templates of objects.


![Objects and Classes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tdeq08u0uptrkb2ocjk3.png)

---

We've only delved into the basics using the JavaScript language. Remember, there are different types of these definitions in every language. The important thing is to understand the logic.

When we know and understand all of this, we can program. Because almost everything else is made up of these structures.

For example, when we examine the frequently used console.log() statement, we can see that it consists of the Basic Building Blocks we defined above.


![Console log ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1n13cjtoh014k97xckpw.gif)

console.log() function can be understood by breaking it down into simple components:

( **console** ): The console object in JavaScript allows us to perform operations on the console. This object can be used in the browser or in the Node.js environment.

( **.** ) : The dot operator is used to access a property or method of an object. It is used to access the log method of the console object.

( **log** ) : log is a method of the console object, and this method allows us to write a message to the console. The log method is used to print the given values to the console.

Therefore, the console.log() function prints a message to the console by calling the log method of the console object.
For example, the code **console.log("World of the Web")** prints "World of the Web" to the console by passing it to the log method of the console object.

These basic components make up the logic of the console.log() function, and through this function, we can get information about the state of our code and debug it.


![Console log](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4mbwmn5gl0iclshakbeu.jpg)

After understanding these structures, our software learning process will be easier. 

I hope I have explained it.

---
I warmly invite you all to [my YouTube channel](https://www.youtube.com/@worldoftheweb), where I not only share insightful content on web development but also explore the fascinating dynamics and technologies of the ever-evolving web world.

[Twitter](https://twitter.com/aktaseren_) - [Linkedin](https://www.linkedin.com/in/erenaktas/) - [Youtube](https://www.youtube.com/@worldoftheweb)

The sources referenced in our article are:

[Tuncay Baylan](https://www.linkedin.com/in/tuncay-baylan-43ab207?miniProfileUrn=urn%3Ali%3Afs_miniProfile%3AACoAAAFpWG4BC8iPLInhEBpkNdb79HwLmhTNID8&lipi=urn%3Ali%3Apage%3Ad_flagship3_profile_view_base%3BdRLLTHHQQcuauvzCWefOng%3D%3D)

[Worldoftheweb](https://www.youtube.com/@worldoftheweb)

Thank you.