[Understanding Variables in Programming]
Hello HaWkers! Jeff Bruchado here.
This is the third article in our series that will cover our journey to Learn Programming from Scratch.
Well, no wasting time, let's get started!
Within the universe of programming, variables play a fundamental role. In JavaScript, this role is amplified by its dynamism and versatility.
This article aims to clarify what variables are, how to declare them, and how they behave within the JavaScript environment. JavaScript is the language we chose to study Programming from Scratch.
What are variables?
Variables, in simple terms, are "boxes" where we store values. Imagine you have a series of drawers, and in each one, you store a different object.
Variables work similarly, storing data that can be numbers, strings (text), objects, among others.
How to declare variables and store values in them?
In JavaScript, we have several ways to declare variables, the most common being through the keywords var, let, and const.
Each has its peculiarities:
- var: Was the traditional way to declare variables before ES6. Variables declared with var are, by default, hoisted and have function scope.
- let: Introduced with ES6, allows declaring variables with block scope, avoiding many problems related to var.
- const: Also from ES6, is used to declare constants, meaning values that cannot be reassigned after their declaration.
Well, if you didn't quite understand the difference between each one, when in doubt use let for variables whose values can be modified after declaration, and const for variables whose values are not changed after declaration.
But NEVER use var to declare variables, as I said above, this is the old way of declaring variables, and should no longer be used.
Var, Let or Const? A Question of Immutability
When choosing between var, let, and const, immutability is an important consideration.
When you declare a variable with const, you're not just saying that the variable cannot be reassigned; you're making a statement about immutability:
Although we can modify the array declared as constant, we cannot reassign a new value to it.
Understanding Initialization vs. Declaration
In JavaScript, it's possible to declare a variable without initializing it:
But we can assign a value to it later:
Hoisting
Hoisting is a peculiar JavaScript behavior that "moves" variable declarations to the top of their scope.
In practice, this means that a variable can be used before it's declared.
However, it's recommended practice to declare variables at the beginning of their scope to prevent confusion.
Naming rules
Although JavaScript is a flexible language, there are some rules for naming variables:
- Names can contain letters, numbers, underscores (_), and dollar signs ($), but cannot start with a number.
- It's not allowed to use language keywords as variable names.
- Variable names are case-sensitive, meaning Name and name are different.
- It's recommended to use the camelCase convention for variable names with more than one word.
Data Types in Variables
In Programming and JavaScript, variables can store different data types.
While some languages require you to explicitly declare the data type of a variable, JavaScript is dynamically typed. This means that a variable's data type can change during program execution. Some of the most common types include:
- Number: For numbers, whether integer or floating-point.
- String: For character sequences.
- Boolean: For true or false values.
- Object: For data collections or constructor instances.
- Undefined: For uninitialized variables.
- Null: Represents the absence of value.
Temporal Variables with Template Strings
Now I'll explain something really cool that we have available in JavaScript and other programming languages too, like Python. These are Template Strings.
Instead of concatenating variables in strings using the plus sign (+), modern JavaScript offers Template Strings to embed variables within strings:
This makes reading and formatting texts that include variables easier.
Operations with Variables
Another really cool thing in Programming is that you're not limited to just storing values in variables. You can also perform operations and have the results of those operations stored:
Variable scope
Another concept I consider super important for you to understand - it won't necessarily be needed right now, but in the future you'll definitely encounter scope cases!
Basically, variable scope refers to the part of the code where it can be accessed. In JavaScript, we have basically three scopes: global, function, and block.
Global Scope
Variables declared above or below any function or block belong to the global scope. They can be accessed from anywhere in the code, which can sometimes cause conflicts and unexpected errors.
Function Scope
Variables declared inside a function using var have function scope. This means they can only be accessed within that function.
Difference Between Global Scope and Function Scope
The main difference between global and function scope is accessibility.
While global scope variables are accessible throughout the code, function scope variables are restricted to the function where they were declared.
With the advent of ES6 and the introduction of let, we also have block scope, which limits access to a specific code block, like loops and conditionals.
Next, let's visualize the difference in code between scopes.
Function vs. Block: Visualizing Scopes
Well, as I mentioned above, JavaScript ES6 introduced let and const, which have block scope.
Next, I'll show you the difference between function scope and block scope:
Conclusion
Well HaWker, as you can see, this is quite a dense article, and extremely important.
Understanding variables is crucial to mastering Programming and JavaScript, or any other programming language.
By understanding the nuances of declaration, hoisting, and scope, you'll be better prepared to write clean, efficient, and error-free code.
And remember, I'm here to help you every step of the way!
Awesome HaWker! 👏🏻
We've reached the end of our third article. 😮💨
And if you made it this far, please reply to this email with "I managed to understand variables!". So I know that this article series is being useful for you.
If you have any questions, please! Feel free to reply to this email with your question, it will be a great pleasure to help you.
Only a true HaWker makes it to the end.
Congratulations!
I'm happy to have you here.
See you soon, let's go! 🦅
- Jeff Bruchado
Congratulations on making it this far, HaWker! 🎉
Now that you've learned about variables in programming and their various nuances, how about testing your knowledge? Take the quiz below and see how much you absorbed from our article.
It's a great way to reinforce learning and prepare for the next steps in your programming journey.
Good luck and have fun!