JavaScript property vs variable

Table of Contents

Variable

A variable in JavaScript is a named storage location that holds a value. Variables are declared using keywords like var, let, or const. They exist within a specific scope (global, function, or block) and are independent of any particular object unless explicitly assigned as a property.

let myVariable = "Hello"; // myVariable is a variable

Property

A property is a key-value pair associated with an object. Objects in JavaScript are collections of properties, where each property has a name (key) and a value. Properties can hold primitive values, other objects, or even functions (which are then referred to as methods).

let myObject = {
  name: "Alice", // name is a property of myObject
  age: 30        // age is also a property of myObject
};

Key Differences

Association

Variables exist independently within a scope, while properties are inherently linked to an object.

Access

Variables are accessed directly by their name within their scope. Properties are accessed using dot notation ( object.propertyName ) or bracket notation ( object[‘propertyName’] ) on the object they belong to.

Scope vs. Object

Variables are governed by lexical scope rules, determining where they can be accessed. Properties are part of an object’s structure and are accessed via that object.

In essence, while both store data, the key differentiator is that properties are members of an object, whereas variables are independent identifiers within a scope