DEV Community

loading...
Cover image for JavaScript Made Easy: Part 3

JavaScript Made Easy: Part 3

dtetreau profile image David Tetreau Updated on ・4 min read

In JavaScript, syntax is very important. Syntax is a set of rules that can make or break a program. This article will focus on explaining the proper syntax which JavaScript uses to construct programs. Open a repl and follow along with the article. Each time you arrive at a new topic, pause and try to experiment with it in the repl. Assign each data type to a variable and log it to the console.

Camel Case

You may have seen variables named in several different ways. This is especially true if you have learned other programming languages. However, the proper variable naming syntax for JavaScript is camel case. An example of camel case can be found below:

const favoriteFood = "sushi";
Enter fullscreen mode Exit fullscreen mode

If you look at favoriteFood, you can see that the first word of the variable name is lowercase and the second word has no space between it and the first word. The second word is also capitalized. This is the proper way to name variables in Javascript. The variables FavoriteFood and favoriteFood would refer to two different variables. FavoriteFood would be against coding conventions.

Data Types

There are numerous data types used in JavaScript. They are listed below with examples:

  • Strings

Here are a few examples of strings assigned to variables:

const role = "blogger";
Enter fullscreen mode Exit fullscreen mode
const role = 'blogger';
Enter fullscreen mode Exit fullscreen mode

As you can see, a string can be created using single or double quotes. You can also combine single and double quotes as long as the outer quotes are different than the inner quotes:

const role = "I am a 'blogger'";
Enter fullscreen mode Exit fullscreen mode

or

const role = 'I am a "blogger"';
Enter fullscreen mode Exit fullscreen mode

If you want to use the same quote type for the inner and outer quotes, you will have to use the escape character which is a back slash:

const role = 'I am a \'blogger\'';
Enter fullscreen mode Exit fullscreen mode
  • Numbers

This data type represents values that are positive or negative and numbers with or without a decimal place. Also, numbers can have exponential notation e.g. 1.6e-4. This is the same thing as 1.5X10^4. Examples of numbers are:

let noDecimal = 1;
let exponentialNotation = 1.6e-4;
let decimal = 1.2;
Enter fullscreen mode Exit fullscreen mode
  • BigInt

This data type is basically an integer with arbitrary precision. It is a way to represent whole numbers larger than 253-1. This is important when precision is important. Example:

big-int
Notice the output in the console has an "n" behind it. This is how JavaScript deals with big numbers.

  • Booleans

Booleans can only have two values. They can be true or false. Here are examples of both of the values associated with booleans:

const iAmLearning = true;
const iAmGivingUp = false;
Enter fullscreen mode Exit fullscreen mode
  • Undefined

The data type undefined is basically a variable that has no value. It is very simple to understand. There is an example below:

let cars;
Enter fullscreen mode Exit fullscreen mode

As you can see, an undefined data type is basically a variable without the equals sign and the value on the end. If you were to console.log(cars) you would get undefined.

  • Null

This data type is different from undefined because it has something assigned. That something is the value null. Here's an example:

let cars = "Ford Mustang";
cars = null; 
Enter fullscreen mode Exit fullscreen mode

Notice that there is an equals sign. Therefore, you are setting cars equal to null. This is basically emptying the cars variable of its contents. After cars is assigned the value null, if you console.log() cars, null will appear in your console instead of "Ford Mustang".

  • Symbol

This is a data type whose instances are unique and immutable (can't be changed). Here's an example:

symbol

As you can see, a symbol can be accessed using dot notation followed by the keyword "description".

  • Objects

This particular data type is more complex and is used to store collections of data. An object contains properties that come in pairs. We call these key-value pairs. Here's an example of an object:

let car = {
    make: "Toyota",
    model: "Tundra",
    color: "black",
    doors: 4
}
Enter fullscreen mode Exit fullscreen mode

Notice that there is one variable assigned to the entire object. The object's name is car. The object's key-value pairs are contained in the curly braces. The first key is make. The value assigned to make is "Toyota". If you wanted to access this value you would do the following:

objects

  • Arrays

Arrays are like objects because they store multiple values that can be assigned to a single variable. The values that are inside of arrays have indexes we use to refer to them. The indexes start at zero. Here's an example of an array:

let friends = ["Lucas", "Craig", "Nick"];

Enter fullscreen mode Exit fullscreen mode

Lucas is stored at friends[0]. The brackets are used to refer to a particular value's location in the array which is known as its index. Notice the first value is at index zero. "Craig" is at friends[1]. The remaining value is stored at friends[2]. To see an example of the result of accessing an array by its index look below:

image

I hope you have enjoyed this post! Please check out the entire "JavaScript Made Easy" series by David Tetreau. There will be a new post daily.

Discussion (0)

Forem Open with the Forem app