Sometimes the concept of a value is obvious like when dealing with numbers or strings. It is clear that numbers, strings, booleans are data and can be used as values.

Sometimes it is not so easier to understand. For example objects, functions and classes are values in JavaScript. What does it even mean?

Storing Values

Let's try to define a value by what you can do with it.

A common scenario is to store values in variables and then retrieve and use them later.

We can store all kinds of primitives. Here are some examples.

const no = 1;
const text = '';
const isVald = true;

We may also store objects.

const obj = { value: 1 };

Till now everything was clear, but we can also store functions in variables.

const sum = function(a, b) { return a + b };

Below is a function created using the arrow syntax and saved in a variable.

const sum = (a, b) => a + b;

Not only that, but we are also able to store classes.

const Todo = class {};

Once we have a class we can create another variable storing the object built from that class.

const todo = new Todo();

Types

We can detect the type of a value using the typeof operator.

typeof 1          //"number"
typeof "Hello"    //"string"
typeof true       //"boolean"
typeof null       //"object"
typeof undefined  //"undefined"

As you can see typeof has a problem and returns "object" instead of "null" for the null value.

The type of function expression is of course 'function', but also the type of a class expression is 'function'.

console.log(typeof function(){});
//'function'
console.log(typeof class {});
//'function'

Arguments

Any value can be passed as an argument to a function. We can have functions receiving primitives, objects, but also other functions and classes.

Here is a function taking a number as an argument.

function sum(a, b){
  return a + b;
}
sum(1, 2);
//3

Below is a function taking a class expression as an argument.

class Todo{}
class Project{}
function createObject(Type){
  return new Type()
}
const todo = createObject(Todo);
//Todo
const project = createObject(Project);
//Project

Returning Values

Functions can return any kind of value. They may return numbers, booleans, strings but they can also return objects, functions, and classes.

Below is an example of a function returning a number.

function double(n){
  return n * 2;
}
double(3);
//6

Next is a function returning a class expression.

function createClass(...props){
  return class {
    constructor(...values) {
     props.forEach((name, index) => {
       this[name] = values[index];
      });
    }
  };
}
const Todo = createClass('name', 'done');
const todo = new Todo('A task', false);
console.log(todo);
//{done: false, name: "A task"}

Value vs Variables

Sometimes variables and values are confused one for the other.

Variables store values. Values do not store variables.

var, let, const declares the variables. The assign operator is used to put a value in that variable.

Values are not variables. Variables are not values.

Values Stored in Data Structures

Values can be stored in data structures. Objects, arrays, maps, sets are all data structures.

Maybe the most common data structure is the plain object. Primitives can be stores in objects.

const obj = {
  number : 1
}

Objects can be store in objects.

const rating = {
  stars : 9,
  movie : { name: 'The Dark Knight' }
}

Functions can be store in objects.

const obj = {
  doSomething: function(){}
}

Classes can be stored in objects.

const obj = {
  Todo: class{}
}
const todo = new obj.Todo();
console.log(todo);
//Todo {}

Another common data structure is the array. It can be used for example to store primitives or objects.

const arr = [1,2,3]
const arr = [{value: 1}, {value: 2}];

Here is an example of an array of functions.

const sum = (x, y) => x + y;
const diff = (x, y) => x - y;
const arr = [sum, diff];

Primitives, objects, functions, and classes can be stored in data structures.

In Conclusion

Primitives, objects, functions, and classes are all values.

Values in JavaScript belong to one of the following types: number, string, boolean, symbol, null, undefined, function, and object.

Values are not variables.

Values can be stored in variables, properties, data structures. Values can be returned from functions. Values can be set as arguments to functions.

Thanks for reading.

None