JavaScript Basics

Photo by Greg Rakozy on Unsplash

You want to design websites, or better yet, web apps…well first you must understand JavaScript (of course HTML & CSS too, but today, we talk JS)

Before you can add JS to your website, you need to get the basics of programming logic down. JavaScript can be a great first programming language to learn, as there are endless jobs out there for web developers.

Starting with the basics, you’ll need to learn about data types and variables.

JS is what is called a “loosely typed” language, meaning a variable can be reassigned to different data types. There are the Primitive, or basic, data types such as numbers, strings, and Boolean values. Numbers and strings may be easy for you to figure out, but the Boolean values may be a new term for you. Boolean values are those which only have two possible values: true or false. If the term “strings” is throwing you off as well, that simply refers to a “string” of characters. The words you are reading in this article are strings.

(JavaScript also has a more complex data type called Objects, but we won’t focus on those in this article.)

Now that we know the basics of the JS data types, let’s focus on what we can do with them. Just as we do in math, we can store values in variables. In your algebra class you had variables such as x or y, but in programming, we like our variable names to have more meaning. You’ll want your variables to convey what kind of data they are holding, while also being as concise as possible, and still readable. There are also some rules that you must follow when naming variables:

• Must start with a letter; though you’ll see later they can also start with a $ or a _
• No spaces; however, you can use underscores, camel case or Pascal case to distinguish between words (under_score, camelCase, PascalCase)
• May contain letters, digits, underscores, and dollar signs
• Are case sensitive; meaning name and Name are not the same variable
• Cannot use reserved words as variables

That is a tall order, I know, but here are some examples (all in camel case, as it is my personal favorite):

firstName
pyramidHeight
salesTaxPercent

One last thing to know before you start creating those variables and assigning them values. You have to use certain keywords to create the variables and you must also use an assignment operator in order to set the value. Let’s look at an example:

let firstName = 'Candi';
let lastName = "Beaman";

In this example, the first word, let is the keyword that allows us to use firstName as a variable. In this instance, let will allow us to change the value that you see on the right side of the = sign. Speaking of the = sign, this is the assignment operator I mentioned earlier. There are some others, but let’s stick with = for now. Also, you’ll see I used both the single and double quotes in the above example. JS let’s you use either, just make sure you stay consistent with what you use for strings.

So what if we had a value that we wanted to assign to a variable, that we didn’t want to change later on in the program? We would use the const keyword:

const pi = 3.14;

Here you see we are creating a variable to hold PI, which is a mathematical constant. You may be wondering why not simply use 3.14 instead of pi, well, what if we use PI throughout our program, and we later determine we need it to be more precise? We would then have to find every place we used 3.14 and change it to 3.14159 instead. By using a constant variable, as seen above, we only have to make the change in one place!

I mentioned some other assignment operators, so let’s see what those are.

Src: W3Schools

I really hope this intro into JavaScript variables and data types was useful, and not too overwhelming! Stay tuned for more JS tips to come.