# JavaScript Data Types --- %[https://youtu.be/RH8KpgeAI1E] --- Values that have data types but are not explicitly indicated with variables are called **untyped languages**. In JavaScript, whether it is a number or string, or any other data type, only the `var` `let` or `const` keyword is used for declaration. **JavaScript** ```js var name = "Bello"; ``` > Untyped languages do not need a variable to be declared with a data type. They are also called **dynamically typed languages** Examples of other untyped languages besides JavaScript are **Python**, **Perl**, **Ruby**, etc. Other languages like **Java**, **C#**, **C++** are **static typed**. > A statically typed language needs a variable to declared with a data type In Java, a declared variable will look like shown below: **Java** ```java String name = "Bello"; // "Bello" ``` There are 8 data types in JavaScript: - Number - BigInt - String - Boolean - Null - Undefined - Symbols - Objects ### Number The number type is either an **integer** or a **floating-point** number. Let's perform a mathematical operation below: ```js let numb = 23; // integer let score = numb; const length = 12.5; // floating-point console.log(12.5 / 0.5); // 25 => integer ``` In the example above, there are two obvious observations. > An Integer number contains no decimal, and floating-point numbers are numbers with a decimal Other numbers are either in **infinity** or **NaN**. **Infinity** is a special value that is greater than any number. ```js console.log(1 / 0); // Infinity ``` Or reference it directly: ```js console.log(Infinity); // Infinity ``` Note: `Number.POSITIVE_INFINITY` is `Infinity` and `Number.NEGATIVE_INFINITY` is `-Infinity`. ```js Number.POSITIVE_INFINITY; // Infinity Number.NEGATIVE_INFINITY; // -Infinity ``` **NaN** (**Not a Number**) is an incorrect or an undefined mathematical operation ```js console.log(Infinity / Infinity); // NaN console.log("string" / 2); //NaN console.log(NaN + NaN); // NaN ``` **Number** type limit is 253 - 1. ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/nx76wubn2rzd7hjpup3o.gif) That is **Number** type maximum number is `9,007,199,254,740,991` and minimum number is `-9,007,199,254,740,991` Recall the Number limits with the code below: Maximum Number ```js Number.MAX_SAFE_INTEGER; // 9007199254740991 ``` Minimum Number ```js Number.MIN_SAFE_INTEGER; // -9007199254740991 ``` --- ### BigInt Numbers greater than the maximum safe number or lesser than the minimum safe number, the *BigInt* data type can be used. It was introduced in JavaScript **ES10** (**ECMAScript 2019**). ```js const bigInt = 1234567890123456789012345678901234567890n; ``` The `BigInt` data type number can also be treated as a regular number by appending `n` to it. ```js 1n + 2n; // 3n 7n / 2n; // 3n ``` Notice BigInt `7n / 2n` equals `3n` not `3.5` because JavaScript always rounds down such BigInt data division to the nearest figure. The code snippet above can be rewritten as shown below: ```js console.log( BigInt(1) + BigInt(2) ); // 3n console.log( BigInt(7) / BigInt(2) ); // 3n ``` --- ### String A string is a text surrounded by quotation marks. The quotation marks can either be `'single quotes'`, `"double quotes"`, or `‵backticks quotes‵` ```js console.log('single quotes'); // single quotes console.log("double quotes"); // double quotes console.log(`backtick quotes`); //backtick quotes ``` For single or double quotes, we have: ```js const firstName = 'Osagie'; const lastName = 'Bello'; const fullName = 'My name is' + firstName + ' ' + lastName + '.' console.log(fullName); // My name is Osagie Bello. ``` There's practically no difference between single quotes and double-quotes. For backtick quotes, it is purposely used for **template literal**. Template literal was introduced in **ES6** (**ECMAScript 2015**). The above code snippet can be rewritten as shown below: ```js const firstName = 'Osagie'; const lastName = 'Bello'; const fullName = `My name is ${firstName} ${lastName}.` console.log(fullName); // My name is Osagie Bello. ``` The variable in between the curly braces above and below are expressions. ```js const calc = 2 + 5 * (22 / 3); console.log(`The answer is ${calc}!`); // The answer is 38.666666666666664! ``` --- [![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1613668162316/G1zfmhxQd.png)](https://www.cssigniter.com/members/aff/go/belloosagienoah) --- ### Boolean Boolean is a logical type that is either `true` or `false`. ```js const nameFieldChecked = true; const ageFieldChecked = false; ``` A Boolean value is returned during comparison: ```js const isGreater = 5 > 3; console.log(isGreater); // true ``` > The `Boolean` function can be used to check if a data is true or false ```js Boolean(""); // false Boolean("string"); // true Boolean(1); // true Boolean(0); // false Boolean(undefined); // false Boolean(NaN); // false Boolean(null); // false Boolean(502); // true ``` More of **Boolean** later. --- ### Null **Null** means nothing or empty value. It makes a type on its own and doesn't point or refer to a non-existing variable or object. ```js const age = null; ``` The code above means that age is unknown. --- ### Undefined A variable declared without assigning it to a value is created as an **undefined** value. ```js const myAge; const yourAge = undefined; console.log(myAge); // undefined console.log(yourAge); // undefined ``` --- ### Object All the data types mentioned above are all **primitive data types**. Objects are **non-primitive data** because they can hold as much primitive data type to a variable. #### List An object can be an **array**. An array is also called a *list*. The list uses zero-based indexing. ```js const randomStuff = [ 'brush', 23, null, undefined, false ]; console.log( randomStuff[2] ); ``` ![array.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1619613565411/CEk9DBhf0.png) More on **array** later. #### Object Just like a list, an object can contain as many primitive data types as possible. ```js const obj = { name: 'Bello', age: 27, hobby: 'coding' }; console.log( obj[name] ); // Bello ``` ![object](https://cdn.hashnode.com/res/hashnode/image/upload/v1619613314813/zSaL08jeR.png) The `name`, `age`, `hobby` are called the **object property names** or **object keys** while `Bello`, `27`, `coding` are called the **object property values** or simply **object values**. More on **objects** later. --- ### Symbol The *symbol* is also a primitive data type used to create unique identifiers for objects. ```js const obj = {}; const sym = Symbol(); obj[sym] = 'foo'; obj.bar = 'bar'; console.log(obj); // { bar: 'bar', [Symbol()]: 'foo' } console.log(sym in obj); // true console.log( obj[sym] ); // foo console.log( Object.keys(obj) ); // ['bar'] ``` The example above may not make sense, but more of the **symbol** later. --- ### The *typeof* Operator It is not part of the data types but returns a data type as a result. It supports two syntaxes: ``` typeof value typeof(value) ``` ```js typeof undefined; // "undefined" typeof 34; // number typeof 3n; // bigint typeof true; // boolean typeof "egg"; // string typeof Symbol("id"); // symbol typeof Math; // object typeof null; // object typeof alert; // function ``` `typeof null` as an `object` is a flaw in JavaScript. It shouldn't be an object. `typeof alert` as a `function` is convenient in practice. They are common mistakes in JavaScript. --- [![Buy me a Coffee](https://res.cloudinary.com/bizstak/image/upload/v1610317510/ko-fi-trans_fr3su4.png)](https://www.buymeacoffee.com/techstackmedia) --- ### TechStack | Bluehost - Get a website with a free domain name for 1st year and a free **SSL** certificate. - 1-click WordPress install and 24/7 support. - Starting at $3.95/month. - 30-Day Money-Back Guarantee.