Understanding JavaScript Basics
Deđugger
Posted on March 1, 2021
Introduction
When learning Web Development we have 3 prerequisite languages that goes without saying, a web developer should learn. HTMLâHypertext Markup Language that gives a web page structure. CSSâCascading style sheet language that styles a web page.
JavaScriptâprogramming language that helps with interactivity of the web. Did you notice only JavaScript is as a programming language? Ideally, a computer doesnât figure out what to do or display. We need a programming language that tells the computer what to do, or the action expected when a user interacts with the web page.
Code is for humans. Meaning, the code we write is more of instructions that we pass to the web browser or computer. Programming Languages are there to help on how you pass instructions for the computers to execute the instruction.
Learning JavaScript can be intimidating. At least it was for me when I started. Especially when youâre learning on your own, reading countless blogs on web development while trying out the endless free online courses.
All these blogs would talk about the need for learning JavaScript and that it would be the one skill if learned well would get you at that first tech role. Learn, understand thoroughly the fundamentals and practice. Make sure you donât jump into learning frameworks before understanding the fundamentals as this is the blueprint. Thereâs a lot of truth in that, so Iâve learnt.
Starting off, we learn the basics. These will get you on the programming journey; help you learn how to create proper websites that users can interact with while browsing. Weâll go through this in a series. For starters, weâll cover JavaScript basics.
Letâs dive in
Statement
JavaScript as a programming language uses a set of instructions or steps that a computer follows. The instructions or the steps are referred to as statement
let today = new Date()
Comments
Same as in Html & CSS comments are crucial in JavaScript. We use this to communicate â ideally the code enclosed need not to be displayed to the browser. There are two ways to comment in JavaScript as below
// A comment
/*
This is a comment that
has multiple lines!
*/
Variable
A variable can be defined as a container that holds data. In order to use a variable you need to name it. This is done where you declare a variable and we use Var, Let and Const to do so depending on the data you want stored. The difference between the three is based on scope, something we'll expound on later in the series.
var count = 10;
let weather = 'Sunny';
const fullName = 'Grace Brown';
Data Types
When programming we store data that we manipulate and use for one thing or another. A programming language such as JavaScript like other languages use Data Types to do so. When we talk about data what comes to mind is text and numbers right?
In programming languages, these words might be slightly changed in the case where instead of saying âtextâ we say String. Think of it like string of characters.
// double quotes
console.log("This is a string!")
// single quotes
console.log('Good Morning!')
Numbers
In the case of numbers, for JavaScript a number is just a number.
// The number 8
console.log(8)
// Addition
console.log(3 + 4)
// Subtraction
console.log(20 - 3)
// Multiplication
console.log(3 * 7)
// Division
console.log(50 / 5)
Booleans
Are also a type of data type that represents true or false.
isLogged = true
inStock = false
Null and undefined
They represents the lack of value and are presented in different scenarios making them have a subtle difference. Null means (has no value) while undefined means (has not been given value)
console.log(null)
console.log(undefined)
Object
Represents a collection of data making them composite data types. They represent entities in such that it contains properties that describe it.
let cat = {
name: 'Kat',
legs: 4,
color: 'brown'
}
Arrays
Is a type of a variable (stores data) however the difference is an array stores a list of values. We access items in an array numbering them starting from zero and not one. This type of numbering is called index.
let fruits = ['Mango', 'Kiwi', 'Bananas', 'Watermelon']
Expressions
An expression is code that evaluates to a value. There are two types of expression; one that assigns a value to a variable and one that uses two or more values to return a single value.
60 // a number literal expression
"Hello World" // a string literal expression
5 * 2 // "gives" us the value 10
"Hello " + "Mary" // "gives" the value "Hello Mary"
Operators
They help to create single value from single or more value.
Types of Operators:
Assignment Operators
color = 'grey';
Arithmetic Operators
area = 7 * 5;
String Operator
greetings = 'Hello ' + 'John';
Comparison Operator
Compares two values and returns true or false.
spend = 3 > 5;
Logical Operator
They combine expressions and return true or false
spend = (5 > 3) && (2 <4)
Conclusion
This is just a tip of the iceberg, honestly. We have more to dive into for example; where to use these fundamentals. What works where or when, and so on. Until the next series, keep coding and keep safe.
Posted on March 1, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.