What is the difference between an object's `__proto__` and a constructor function's `prototype` property and [[Prototype]]?

Question

Accepted Answer

The `prototype` property is used in constructor functions to define the prototype that will be used for objects created by that constructor. The **prototype** is an object that serves as a template for other objects. In JavaScript, every object has a prototype, and you can think of it as a set of properties and methods that can be inherited by other objects. You can define a prototype explicitly using the Object.create() method or implicitly by creating objects using a constructor function. function Person(name) {
    this.name = name;
}

Person.prototype.sayHello = function () {
    console.log(`Hello, my name is ${this.name}`);
};

const person1 = new Person("Alice");
const person2 = new Person("Bob");

person1.sayHello(); // "Hello, my name is Alice"
person2.sayHello(); // "Hello, my name is Bob"
 Pronounced dunder proto, The `__proto__` property is a reference to the prototype of an object, it exposes the [[Prototype]]. If used as a getter, returns the object's [[Prototype]].  While it provides a convenient way to work with prototypes, it's not part of the official ECMAScript specification and is considered non-standard, although widely supported in practice.It's important to note that its usage is discouraged in favour of more standardized methods like `Object.getPrototypeOf()` and `Object.setPrototypeOf()`. It is a deprecated property __proto__` is an accessor property (getter/setter) available on object instances in some JavaScript environments (such as browsers). The __proto__ setter allows the [[Prototype]] of an object to be mutated. The value provided must be an object or null. Providing any other value will do nothing. It allows you to get and set the prototype of an object directly using dot notation.  A property definition of the form __proto__: value or __proto__: value does not create a property with the name __proto__. Instead, if the provided value is an object or null, it points the [[Prototype]] of the created object to that value. (If the value is not an object or null, the object is not changed.) Only a single prototype setter is permitted in an object literal. Multiple prototype setters are a syntax error. Property definitions that do not use colon notation are not prototype setters. They are property definitions that behave identically to similar definitions using any other name. const __proto__ = "variable";
const obj1 = { __proto__ };
console.log(Object.getPrototypeOf(obj1) === Object.prototype); // true
 [[Prototype]]` is an internal property of an object in JavaScript. It is not directly accessible in code, and you typically interact with it indirectly using methods like **`Object.getPrototypeOf(obj)`** or by setting an object's prototype when creating it. It represents the prototype of the object, which is used for property and method inheritance in the prototype chain. Modifying `[[Prototype]]` directly is not recommended, and it's generally better to use other methods and patterns for working with prototypes. const obj1 = { foo: 1 };
const obj2 = { bar: 2 };

// Setting the prototype of obj1 to obj2 using __proto__
obj1.__proto__ = obj2;

console.log(obj1.foo); // 1 (property directly on obj1)
console.log(obj1.bar); // 2 (inherited from obj2)

// Using Object.getPrototypeOf to achieve the same result in a more standard way
const obj3 = { foo: 1 };
const obj4 = { bar: 2 };

Object.setPrototypeOf(obj3, obj4);

console.log(obj3.foo); // 1 (property directly on obj3)
console.log(obj3.bar); // 2 (inherited from obj4)

What is the difference between an object's `proto` and a constructor function's `prototype` property and [[Prototype]]?

It's recommended to use standard methods like `Object.getPrototypeOf()` and `Object.setPrototypeOf()` for working with prototypes in modern JavaScript.

What is the difference between an object's `proto` and a constructor function's `prototype` property and [[Prototype]]?

It's recommended to use standard methods like `Object.getPrototypeOf()` and `Object.setPrototypeOf()` for working with prototypes in modern JavaScript.

Scenario Questions

Follow-up Questions

What is the difference between an object's `__proto__` and a constructor function's `prototype` property and [[Prototype]]?

It's recommended to use standard methods like Object.getPrototypeOf() and Object.setPrototypeOf() for working with prototypes in modern JavaScript.

What is the difference between an object's `__proto__` and a constructor function's `prototype` property and [[Prototype]]?

It's recommended to use standard methods like Object.getPrototypeOf() and Object.setPrototypeOf() for working with prototypes in modern JavaScript.

Scenario Questions

Follow-up Questions

What is the difference between an object's `proto` and a constructor function's `prototype` property and [[Prototype]]?

It's recommended to use standard methods like `Object.getPrototypeOf()` and `Object.setPrototypeOf()` for working with prototypes in modern JavaScript.

What is the difference between an object's `proto` and a constructor function's `prototype` property and [[Prototype]]?

It's recommended to use standard methods like `Object.getPrototypeOf()` and `Object.setPrototypeOf()` for working with prototypes in modern JavaScript.