Robert Hieger

Posted on May 10

Primitive and Reference Values in JavaScript

#webdev #javascript

Pexels.com: Photo by Anna Shvets

Introduction

JavaScript has two different types of data values—primitive and reference values. As is the case in any programming language, JavaScript has types to represent different kinds of data, such as integers, decimals and alphanumeric characters.

Additionally, there are more complex data structures that contain groupings of data, as is the case in objects, functions, and arrays. Both functions and arrays are special kinds of objects and may also have properties added, changed or deleted from them, as is the case for objects. These kinds of values are known as reference values.

What is the Difference Between Primitive and Reference Values?

Primitive Values

As explained by the Mozilla Developer Network (MDN), “All types except Object define immutable values represented directly at the lowest level of the language. We refer to values of these types as primitive values” (“JavaScript Data Types and Data Structures”).

Primitive values may be declared in variables, on their own, or as constituent properties of objects. What distinguishes them from reference values is that they have no properties or methods.

A primitive value may be declared within a variable as shown below:

const fullName = 'Robert Hieger';      //  string

const price = 24.95;                   //  number

const deficit = -10978234156973n;      //  bigint

cosnt isAdult = true;                  //  boolean

Primitive values may also be represented as literals and not declared as variables, as shown below:

//  Example of a string literal
console.log('I am a string!');

//  Example of a number literal
console.log(44.95);

//  Example of a bigint literal
console.log(-10978234156973n);

//  Example of a boolean literal
console.log(true);

The types demonstrated above are not all the primitive values in JavaScript, but they are the ones that are most frequently used.

Here is a complete list of the primitive values in JavaScript:

Type	Description	Example
string	The string type represents any sequence of alphanumeric data.	'This is a string value'.
number	The number type represents any number, including positive and negative numbers, and floating point values. The range of values that can be represented safely by the number type is -(2⁵³ - 1) to 2⁵³ -1.	54, -96, 34.278 and -286.432 are all examples of the number type.
bigint	The biginit type can represent numbers larger or smaller than those that fall within the range of the number type. It is important to note that bigint values cannot make use of the `Math` functions available in JavaScript.	12978342578196n and -34924534228635n are both examples of the bigint type.
boolean	The boolean type represents one of two possible logical values—`true` and `false`.	`true` and `false` are the only possible values.
null	The null type is a special case. Though it is considered a primitive value given that it is semantically a primitive value, JavaScript lists this type as an object when queried with the `typeof()` function. This is because it is a reference to a nonexistent or invalid object or address in memory.	null is the only possible value.
undefined	The undefined type represents the absence of a value in a variable or a parameter that has been given no argument. This value is assigned automatically by JavaScript and should not be declared by the developer.	undefined is the only possible value.
symbol	The symbol type is another very special case. It is created using the constructor of the Symbol object provided by JavaScript. It produces an immutable value and is used sometimes to define a key for an object property that cannot be overwritten by any other code, thus preventing identifier collisions.	`const mySymbol = Symbol('category');`

Are Objects a Data Type?

Regarding objects, JavaScript.info states that “[a]ll other types are called ‘primitive’ because their values can contain only a single thing (be it a string or a number or whatever). In contrast, objects are used to store collections of data and more complex entities” (“Data Types”).

Reference Values

By contrast to primitive values, reference values are pointers to memory addresses containing a primitive value. These occur all the time in objects.

When an object is declared and initialized, a pointer is created that references all properties and/or methods that are members of that object.

This characteristic of reference values produces very useful tools for the manipulation of data. It is also sometimes the subject of some confusion for new developers.

Here is one example:

//  Object literal for an employee

const employee = {
  lastName: 'Smith',
  firstName: 'Jane',
  jobTitle: 'Junior Front-End Developer',
  skills: [
    'HTML',
    'CSS',
    'JavaScript'
  ]
};

//  Change jobTitle
employee.jobTitle = 'Senior Front-End Developer';

//  Add an element to the skills property
employee.skills.push('tailwindcss');

//  Delete an element from the skills property
employee.skills.splice(3, 1);      //  removes 'tailwindcss'

Why is it possible to make changes to the property when it is declared using the const keyword? This is possible because employee is an object. As mentioned before, when objects are declared and initialized, a pointer is created to an address in memory. It is this memory address that is immutable, not the data to which it points. Therefore, changes can be made to the properties of the object.

Another point of confusion sometimes arises when comparing two objects whose properties are identical as follows:

const employee = {
  lastName: 'Smith',
  firstName: 'Jane',
  jobTitle: 'Junior Front-End Developer',
  skills: [
    'HTML',
    'CSS',
    'JavaScript'
  ]
};

//  Second object with identical properties
const employee2 = {
  lastName: 'Smith',
  firstName: 'Jane',
  jobTitle: 'Junior Front-End Developer',
  skills: [
    'HTML',
    'CSS',
    'JavaScript'
  ]
};

console.log(
  `employee === employee2: ${employee === employee2}`
);

//  Expected Output:
//  'employee === employee2: false'

Why does employee === employee2 evaluate to false? This happens because employee and employee2 are two different objects with two unique memory addresses. They are therefore not equal. To prove the point further, this is what happens if you compare the properties of employee and employee2:

const employee = {
  lastName: 'Smith',
  firstName: 'Jane',
  jobTitle: 'Junior Front-End Developer',
  skills: [
    'HTML',
    'CSS',
    'JavaScript'
  ]
};

//  Second object with identical properties
const employee2 = {
  lastName: 'Smith',
  firstName: 'Jane',
  jobTitle: 'Junior Front-End Developer',
  skills: [
    'HTML',
    'CSS',
    'JavaScript'
  ]
};

console.log(
  'employee.lastName === employee2.lastName: ' +
  ${employee.lastName === employee2.lastName}
);

//  Expected Output:
//  'employee.lastName === employee2.lastName: true'

Conclusion

In the above code, the console.log() statement tests whether employee and employee2 are equal and of the same data type. They are of the same type as they are both objects, but they are not equal.

The output of the above code clearly demonstrates that what is immutable in an object is the memory address of the identifier (variable name). This cannot be changed or redeclared. However, any property of the object, as one of its values, may be changed, added or deleted.

Works Cited

“JavaScript Data Types and Data Structures.” MDN Web Docs, Mozilla, 8 Jul. 2025, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Data_structures. Accessed 29 Mar. 2026.

Kantor, Ilya. “Data Types.” JavaScript.info, TechLead, LLC, 9 Jul. 2024, https://javascript.info/types. Accessed 8 April 2026.

DEV Community