[JavaScript] Basics
Table of Contents
Learning JavaScript
In this post, we are going to learn about the brief basics of JavaScript.
Variables
There are three ways to declare variables in JavaScript.
- var
- let
- const
var is a relatively old way of declaring a variable, so we will stick to let and const in this post.
Just like other languages, variables let us store information.
let userName = 'hello';
let user = 'John', age = 25, userName = 'Hello';
We commonly use camelCase for the names of variables.
We can use const to declare constant variables.
const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
Notice that we cannot reassign variables declared with const.
It is a convention to use all uppercase for constants calculated before runtime and use normal camelCase for constants calculated after runtime.
Numbers
Integer
JavaScript has only one type of number. Numbers can be written with or without decimals.
let x = 3.14; // A number with decimals
let y = 3; // A number without decimals
let x = 123e5; // 12300000
let y = 123e-5; // 0.00123
Unlike other programming languages like C, JavaScript does not define different types of numbers like int or float.
JavaScript numbers are always stored as double-precision floating point numbers, following the international IEEE 754 standard.
This format stores numbers in 64 bits, where the number (the fraction) is stored in bits 0 to 51, the exponent in bits 52 to 62, and the sign in bit 63.
The range of safe integers is $-2^{53}-1$ ~ $2^{53}-1$
Floats
Like other languages, Floating point arithmetic is not always 100% accurate.
let x = 0.2 + 0.1; // yields 0.30000000000000004
Numeric Strings
JavaScript will try to convert strings to numbers in all numeric operations.
let x = "100";
let y = "10";
let z = x / y; // yields 10
NaN
NaN is a JavaScript reserved word indicating that a number is not a legal number.
You can use the global JavaScript function isNaN() to find out if a value is a not a number:
let x = 100 / "Apple"; // yields NaN
isNaN(x); // yields true
Infinity
Infinity (or -Infinity) is the value JavaScript will return if you calculate a number outside the largest possible number.
Division by 0 (zero) also generates Infinity.
// yields infinity
let myNumber = 2;
while (myNumber != Infinity) {
myNumber = myNumber * myNumber;
}
// yields infinity
let x = 2 / 0;
Notice that Infinity is also a number in JavaScript
typeof Infinity; // returns number
Unary +
Unary plus converts a non-number into a number
// Converts non-numbers
alert( +true ); // 1
alert( +"" ); // 0
let apples = "2";
alert( +apples ); // 2
Strings
We can create Strings like the following example
const string = "The revolution will not be televised.";
Notice that both double and single quotes will work as long as they are consistent.
Concatenating strings
To join together strings in JavaScript you can use a different type of string, called a template literal.
we can create template literals with backtick characters (`).
With template literals, we can include variables in it wrapped with ${ }
const name = "Chris";
const greeting = `Hello, ${name}`;
console.log(greeting); // "Hello, Chris"
const one = "Hello, ";
const two = "how are you?";
const joined = `${one}${two}`;
console.log(joined); // "Hello, how are you?"
// we can also include expressions
const output = `I gave it a score of ${(score / highestScore) * 100}%.`;
Template literals respect the line breaks in the source code, so you can write strings that span multiple lines like this:
const output = `I like the song.
I gave it a score of 90%.`;
console.log(output);
/*
I like the song.
I gave it a score of 90%.
*/
You can also concatenate strings using the + operator:
const greeting = "Hello";
const name = "Chris";
console.log(greeting + ", " + name); // "Hello, Chris"
Other Data Types
There are eight basic data types in JavaScript.
- String
- Number
- BigInt
- Boolean
- Undefined
- Null
- Symbol
- Object
Let’s briefly learn about data types other than String and Number
BigInt
For numbers that is out of the Integer range ($-2^{53}-1$ ~ $2^{53}-1$), we can use BigInt.
// the "n" at the end means it's a BigInt
const bigInt = 1234567890123456789012345678901234567890n;
Boolean
The boolean type has only two values: true and false.
let nameFieldChecked = true;
Null
The special null value does not belong to any of the types described above.
In JavaScript, null is not a “reference to a non-existing object” or a “null pointer” like in some other languages.
It’s just a special value which represents “nothing”, “empty” or “value unknown”.
It forms a separate type of its own which contains only the null value:
let age = null;
Undefined
The special value undefined also stands apart. It makes a type of its own, just like null.
The meaning of undefined is “value is not assigned”.
If a variable is declared, but not assigned, then its value is undefined:
let age;
alert(age); // shows "undefined"
Objects
Objects are used to store collections of data and more complex entities.
We will learn about Objects in detail later.
Strict vs Loose Equality
Double Equals (==)
There are two types of equality in JavaScript.
Double equals (==) is often referred to as ‘loose equality’ because it performs type coercion before making any comparison.
Let’s look at an example.
const a = 100;
const b = '100';
console.log(a == b) // true
We can see that the types of the constant variables are different.
However, a == b will still return true because the variable a is converted to a string before making the comparison.
Triple equals (===)
Triple equals (===), also referred to as “strict equality”, works similarly to how double equal works, with one important difference: it does not convert the types of the operands before comparing.
Let’s look at an example
const a = 100;
const b = '100';
console.log(a === b); // false
There is also a “strict non-equality” operator !== analogous to !=.
Conditional
The if and else Statements
The syntax for if and else statements in JavaScript is
if (condition1) {
// block of code to be executed if condition1 is true
} else if (condition2) {
// block of code to be executed if the condition1 is false and condition2 is true
} else {
// block of code to be executed if the condition1 is false and condition2 is false
}
The switch Statement
The syntax for switch statement in JavaScript is
switch (expression) {
case x:
// execute case x code block
break;
case y:
// execute case y code block
break;
default:
// execute default code block
}
Boolean Conversion
The if statement evaluates the expression in its parentheses and converts the result to a boolean.
- A number 0, an empty string “”, null, undefined, and NaN all become false
- Other values become true.
Reference
https://www.theodinproject.com
https://www.w3schools.com/js/js_numbers.asp
https://javascript.info/variables
https://javascript.info/operators
https://www.freecodecamp.org/news/loose-vs-strict-equality-in-javascript/
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Strings#concatenating_strings