Master JavaScript Basics In 8 Minutes
Learn JavaScript In 8 Minutes
Before reading, I must say this is for absolute beginners only.
What the heck is even JavaScript?
JavaScript is known as the modern language of the modern web browser. JavaScript continues to evolve throughout the years.
JavaScript is an extremely powerful, flexible, and fast programming language. You are able to use it from frontend to backend.
You can build a desktop app using JavaScript too in conjunction with ElectronJS. You can build SPA (Single Page Application) with ReactJS. You can make a backend with NodeJS. Anything you named it.
Buckle up, everyone! Make sure you take notes along the way, understand the foundation will set you up for complex concepts.
NOTE: Java is not JavaScript!
1) Console
If we want to print something to see on the screen use the console keyword. One action or method that is built into the console object is the .log method.
When we put something inside console.log(), it gets printed or logged to the console.
For example:
2) Comments
Programming is usually highly cooperative and collaborative. Comments let other developers know what the code is doing. It’s super useful.
Sometimes you don’t want your code to get compile, you’ll want to consider using comments.
You can also use comments for pseudocode too! For those of you that don't know what pseudocode is, for short pseudocode is like draft down or jot down what you want to do first and do next before typing out your code.
For example:
// This is for single-line comment
/* This is multi-line
comment */
3) Data Types
There are 7 different kinds of data types in JavaScript :
- Number: Any number including integer or decimal. For example, 6, 60, and 3.142.
- Boolean: One of the data types that have two possible values either true or false. It’s like an answer to a specific question either “yes” or “no”.
- Object: Collections of data.
- String: A group of characters, must be surrounded with a double-quote (“This is a string“) or a single quote (‘This is a string‘).
- Undefined: A variable has been declared but has not yet been assigned to a value.
For example:var meal;
console.log(meal);
// Prints undefined
- Null: A special keyword that shows an absence of value.
For example:var meal = null;
console.log(a);
// Prints null
- Symbol: Act as a unique identifier, use in complex code.
For example:
4) Arithmetic Operators
Have you learned to add, minus, multiply, and divide in your primary school? Yes, that’s it!
You can even apply math in programming language too!
In JavaScript, it looks like this:
1) Add: +
2) Minus: -
3) Multiply: *
4) Divide: /
5) To find remainder: %
// To find remainder is also known as modulo.For example:
5) Methods
Methods are usually actions we can perform in JavaScript.
We can use methods just by calling with a:
- dot operator
- method’s name
- opening & closing parentheses
We can print it too!
For example:
If you want to know more about methods in JavaScript you can refer to MDN Documentation here.
6) String Concatenation
For short, string concatenation means we are able to join up all strings together to form a sentence.
For example:
7) Properties
With the usage of properties, you can get the property information by appending it to the particular string with a dot.
For example:
So, until this point, you might ask what’s the differences between Methods & Properties?
- A property is something that “belongs” to the object.
For example, we have an object called donaldDuck:
We want to find his age we can do it like this -> donaldDuck.age- A method relates to “actions” that will act upon an object.
For example, we want donaldDuck to speak French or any other languages.
We can do it like this -> donaldDuck.speak()8) Built-In Objects
Built-in objects also refer to objects built into JavaScript.
Built-in objects are useful in performing complex mathematical calculations.
For more info be sure to check out MDN Documentation here about built-in objects.
For example:
9) Variables
Calm down if you get too overwhelming, variables might be confusing to you in JavaScript.
For short, a variable is something that is used to store data.
In JavaScript, we have var, let, and const for declaring variables.
Example for var:
Keep in mind that, when you declare a variable, the variable name cannot start with numbers such as integer & float.
Variables name are case sensitive means myFood and myfood are not the same.
Example for let:
With let, the data store in let can be altered. What do you mean by alter? Perhaps take a look at the example below.
Once you store any value in let, it can be altered later on.
Example for const:
Have you heard before constant variable in your science class?
Yes, that’s it! It’s in JavaScript, with const you can store data too.
Why do you get an error when you reassigned it to another value? Why do you get TypeError?
Because const means constant, the data once assigned can’t be altered later on.
If you want to reassign value in a variable later on, use let.
If you don’t want to reassign value in a variable later on, use const.
10) Calculation Using Variable
You can even go further to do some calculations in JavaScript.
For example:
You can even destructure to make it simpler but still function the same way.
After destructuring:
11) Increment & Decrement In Action
We can increment or decrement the number by 1.
For example:
12) String Interpolation Using Variable
We can combine a string with the use of variable. It’ll boost the readability of the code to the next level.
For example:
13) Check Data Type
To check what is the data type you can use (typeof).
For example:
14) Conditional Statements
What are conditional statements?
Conditional statements are statements that allow you to make decisions about what is going to happen next.
Try asking yourself what if you do this and what happens next? If you drink a lot of water, else what is going to happen next?
In JavaScript, we can easily do this with the if statement:
For example:
We can say if speaking is true then we can print out the statement.
You may ask what if it is false? There’s an else we can use in JavaScript to act as a backup.
For example:
If it is not speaking, we’ll get an output “I am not speaking”.
15) Use Comparison Operators
There are a few comparison operators you can use in JavaScript such as:
- Less than (<)
- More than (>)
- Greater than or equal to ( >=)
- Less than or equal to ( <=)
- Not equal to (!==)
- Strict equal to (===)
For example:
16) Else If Statement
If we want to add more conditions to if…else, yes we can by using else if.
For example:
You can add more else if to make it more complex if you want to. It doesn’t matter how many else if you add.
17) The Switch, Case, Break
Switch, case, break provides easier-to-read syntax, also increases readability. It has the same functionality just like else if.
For example:
- The switch keyword initiates the statement. Just like if keyword.
- The case keyword will check if its matches the specified value. From our example, our specified value is lunch.
- The break keyword will exit the block not to execute more code.
- If nothing is matched then it will run the default block. Then we’ll get an output “There’s no meal today!”.
In conclusion
That’s it! The basics of JavaScript you should know as a beginner! Now, the ball’s in your hand, remember to apply what you have learned so far. Go on open your favorite IDE and type something. I hope you are able to gain some fundamentals of JavaScript through this article. Happy coding!
If you haven’t read my previous article yet, do check it out here:
