2

I am a beginner in Javascript and am learning about Object Oriented and prototyping in it.

As far as I know, Object is a function and is created by Function because Object.__proto__ === Function.prototype but looking through various diagrams online, I am quite confused by fact that How Function.prototype.__proto__ === Object.prototype.

What does Function.prototype.__proto__ mean?

Isn't it something that is developed by language owners as Function is the first thing from which everything arrives.

Then what does it mean? Am I lacking some important fact? I looked through other StackOverflow answers but can't find anything related to it.

Moshe Slavin
  • 5,127
  • 5
  • 23
  • 38
SEN
  • 23
  • 3
  • 1
    It could be useful: https://medium.com/javascript-scene/master-the-javascript-interview-what-s-the-difference-between-class-prototypal-inheritance-e4cd0a7562e9 – SylvainF Mar 05 '19 at 11:27
  • 1
    Possible duplicate of [How does \_\_proto\_\_ differ from constructor.prototype?](https://stackoverflow.com/questions/650764/how-does-proto-differ-from-constructor-prototype) – Ben Fortune Mar 05 '19 at 11:29
  • 1
    __proto__ always refers to the supertype of the object so in our case if it is suffixed to Function.prototype will be similar to Object.prototype because Object being the supertype of function – arpit sharma Mar 05 '19 at 11:30
  • 1
    @BenFortune please understand my question. My doubt arised by looking diagram of question that you have posted. How is it duplicate of it? – SEN Mar 05 '19 at 11:32
  • 1
    `__proto__` is a deprecated way to access object prototype (not prototype property but internal `[[Prototype]]` slot). Modern way would be `Reflect.getPropotypeOf`. `Function.prototype` is instance of `Object` and inherits from `Object.prototype`. So everything you add `Object.prototype.test = 'test'; console.log((function(){}).test)` would be inherited. – Yury Tarabanko Mar 05 '19 at 11:35
  • 1
    Thank you @YuryTarabanko. If Function.prototype is instance of Object then why Object.__proto__ === Function.prototype. It means that Object is instance of Function? – SEN Mar 05 '19 at 11:39
  • 1
    @SEN Have you noticed that Function.__proto__ === Object.__proto__ is also true. – RK_15 Mar 05 '19 at 11:41
  • 1
    Yes `Object` is a function. Notice capital letter. `typeof Object === 'function'`. Everything you add to `Function.prototype` would be inherited by every function. `Function.prototype.test = 'test'; console.log(Object.test)` – Yury Tarabanko Mar 05 '19 at 11:41
  • 1
    @YuryTarabanko Object is instance of Function and Function.prototype is instance of Object. Isn't it creating cycle(depend on each other)? Who came early? – SEN Mar 05 '19 at 11:45
  • 1
    @RK_15 yes. I have noticed. Does that mean that they have some other common parent? – SEN Mar 05 '19 at 11:46

2 Answers2

1

myFunc.prototype is the __proto__ of any object constructed by calling new myFunc().

Thinking in terms of classical (Java- or C++-style) OO, you could say that myFunc is a constructor and (therefore) myFunc.prototype is the class. In that sense, myFunc.prototype.__proto__ is the superclass; that is, the prototype of the prototype of all objects created with new myFunc.

One useful thing you can do to myFunc.prototype.__proto__ is assign to it to create a superclass relationship, e.g.

myFunc.prototype.__proto__ = mySuperclassConstructor.prototype

This idiom sheds light on why Function.prototype.__proto__ === Object.prototype holds (the core of your question): it simply means that Function is a subclass of Object — Or in other words, JavaScript runtimes do something equivalent to the above code snippet in their prelude so as to make Function a subclass of Object (as they should, per ECMA-262 §§ 19.2.2 and 19.2.3)

Careful though, while __proto__ happens to work on all modern (2019) JavaScript implementations (node.js and browsers), its use is both non-standard and slow. Consider using “real” ES6 classes instead.

DomQ
  • 4,184
  • 38
  • 37
1

TL;DR

__proto__ is a property of an object which enables you to look up in the prototype chain. While prototype is a property of a Function which enables you to add shareable functionalities to a constructor function.

Long Answer

Understand this from an example, let's say you create a constructor function.

function A() {} and then create an instance of it, var a = new A().

Then, add a function as following:

A.prototype.getA = function () { return 'A'; }.

Now, if you try to access a.getA(), you'll get the result, i.e. getA will be executed.

But how does it know about the function getA even though getA has been added after the instance a was created. It's because of using __proto__, you can traverse up in the chain (you must have heard about prototype chaining).

Technically, __proto__ is a property of an object, while prototype is a property of function. But how could functions have property? Because everything in JavaScript is converted implicitly to an object. Ever wondered how could you something like this: 'test'.toUpperCase()? Isn't string literals are 'not object' and they are primitives?

Read this for reference: http://jayendra.co.in/objects-in-javascript/

Now to answer your question:

What does Function.prototype.__proto__ mean?

You are trying to access the prototype property of Function constructor function. Remember, prototype itself is an object, so you can access properties like constructor and __proto__.

Function.prototype.__proto__ === Object.prototype

To enable chaining, when you access __proto__ property, you are looking up!

Any function can access all the properties of an object. How?

A property of Object, let's say toString. You can do, A.toString() // A created at the start. But we never created a function toString for A constructor function!

Jayendra Sharan
  • 1,043
  • 6
  • 10