Javascript Primitives

Introduction

Welcome to a brief introducton to Javascript primities. This can be a quick starting point for beginners to become familiar with some of the primitives of the language including helpful links to MDN (Mozilla Developer Network) pages

Feel free to scroll through the content or click a nav link above in the navbar to skip ahead to pertinent content!

Number

The Number primitive is used to represent numeric content in JavaScript. Unlink other languages there is really no concept of integer, float or even BigInt natively. All JavaScript numer are floating point

const sum = 42 + 10; //evaluates to 52

String

Strings are textual content, typically used for rendering out something to be read out (like this paragraph content!). String in JavaScript are immutable, meaning that when you chagne a string you create a new instance of a string

const combinedString = 'hello' + 'world'; // returns "hello world"

Array

Arrays are essentially lists of other primitives. They are used to collect similar values that can easily be iterated over to present to a user or even search through.


        const arr = ['bananas', 'apples', 'oranges'];
        

        console.log(arr[0]); //returns 'bananas'

Arrays are very handy in JavaScript and the Array prototype (basically the root array type) has a lot of helpful functions. Here are some of my favorites:

Array.map() - returns a new copy of an array with some logic applied to each value.
Array.filter() - returns an array from another array after applying some logic to each value
Array.some() - returns true for an array if any value meets the condition defined in the callback function.
Array.every() - returns true for an array given every value meets the condition defined in the callback function.

Object

Objects in JavaScript are kind of the root primitive of almost all other types (yes arrays are actually objects under the hood!). Objects can be thought of as a dictionary of keys and values that can be quickly accessed. This data type is quite ubiquitous and is easily consumed for a wide variety of purposes.


        const myObject = { name: 'John', age: 42 };
        

        console.log(myObject.name); //returns 'John'
        console.log(myObject.age); //returns 42

There are some handy functions on the object prototype i'd like to highlight as well

Object.keys() - returns an array of all the keys in an object.
Object.values() - returns an array of all the values in an object.
Object.entries() - returns an iterable where key/value pairs in object can be easily accessed

Null

The best way to describe null is definining a value to nothing on purpose. Generally in JavaScript it is used as a precursor to eventually assigning some other value. The null then can used to do logic (such as conditional rendering in frameworks such as React)

let theAnswerToLife = null
        

        if(true) 
          theAnswerToLife = 42; //assigns a value to the variable theAnswerToLife from null to 42

Undefined

Undefined can seem quite similar to null initially. But it differs in a slighly nuanced way. Undefined means the lack of definition of a value implicitely. Or in other words it's something that hasn't been defined yet, typically not even by the developer writing the code. A common example would be trying to ask for a property on an Object or an index outside the length of an array. The developer has not defined it explicitely but it is by definition undefined.


        const myObject = { name: 'John' };
        

        console.log(myObject.age); //returns undefined, implicitely not defined
        

        

        myObject.age = null;
        

        console.log(myObject.age); //returns null, we set it explicitely