JS 101 (2 - n) Data Types

Welcome back!
I invite you to read the first post of this series JS 101 - Fundamentals

Content
JS 101 (1-n) - Introduction
JS 101 (3-n) - Type Conversion
JS 101 (4-n) - Comparisons

Let’s continue our learning about this language. Today we’re going to talk about:

Data types

Programming languages ​​handle something known as strong typing, weak typing, dynamic typing, or static typing.

Characteristics of strongly typed languages:

1. You must explicitly specify the data type of a variable.
2. You can not change the data type after that variable. Doing so will generate errors.

The data types may vary depending on the language. For example, in Java, there are various types of numeric data, depending on the bit size of that number, or whether it is decimal or integer...

Characteristics of weakly typed languages:

1. There is no need to specify the data type of a variable.
2. You can change the data type of that variable at any time.

Many times strong typing is confused with static typing or weak typing with dynamic typing, but in reality, they are different concepts.

Characteristics of static typed languages:

1. The typing check is done during compilation.
2. If there is a data typing error, the program does not run and throws an error.

Characteristics of dynamic typed languages:

1. The typing check is done during execution instead of compilation.
2. If there is a data type error, the program will run as far as the error is found.

What data type does Javascript handle?

Javascript is of the weak and dynamic typed.

Javascript data types are not bound to any variables. Therefore, the internal interpreter during execution understands what type of data contains a variable and how it should handle it automatically.

Let's look at the differences between a strong and statically typed language, and Javascript:

//Code in Java: Strongly and static typed
String hello = "Hello World!";
int num = 123;
boolean isJavaCode = true;

//If you try to change any value for other type, generates an error...
hello = 123; //ERROR: incompatible types: int cannot be converted to String...

//Code in Javascript: Weakly and dynamic typed...
let hello = 'Hello World!';
let num = 123;
let isJavaCode = false;

//If you try to change any value for other type, NO generates an error...
hello = 123; // OK

Data types in Javascript

The data types handled by the Javascript interpreter are classified into Primitives and Objects.

Primitives

Numerics

• Number: It is applied to both integer and float point (decimal) numeric values.

There are also the so-called special numerical values, these are:

• infinity: Represents the mathematical infinity (∞). It is greater than any other number.
• NaN:(Not a Number) Represents a calculation error.

let num = 123; //number

let division = 1 / 0 // infinity

let nanNum = Math.sqrt(-1); //NaN

• BigInt: It is a data type recently added to the language, and in simple words, it is used to specify very very large integers. It is identified by adding an n to the end of the number:

//The "n" at the end indicates that it's a BigInt...
let bigNum = 1471581264892135468476313n;

 

👍 Mathematical operations in Javascript do not generate errors (execution will not stop if there are calculation errors), if there is an error you will simply get: NaN.

Characters, words, and sentences

• String: can be words or a simple letter. They must be in quotation marks. In javascript you can use 3 types of quotes:

1. Simple and Double: They are both the same. You can use one or the other. Never mixed (' string ").
2. Backticks: They are quotation marks with extended functionality, which allow adding variables or expressions within the same string, using ${ }. It also allows us to suppress the concatenation (+) as it detects the spaces between words.

//Simple (' ')
//Double (" ")
//Backticks (` `)

let mySimple = 'Hello';

let myDouble = "World!";

let myBacktick = `${mySimple} ${myDouble} :Concatenation is not required here, can use others variables and join words`;

// Concatenation example without using backticks

let helloWorld = mySimple + ' ' + myDouble + ' :Concatenation is required here to join words or variables and to create spaces...';

True or False

• Boolean: It has only two values: true or false. Mostly used to store values ​​like "yes-true", "no-false". It's also the way conditional expressions are evaluated in conditional control structures.

let age = [8,10,18];

let isAdult = (n) => {
 if(n === 18) {
   return true;
 }else {
   return false;
 }
}

for(var i=0; i < age.length; i++) {
  console.log(`${age[i]} ${isAdult(age[i])}`) 
  //Return
  // 8: false, 10: false, 18: true
}

Strange or peculiar

• Null: Is a value that indicates that the variable is empty, or that it is value is unknown.

//Explicitly declared. Indicates that the value is unknown at this time...
let myVariable = null;

console.log(myVariable); // null

• Undefined: Indicates that the value of a variable has not been defined.

//Declare variable without initializing.
let myVariable;

console.log(myVariable); // undefined

 

❗ You can read more about null and undefined here: null / undefined

 

• Symbol: It was added to the primitive data list in ECMAScript 2015. It's a different or peculiar data type. Lets you create unique identifiers. The values ​​of the Symbol are kept private and for internal use, that is, its values can only be accessed by reference. It's usually used for debugging or to identify the keys (properties) of an object and avoid overwriting it. Later we will go deeper into this data type.

//Create a symbol
let id = Symbol();

//Symbols are unique
let id2 = Symbol();
isIdentique = id === id2 
console.log(isIdentique) // False

/*You can add descriptions to 
identify them if you want you 
to have many symbols in your code, 
but it does not alter the result*/
let id3 = Symbol('My symbol 3');

Object

Objects allow you to store collections of data or code structures that are more complex than primitive data. In simple words, an object is a value in memory that is accessed through an identifier. Its literal representation is by means of the key (property) / value pair. There are different types of objects, but these we will see later.

//Literal representation
// obj = {key:value}
// Each pair key/value is separated by a comma, except the last one
// It can store anything, including functions

let myObject = {
 name: 'Valentina',
 brothers: 2,
 isHasPets: true,
 helloWorld: function() { 
  console.log('Hello World!')
 }
}

// Accessing the data = obj.key
console.log(myObject.name);  //Valentina
console.log(myObject.brothers);  //2
console.log(myObject.isHasPets);  //true
myObject.helloWorld();  //Hello World!

 

❗ Difference between primitives and objects
Primitives are unique values. They do not contain their own methods. (Only through wrapper objects - we'll see later)
Objects store more complex data collections and structures contain methods of their own.

 

With this general coverage, you already know in a simple way the different types of data that exist in Javascript...

... But, as we said in the beginning, this data is not specified when declaring the variables, so how can we know exactly what type of data the Javascript interpreter is identifying? Well, for this exist "typeOf".

typeOf

It allows us to know what type of data is the value of a variable, returning: string, object, boolean, undefined, etc.

// You can use it as:

// an operator: typeof variable
typeof true; //boolean
typeof {};  //object
typeof 'Hello World'; //string

// a function: typeof(variable)
typeof(123); //number

 

⚠️ When tested with a variable of type null, it will return that it is an object, this is a language error because as we have seen, null belongs to primitive data types.

 

If it comes from strongly typed languages, maybe you can better understand TypeScript, which we can say is the strongly-typed version of Javascript, although it is much more than that and we will be dealing with it later.

With this, we can finish this post. I hope you have learned a lot, do not miss the next chapter of this series. See you soon!

 

Other posts:

• Javascript behind scenes
• Java vs Javascript
• Algorithm