DEV Community

Cover image for Lets get this data!: Looking into JavaScript data types
Alex Beasley
Alex Beasley

Posted on

Lets get this data!: Looking into JavaScript data types

What's a ghost's favorite data type? BOOlean!

Ghost

Data types are a key concept in all programming languages but today we will examine some important JavaScript data types.

  • Number

The number data type represents integers or floating point numbers formatted to use a double-precision 64-bit binary format IEEE 754 value.

Double-precision floating-point format is a floating-point number format, usually occupying 64 bits in computer memory; it represents a wide dynamic range of numeric values by using a floating radix point.


let age = 37; 
console.log(typeof age); => number
Enter fullscreen mode Exit fullscreen mode

Fred counting

  • String

The string data type represents a series of characters within a single ('') or double ("") quotation marks. Strings can be created as primitive values or objects using the new String() constructor.

let str = "Hello World!";
console.log(typeof str); => string

let num = 4;
console.log(typeof num); => number
num = String(num);
console.log(typeof num); => string
num = new String(num);
console.log(typeof num); => object

//Be careful not to use single ('') quotes when you 
//are including an apostrophe in your string 

let strApo = 'This can't work'; => SyntaxError: Unexpected identifier

let strApo = "This will fix the problem's";

Enter fullscreen mode Exit fullscreen mode

string

  • Boolean

The Boolean data type can represent two values: true or false. This is the basis for all JavaScript comparison operations and conditional test.

let booVal = true;
console.log(typeof booVal); => boolean

let numOne = 4;
let numTwo = 6;

let greatThan = numOne > numTwo;
console.log(greatThan); => false

let val = true;

if(val){
console.log("this is true");
} else {
console.log("this is false");
}; => "this is true"
Enter fullscreen mode Exit fullscreen mode

true

  • Array

The Array data type is used to store multiple data values within a single variable which can be accessed from an index starting at 0 and separated by square brackets []. They can hold different data types including functions.

          [0]    [1]     [2]         [3]                       [4]
let arr = [14 , "hello", true, function(a , b) { return a * b}, [3 , 4]];

//when type of is ran arrays will always show up as objects
console.log(typeof arr); => object

console.log(arr[0]); => 14

console.log(arr[3](3, 4)); => 12

console.log(arr[4][0]); => 3


Enter fullscreen mode Exit fullscreen mode

array

  • Object

The Object data type represents a collection of key-value pairs with curly brackets {}, where each key has an identifier and corresponding value of any data type.

let obj = {
  firstName: 'Alex',
  lastName: 'Beasley',
  inSchool: true,
  fullName: function(){
    return this.firstName + " " + this.lastName;
  }
};

console.log(typeof obj); => object

console.log(obj.fullName()); => Alex Beasley

console.log(obj.inSchool); => true

console.log(obj['firstName']); => Alex

Enter fullscreen mode Exit fullscreen mode
  • Undefined, null and NaN

Undefined is a data type which is a variable that has been declared but has not been assigned a specific value yet. It can also represent a function return that doesn't actually return anything. Null is the intentional absence of any object value. NaN (Not a Number) is a value that is considered not a valid number.

let testVar; 
console.log(testVar); => undefined
console.log(typeof testVar); => undefined

function find(array, value){
 for(let i = 0; i < array.length; i++){
    if(array[i] === value){
      return array[i];
    }
  }
return null; // if value is not found return null
}

let array = [1, 2, 3, 4]
console.log(find(array, 5)); => null

let result = 10 / 'Alex';
console.log(result); => NaN

Enter fullscreen mode Exit fullscreen mode

Corgi

Date types, whether privative or complex, help software devs store different kinds of information. By understanding and using JavaScripts built in data types, it will make our lives as developers much easier.

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

SurveyJS custom survey software

JavaScript Form Builder UI Component

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

Learn more

Best practices for optimal infrastructure performance with Magento

Running a Magento store? Struggling with performance bottlenecks? Join us and get actionable insights and real-world strategies to keep your store fast and reliable.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️