This chapter is from the book
This chapter is from the book
This chapter is from the book
More Variable Stuff
What we learned in the previous section will take us far in life. At least, it will in the parts of our life that involve getting familiar with JavaScript. We won’t dive too much further into variables here—we’ll do all of that as part of future chapters where the code is more complex and the importance of variables is more obvious. With that said, there are a few odds and ends we should cover before calling it a day.
Naming Variables
We have a lot of freedom in naming our variables however we see fit. Ignoring what names we should give things based on philosophical/cultural/stylistic preferences, from a technical point of view, JavaScript is very lenient on what characters can go into a variable name.
This leniency isn’t infinite, so we should keep the following points in mind when naming our variables:
Variables can be as short as one character, or they can be as long as you want—think thousands and thousands of characters.
Variables can start with a letter, underscore, or dollar sign ($). They can’t start with a number.
Outside of the first character, our variables can be made up of any combination of letters, underscores, numbers, and $ characters. We can also mix and match lowercase and uppercase letters to our heart’s content.
Spaces are not allowed.
Here are some examples of valid variable names:
let myText; let $; let r8; let _counter; let $field; let thisIsALongVariableName_butItCouldBeLonger; let __$abc; let OldSchoolNamingScheme;
To see if a variable name is valid, check out the really awesome and simple JavaScript Variable Name Validator at https://bit.ly/namevalidator.
Outside of valid names, there are other things to focus on as well, such as naming conventions, how many people commonly name variables, and other things you identify with a name. We will touch on these items in other chapters.
More on Declaring and Initializing Variables
One of the things you will learn about JavaScript is that it is a very forgiving and easy-to-work-with language.
Declaring a Variable Is Optional
For example, we don’t have to use the let keyword to declare a variable. We could just do something like the following:
myText = "hello, world!"; alert(myText);
Notice the myText variable is being used without formally being declared with the let keyword. While not recommended, this is completely fine. The end result is that we have a variable called myText. The only thing is that by declaring a variable this way, we are declaring it globally. Don’t worry if the last sentence makes no sense. We’ll look at what globally means when talking about variable scope later.
Declaring and Initializing on Separate Lines Is Cool
There is one more thing to call out, and that is this: The declaration and initialization of a variable do not have to be part of the same statement. We can break them up across multiple statements:
let myText; myText = "hello, world!"; alert(myText);
In practice, we will find ourselves breaking up our declaration and initialization of variables all the time.
Changing Variable Values and the const Keyword
Lastly, we can change the value of a variable declared via let to whatever we want, whenever we want:
let myText; myText = "hello, world!"; myText = 99; myText = 4 * 10; myText = true; myText = undefined; alert(myText);
If you have experience working with languages that are more strict and don’t allow variables to store a variety of data types, this leniency is one of the features people both love and hate about JavaScript. With that said, JavaScript does provide a way for you to restrict the value of a variable from being changed after you initialize it. That restriction comes in the form of the const keyword, which we can declare and initialize our variables with:
const siteURL = "https://www.google.com"; alert(siteURL);
By relying on const, we can’t change the value of siteURL to something other than https://www.google.com. JavaScript will complain if we try to do that. There are some gotchas with using the const keyword, but it does a great job overall in preventing accidental modifications of a variable. We’ll cover those pesky gotchas in bits and pieces when the time is right.
Tip
Jump Ahead—Variable Scoping
Now that you know how to declare and initialize variables, a very important topic is that of visibility. You need to know when and where a variable you declared can actually be used in your code. The catch-all phrase for this is variable scope. If you are curious to know more about it, you can jump ahead and read Chapter 8, “Variable Scope.”
The Absolute Minimum
Values store data, and variables act as an easy way to refer to that data. There are a lot of interesting details about values, but those are details you do not need to learn right now. Just know that JavaScript enables you to represent a variety of values such as text and numbers without a lot of fuss.
To make your values more memorable and reusable, you declare variables. You declare variables using the let keyword and a variable name. If you want to initialize the variable to a default value, you follow all of that up with an equal sign (=) and the value you want to initialize your variable with.
? Ask a question: https://forum.kirupa.com
Practice by building real apps: https://bit.ly/coding_exercises
Errors/known issues: https://bit.ly/javascript_errata