proto VS. prototype w JavaScript

prototype jest właściwością obiektu funkcji. Jest to prototyp obiektów zbudowanych przez tę funkcję.

__proto__ jest wewnętrzną własnością obiektu, wskazującą na jego prototyp. Obecne standardy zapewniają równoważną metodę Object.getPrototypeOf(O), choć de facto standard {[2] } jest szybszy.

Możesz znaleźć instanceof relacje porównując prototype funkcji do __proto__ łańcucha obiektu, i możesz je złamać zmieniając prototype.

function Point(x, y) {
    this.x = x;
    this.y = y;
}

var myPoint = new Point();

// the following are all true
myPoint.__proto__ == Point.prototype
myPoint.__proto__.__proto__ == Object.prototype
myPoint instanceof Point;
myPoint instanceof Object;

Tutaj Point jest funkcja konstruktora, buduje obiekt (strukturę danych). myPoint jest obiektem zbudowanym przez Point(), więc Point.prototype zostaje zapisany do myPoint.__proto__ w tym czasie.

Właściwość Prototype jest tworzona po zadeklarowaniu funkcji.

Na przykład:

 function Person(dob){
    this.dob = dob
 }; 

Osoba.właściwość prototype jest tworzona wewnętrznie po zadeklarowaniu powyższej funkcji. Wiele właściwości można dodać do osoby.prototypy, które są współdzielone przez instancje Person utworzone za pomocą metody new Person ().

// adds a new method age to the Person.prototype Object.
Person.prototype.age = function(){return date-dob}; 

Warto zauważyć, że {[4] } jest domyślnie literałem Object (można go zmienić w razie potrzeby).

Każda instancja utworzona przy użyciu new Person() ma __proto__ nieruchomość, która wskazuje na osobę.prototyp. Jest to łańcuch, który jest używany do trawersowania, aby znaleźć właściwość określonego obiektu.

var person1 = new Person(somedate);
var person2 = new Person(somedate);

Tworzy 2 instancje osoby, te 2 obiekty mogą nazywać własność osoby.prototyp jako osob1.wiek, osob2.wieku.

Na powyższym zdjęciu widać, że Foo jest obiektem funkcji i dlatego ma link __proto__ do funkcji.prototyp, który z kolei jest instancją obiektu i posiada __proto__ link do obiektu.prototyp. Proto link kończy się tutaj __proto__ w obiekcie.prototyp wskazuje na null.

Każdy obiekt może mieć dostęp do wszystkich właściwości w swoim łańcuchu proto połączonych __proto__, tworząc w ten sposób podstawę dziedziczenia prototypów.

__proto__ nie jest standardowym sposobem dostępu do łańcucha prototypów, standardowym, ale podobnym podejściem jest użycie Object.getPrototypeOf (obj).

Poniższy kod dla instanceof operatora daje lepsze zrozumienie:

Obiekt instanceof Operator klasy zwraca true jeśli obiekt jest instancją klasy, dokładniej, jeśli Class.prototype znajduje się w łańcuchu proto tego obiektu, to obiekt jest instancją tej klasy.

function instanceOf(Func){
var obj = this;
while(obj !== null){
    if(Object.getPrototypeOf(obj) === Func.prototype)
        return true;
    obj = Object.getPrototypeOf(obj);
}
return false;
}

Powyższą metodę można wywołać jako: instanceOf.call(object,Class), która zwraca true, jeśli obiekt jest instancją klasy.

Miło o tym myśleć...

prototype jest używany przez funkcje constructor(). To powinno być naprawdę nazywane coś w stylu, "prototypeToInstall", ponieważ tak to jest.

I __proto__ to "zainstalowany prototyp" na obiekcie (który został utworzony/zainstalowany na obiekcie z wspomnianej funkcji constructor())

Prototype VS. _ _ proto _ _ VS. [[Prototype]]

Podczas tworzenia funkcji obiekt Właściwości o nazwie prototype jest tworzony automatycznie (sam go nie stworzyłeś) i jest dołączany do obiektu funkcji (constructor).
Uwaga: ten nowy obiekt prototyp wskazuje również na natywny obiekt JavaScript lub posiada wewnętrzne łącze prywatne do niego.

Przykład:

function Foo () {
    this.name = 'John Doe';
}

// Foo has an object property called prototype.
// prototype was created automatically when we declared the function Foo.
Foo.hasOwnProperty('prototype'); // true

// Now, we can assign properties and methods to it:
Foo.prototype.myName = function () {
    return 'My name is ' + this.name;
}

Jeśli utworzysz nowy obiekt z Foo używając słowa kluczowego new, W zasadzie tworzysz (między innymi) nowy obiekt, który ma wewnętrzny lub prywatny link do prototypu funkcji Foo, o którym rozmawialiśmy wcześniej:

var b = new Foo();

b.[[Prototype]] === Foo.prototype  // true

Mówiąc dokładniej, __proto__ jest w rzeczywistości funkcją gettera , która należą do natywnego obiektu JavaScript. Zwraca wewnętrzne-prywatne powiązanie prototypowe dowolnego this powiązania (zwraca [[Prototype]] z b):

b.__proto__ === Foo.prototype // true

Warto zauważyć, że począwszy od ECMAScript5, możesz również użyć metody getPrototypeOf, aby uzyskać wewnętrzne połączenie prywatne:

Object.getPrototypeOf(b) === b.__proto__ // true

Aby wyjaśnić stwórzmy funkcję

 function a (name) {
  this.name = name;
 }

Gdy JavaScript wykonuje ten kod, dodaje właściwość prototype do a, prototype właściwość jest obiektem o dwóch właściwościach:

1. constructor
2. __proto__

Więc kiedy to zrobimy

a.prototype zwraca

     constructor: a  // function definition
    __proto__: Object

Teraz jak widać constructor jest niczym innym jak samą funkcją a i __proto__ wskazuje na główny poziom Object JavaScript.

Zobaczmy, co się stanie, gdy użyjemy a funkcja ze słowem kluczowym new.

var b = new a ('JavaScript');

Gdy JavaScript wykonuje ten kod, robi 4 rzeczy:

1. tworzy nowy obiekt, pusty obiekt / / {}
2. tworzy __proto__ na b i wskazuje na a.prototype więc b.__proto__ === a.prototype
3. wykonuje a.prototype.constructor (która jest definicją funkcji a) z nowo utworzonym obiektem (utworzonym w kroku#1) jako jego kontekstem (this), stąd właściwość name przekazywana jako 'JavaScript' (która jest dodawana do this) jest dodawana do nowo utworzonego obiekt.
4. zwraca nowo utworzony obiekt w (utworzony w kroku#1), więc var {[16] } zostanie przypisany do nowo utworzonego obiektu.

Teraz jeśli dodamy a.prototype.car = "BMW" i zrobimy b.car, pojawia się wyjście "BMW".

Dzieje się tak dlatego, że gdy JavaScript wykonał ten kod, wyszukał car właściwość na b, nie znalazł wtedy JavaScript użytego b.__proto__ (co zostało wykonane, aby wskazać na 'a. prototype' w Kroku # 2) i znalazł car właściwość, więc zwróć "BMW".

Aby było to trochę jasne oprócz powyższych wspaniałych odpowiedzi:

function Person(name){
    this.name = name
 }; 

var eve = new Person("Eve");

eve.__proto__ == Person.prototype //true

eve.prototype  //undefined

instancje mają _ _ proto__, klasy mają prototyp .

Inny dobry sposób, aby to zrozumieć:

var foo = {}

/* 
foo.constructor is Object, so foo.constructor.prototype is actually 
Object.prototype; Object.prototype in return is what foo.__proto__ links to. 
*/
console.log(foo.constructor.prototype === foo.__proto__);
// this proves what the above comment proclaims: Both statements evaluate to true.
console.log(foo.__proto__ === Object.prototype);
console.log(foo.constructor.prototype === Object.prototype);

Tylko po IE11 __proto__ jest obsługiwana. Przed tą wersją, taką jak IE9, możesz użyć constructor, aby uzyskać __proto__.

Tak się składa, że uczę się prototypu z nie znasz JS: this & object prototypy, która jest wspaniałą książką, aby zrozumieć projekt pod spodem i wyjaśnić tak wiele błędnych przekonań (dlatego staram się unikać używania dziedziczenia i rzeczy takich jak instanceof).

Co to jest prototyp?

Obiekty w JavaScript mają wewnętrzną właściwość, oznaczoną w specyfikacji jako [[Prototype]], która jest po prostu odniesieniem do innego obiektu. Prawie wszystkie obiekty otrzymują wartość nienull dla tej właściwości, w momencie ich tworzenia.

Jak zdobyć prototyp obiektu?

Przez __proto__ lub Object.getPrototypeOf

var a = { name: "wendi" };
a.__proto__ === Object.prototype // true
Object.getPrototypeOf(a) === Object.prototype // true

function Foo() {};
var b = new Foo();
b.__proto__ === Foo.prototype
b.__proto__.__proto__ === Object.prototype

Co to jest prototype?

prototype jest obiektem automatycznie utworzonym jako specjalna właściwość funkcji , która służy do ustanowienia delegacji (dziedziczenia) chain, czyli łańcuch prototypowy.

Kiedy tworzymy funkcję a, prototype jest automatycznie tworzony jako specjalna właściwość na a i zapisuje kod funkcji na jako constructor na prototype.

function Foo() {};
Foo.prototype // Object {constructor: function}
Foo.prototype.constructor === Foo // true

Chciałbym rozważyć tę właściwość jako miejsce przechowywania właściwości (w tym metod) obiektu funkcji. To także powód, dla którego funkcje użyteczności w JS są zdefiniowane jak Array.prototype.forEach() , Function.prototype.bind(), Object.prototype.toString().

Po co podkreślać własność funkcja ?

{}.prototype // undefined;
(function(){}).prototype // Object {constructor: function}

// The example above shows object does not have the prototype property.
// But we have Object.prototype, which implies an interesting fact that
typeof Object === "function"
var obj = new Object();

Więc, Arary, Function, Objectwszystkie funkcje. Muszę przyznać, że to odświeża moje wrażenie na JS. Wiem, że funkcje są pierwszorzędnym obywatelem w JS, ale wydaje się, że jest zbudowany na funkcjach.

Jaka jest różnica między __proto__ a prototype?

__proto__odsyłacz działa na każdym obiekcie , aby odnosić się do jego właściwości [[Prototype]].

prototype jest obiektem automatycznie utworzonym jako specjalna właściwość funkcji, która służy do przechowywania właściwości (w tym metod) obiektu funkcji.

function Foo() {}
var b = new Foo();

b.__proto__ === Foo.prototype // true
Foo.__proto__ === Function.prototype // true
Function.prototype.__proto__ === Object.prototype // true

W JavaScript funkcja może być używana jako konstruktor. Oznacza to, że możemy tworzyć z nich obiekty używając słowa kluczowego new. Każda funkcja konstruktora ma wbudowany obiekt połączony z nimi łańcuchem. Ten wbudowany obiekt nazywa się prototypem. Instances of a constructor function use __proto__ to access the prototype property of its constructor function.

1. Najpierw stworzyliśmy konstruktor: function Foo(){}. Żeby było jasne, Foo to tylko kolejna funkcja. Ale możemy utworzyć z niego obiekt za pomocą nowego słowa kluczowego. Dlatego nazywamy to funkcja konstruktora

2. Każda funkcja ma unikalną właściwość, którą nazywa się właściwością prototypu. Tak więc funkcja konstruktora Foo ma właściwość prototype, która wskazuje na jej prototyp, którym jest Foo.prototype (patrz rysunek).

3. Funkcje konstruktora są same w sobie funkcją, która jest instancją konstruktora systemu zwanego konstruktorem [[Function]]. Możemy więc powiedzieć, że function Foo jest skonstruowany przez konstruktor [[Function]]. Więc, __proto__ naszego Foo function wskaże prototyp jego konstruktora, czyli Function.prototype.

4. Function.prototype samo w sobie jest niczym innym jak obiektem zbudowanym z innego konstruktora systemu o nazwie [[Object]]. Zatem [[Object]] jest konstruktorem Function.prototype. Możemy więc powiedzieć, że Function.prototype jest instancją [[Object]]. Tak więc __proto__ z Function.prototype wskazuje na Object.prototype.

5. Object.prototype to ostatni człowiek stojący w łańcuchu prototypów. Nie został zbudowany. To już jest w systemie. Więc jego __proto__ wskazuje na null.

6. Teraz przechodzimy do instancji Foo. Kiedy tworzymy instancję za pomocą new Foo(), tworzy ona nowy obiekt, który jest instancją Foo. Oznacza to, że Foo jest konstruktorem tych instancji. Tutaj utworzyliśmy dwie instancje (x i y). __proto__ z x i y wskazuje zatem na Foo.prototype.

Mówiąc prościej:

> var a = 1
undefined
> a.__proto__
[Number: 0]
> Number.prototype
[Number: 0]
> Number.prototype === a.__proto__
true

Pozwala to na dołączenie właściwości do X. prototype po utworzeniu instancji obiektów typu X i nadal będą one miały dostęp do tych nowych właściwości poprzez odniesienie _ _ proto__, którego silnik Javascript używa do poruszania się po łańcuchu prototypów.

Prototyp

Prototyp jest właściwością funkcji. Jest to schemat tworzenia obiektów za pomocą tej funkcji (konstruktora) z nowym słowem kluczowym.

_ _ proto _ _

__proto__ jest używany w łańcuchu wyszukiwania do rozwiązywania metod, właściwości. gdy obiekt jest tworzony (używając funkcji konstruktora z nowym słowem kluczowym), __proto__ jest ustawiane na funkcję (Konstruktor).prototype

function Robot(name) {
    this.name = name;
}
var robot = new Robot();

// the following are true   
robot.__proto__ == Robot.prototype
robot.__proto__.__proto__ == Object.prototype

Oto moje (wyimaginowane) Wyjaśnienie, aby usunąć zamieszanie:

Wyobraź sobie, że jest wyimaginowana Klasa (blueprint/coockie cutter) związana z funkcją. Ta wyimaginowana klasa służy do tworzenia instancji obiektów. prototype jest mechanizmem rozszerzania (metoda rozszerzania w C# lub Swift Extension) do dodawania rzeczy do tej urojonej klasy.

function Robot(name) {
    this.name = name;
}

Powyższe można sobie wyobrazić jako:

// imaginary class
class Robot extends Object{

    static prototype = Robot.class  
    // Robot.prototype is the way to add things to Robot class
    // since Robot extends Object, therefore Robot.prototype.__proto__ == Object.prototype

    var __proto__;

    var name = "";

    // constructor
    function Robot(name) {

        this.__proto__ = prototype;
        prototype = undefined;

        this.name = name;
    }

} 

var robot = new Robot();

robot.__proto__ == Robot.prototype
robot.prototype == undefined
robot.__proto__.__proto__ == Object.prototype

Teraz dodawanie metody do prototype robota:

Robot.prototype.move(x, y) = function(x, y){ Robot.position.x = x; Robot.position.y = y};
// Robot.prototype.move(x, y) ===(imagining)===> Robot.class.move(x, y)

Powyższe można sobie wyobrazić jako przedłużenie robota Klasa:

// Swift way of extention
extension Robot{
    function move(x, y){    
        Robot.position.x = x; Robot.position.y = y
    }
}

Które z kolei

// imaginary class
class Robot{

    static prototype = Robot.class // Robot.prototype way to extend Robot class
    var __proto__;

    var name = "";

    // constructor
    function Robot(name) {

        this.__proto__ = prototype;
        prototype = undefined;

        this.name = name;
    }

    // added by prototype (as like C# extension method)
    function move(x, y){ 
        Robot.position.x = x; Robot.position.y = y
    };
}

Prototyp lub obiekt.prototype jest właściwością obiektu literalnego. Reprezentuje on obiekt prototypowy obiekt, który można nadpisać, aby dodać więcej właściwości lub metod dalej w łańcuchu prototypów.

__proto _ _ jest właściwością dostępową (funkcja get I set), która eksponuje wewnętrzny prototyp obiektu, który jest dostęp.

Referencje:

1. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype

2. Http://www.w3schools.com/js/js_object_prototypes.asp

3. Https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/proto

Wiem, jestem spóźniony, ale spróbuję to uprościć.

Powiedzmy, że istnieje funkcja

    function Foo(message){

         this.message = message ; 
     };

     console.log(Foo.prototype);

Funkcja Foo będzie miała połączony prototypowy obiekt. Tak więc, kiedykolwiek tworzymy funkcję w JavaScript, zawsze ma ona prototypowy obiekt połączony z nią.

Teraz zróbmy dwa obiekty używając funkcji Foo.

    var a = new Foo("a");
    var b = new Foo("b");
    console.log(a.message);
    console.log(b.message);

1. teraz mamy dwa obiekty, obiekt a i obiekt b. oba są tworzone używanie konstruktora Foo. Pamiętaj konstruktor to tylko słowo proszę.
2. oba obiekty a i b mają kopię właściwości message.
3. te dwa obiekty a i b są połączone z prototypowym obiektem konstruktora Foo.
4. na obiektach a i b możemy uzyskać dostęp do Foo prototype używając właściwości proto we wszystkich przeglądarkach oraz w IE możemy używać obiektu.getprototype (a) lub obiekt.getPrototypeOf (b)

    b.__proto__ === Object.getPrototypeOf(a);
    a.__proto__ ===  Foo.prototype;
    a.constructor.prototype  === a.__proto__;

Wszystko powyżej wróciłoby prawda.

Jak wiemy, w JavaScript właściwości mogą być dodawane dynamicznie. Możemy dodać właściwość do obiektu

    Foo.prototype.Greet = function(){

         console.log(this.message);
    }
    a.Greet();//a
    b.Greet();//b
    a.constructor.prototype.Greet();//undefined 

Jak widzisz dodaliśmy metodę Greet () w Foo.prototyp, ale jest on dostępny w a i b lub dowolnym innym obiekcie zbudowanym za pomocą Foo.

Podczas wykonywania.Greet(), JavaScript będzie najpierw wyszukiwał Greet w obiekcie a na liście właściwości. Na nie znalezienie, pójdzie w górę w proto łańcuch a. od a. proto i Foo.prototyp jest tym samym obiektem, JavaScript znajdzie metodę Greet() i uruchomi ją.

Mam nadzieję, że teraz prototype i proto są nieco uproszczone.

Definicje

(liczba w nawiasie () jest 'linkiem' do kodu napisanego poniżej)

prototype - obiekt, który składa się z:
= > funkcje (3) tego szczególne ConstructorFunction.prototype (5), które są dostępne dla każdego obiekt (4) utworzony lub do utworzenia za pomocą tego konstruktora function (1)
=> sama funkcja konstruktora (1)
= > __proto__ tego konkretnego obiektu (prototype object)

__proto__ (dandor proto?)- łącznik (1), A właściwościami obiektu prototypowego (5) tego konstruktora, które pozwalają każdemu wytworzonemu obiektowi (2) na dostęp do funkcji i metod prototypu (4) (__proto__ jest domyślnie zawarte w każdym pojedynczym obiekcie w JS)

WYJAŚNIENIE KODU

1.

    function Person (name, age) {
        this.name = name;
        this.age = age;  

    } 

2.

    var John = new Person(‘John’, 37);
    // John is an object

3.

    Person.prototype.getOlder = function() {
        this.age++;
    }
    // getOlder is a key that has a value of the function

4.

    John.getOlder();

5.

    Person.prototype;

Spróbuję wyjaśnić w 4 klasie:

• Jestem function i buduję nowe obiekty podobne do mojego prototype

• I ' m an object and I was built using my __proto__ as an example

Dowód :

function Foo() { }

var bar = new Foo()

// `bar` is constructed from how Foo knows to construct objects
bar.__proto__ === Foo.prototype // => true

// bar is an instance - it does not know how to create objects
bar.prototype // => undefined

Każda funkcja, którą tworzysz, ma właściwość o nazwie prototype, która rozpoczyna swoje życie jako pusty obiekt. Ta właściwość jest bezużyteczna, dopóki nie użyjesz tej funkcji jako funkcji konstruktora, tzn. ze słowem kluczowym 'new'.

Jest to często mylone z __proto__ właściwością obiektu. Niektóre mogą się pomylić i z tym wyjątkiem, że właściwość prototype obiektu może sprawić, że staną się one proto obiektu. Ale tak nie jest. prototype jest używany do uzyskania __proto__ obiektu utworzonego z funkcji konstruktor.

W powyższym przykładzie:

function Person(name){
    this.name = name
}; 

var eve = new Person("Eve");

console.log(eve.__proto__ == Person.prototype) // true
// this is exactly what prototype does, made Person.prototype equal to eve.__proto__

(function(){ 
      let a = function(){console.log(this.b)};
      a.prototype.b = 1;
      a.__proto__.b = 2;
      let q = new a();
      console.log(a.b);
      console.log(q.b) 
    })()

Spróbuj zrozumieć ten kod

__proto__ jest bazą do konstruowania prototype, a funkcja konstruktora np: function human(){} mA prototype, która jest współdzielona przez __proto__ w nowej instancji funkcji konstruktora. Więcej szczegółów przeczytasz tutaj

'use strict'
function A() {}
var a = new A();
class B extends A {}
var b = new B();
console.log('====='); // =====
console.log(B.__proto__ === A); // true
console.log(B.prototype.__proto__ === A.prototype); // true
console.log(b.__proto__ === B.prototype); // true
console.log(a.__proto__ === A.prototype); // true
console.log(A.__proto__ === Function.__proto__); // true
console.log(Object.__proto__ === Function.__proto__); // true
console.log(Object.prototype === Function.__proto__.__proto__); // true
console.log(Object.prototype.__proto__ === null); // true

W JavaScript każdy obiekt (funkcja też jest obiektem!) ma właściwość __proto__, właściwość jest odniesieniem do jej prototypu.

Kiedy używamy operatora new z konstruktorem do utworzenia nowego obiektu, Właściwość __proto__ nowego obiektu zostanie ustawiona z właściwością prototype konstruktora, wtedy konstruktor zostanie wywołany przez nowy obiekt, w tym procesie" this " będzie odniesieniem do nowego obiektu w zakresie konstruktora, na koniec zwróci nowy obiekt.

Prototyp Konstruktora jest właściwością __proto__, właściwością konstruktora prototype jest praca z operatorem new.

Konstruktor musi być funkcją, ale funkcja nie zawsze jest konstruktorem, nawet jeśli ma właściwość prototype.

Prototype chain jest właściwością __proto__ obiektu, która odwołuje się do jego prototypu, i Właściwość __proto__ prototypu, która odwołuje się do prototypu i tak dalej, until to reference Object 's prototype' s __proto__ property which is reference to null.

Na przykład:

console.log(a.constructor === A); // true
// "a" don't have constructor,
// so it reference to A.prototype by its ``__proto__`` property,
// and found constructor is reference to A

[[Prototype]] i __proto__ własność to to samo.

Możemy użyć metody getPrototypeOf obiektu, aby uzyskać prototyp czegoś.

console.log(Object.getPrototypeOf(a) === a.__proto__); // true

Każda funkcja, którą napisaliśmy, może zostać użyta do utworzenia obiektu z operatorem new, więc każda z tych funkcji może być konstruktorem.

Podsumowanie:

Właściwość __proto__ obiektu jest właściwością odwzorowującą prototype funkcji konstruktora obiektu. Innymi słowy:

instance.__proto__ === constructor.prototype // true

Jest to używane do tworzenia prototype łańcucha obiektu. Łańcuch prototype jest mechanizmem wyszukiwania Właściwości obiektu. Jeśli uzyskasz dostęp do Właściwości obiektu, Javascript najpierw spojrzy na sam obiekt, jeśli właściwość nie zostanie tam znaleziona, będzie wspinać się aż do protochain, dopóki nie zostanie znaleziona (lub Nie)

Przykład:

function Person (name, city) {
  this.name = name;
}

Person.prototype.age = 25;

const willem = new Person('Willem');

console.log(willem.__proto__ === Person.prototype); // the __proto__ property on the instance refers to the prototype of the constructor

console.log(willem.age); // 25 doesn't find it at willem object but is present at prototype
console.log(willem.__proto__.age); // now we are directly accessing the prototype of the Person function 

Nasz pierwszy log wynika z true, ponieważ jak wspomniano właściwość __proto__ instancji utworzonej przez konstruktor odnosi się do właściwości prototype konstruktora. Pamiętaj w Javascript funkcje są również obiektami. Obiekty mogą mieć właściwości, a domyślną właściwością dowolnej funkcji jest właściwość o nazwie prototype.

Wtedy, gdy ta funkcja jest używana jako funkcja konstruktora, obiekt tworzy instancję formularz otrzyma właściwość o nazwie __proto__. Ta właściwość __proto__ odnosi się do właściwości prototype funkcji konstruktora (którą domyślnie posiada każda funkcja).

Dlaczego jest to przydatne?

Javascript ma mechanizm podczas wyszukiwania właściwości na Objects, który nazywa się'dziedziczenie prototypowe', oto co zasadniczo robi:

• najpierw jest sprawdzane, czy właściwość znajduje się na samym obiekcie. Jeśli tak, ta właściwość jest zwracana.
• Jeśli nieruchomość nie znajduje się na samym obiekcie, będzie "wspinać się po protochainie". Zasadniczo wygląda na obiekt, do którego odnosi się właściwość __proto__. Tam sprawdza, czy właściwość jest dostępna w obiekcie, o którym mowa przez __proto__
• jeśli właściwość nie znajduje się na __proto__ obiekcie, będzie wspinać się po łańcuchu __proto__ aż do Object obiektu.
• Jeśli nie może znaleźć właściwości nigdzie na obiekcie i jego łańcuchu prototype, zwróci undefined.

Dla przykład:

function Person (name) {
  this.name = name;
}

let mySelf = new Person('Willem');

console.log(mySelf.__proto__ === Person.prototype);

console.log(mySelf.__proto__.__proto__ === Object.prototype);

Właściwość proto jest prostą właściwością dostępową obiektu.prototyp składający się z funkcji getter i setter. Dostęp do właściwości dla proto , który ostatecznie konsultuje obiekt.prototype znajdzie tę właściwość, ale dostęp, który nie jest konsultowany z obiektem.prototyp tego nie znajdzie. Jeśli przed obiektem znajduje się jakaś inna właściwość proto .Prototype jest sprawdzany, ta właściwość ukryje tę znalezioną na obiekcie.prototyp.

Funkcja getter proto wyświetla wartość wewnętrznego [[prototyp]] obiektu. Dla obiektów utworzonych za pomocą literała obiektu, wartością tą jest Object.prototyp. Dla obiektów utworzonych za pomocą literałów tablicy wartością jest Array.prototyp. Dla funkcji wartością tą jest Function.prototyp. Dla obiektów utworzonych za pomocą new fun, gdzie fun jest jedną z wbudowanych funkcji konstruktora dostarczanych przez JavaScript (Array, Boolean, Date, Number, Object, String, i tak dalej - w tym nowych konstruktorów dodawanych w miarę rozwoju JavaScript), to wartość to zawsze zabawa.prototyp. Dla obiektów utworzonych za pomocą nowej zabawy, gdzie zabawa jest funkcją zdefiniowaną w skrypcie, wartość ta jest wartością zabawy.prototyp. (To znaczy, jeśli konstruktor nie zwrócił innego obiektu jawnie, lub zabawy.prototyp został ponownie przypisany od momentu utworzenia instancji).

Setter proto pozwala na zmutowanie [[prototyp]] obiektu. Obiekt musi być rozszerzalny w zależności od obiektu.isExtensible (): jeśli tak nie jest, wyrzucany jest TypeError. Na podana wartość musi być obiektem lub null. Podanie jakiejkolwiek innej wartości nic nie da.

Aby zrozumieć, jak prototypy są używane do dziedziczenia, zobacz artykuł Przewodnik dziedziczenie i łańcuch prototypów.

A co z użyciem __proto__ dla metod statycznych?

function Foo(name){
  this.name = name
  Foo.__proto__.collection.push(this)
  Foo.__proto__.count++

}

Foo.__proto__.count=0
Foo.__proto__.collection=[]

var bar = new Foo('bar')
var baz = new Foo('baz')

Foo.count;//2
Foo.collection // [{...}, {...}]
bar.count // undefined

Moje zrozumienie jest następujące: _ _ proto _ _ i prototype są wszystkie serwowane dla techniki łańcucha prototypów . różnica polega na tym, że funkcje nazwane z podkreśleniem (jak _ _ proto__) w ogóle nie są celem dla programistów wywoływanych jawnie. innymi słowy, są one tylko dla niektórych mechanizmów, takich jak dziedziczenie itp. są "back-end". ale funkcje nazwane bez podkreślenia są przeznaczone do jawnego wywoływania, są 'front-end'.

!!!TO NAJLEPSZE WYJAŚNIENIE NA ŚWIECIE!!!!!

var q = {}
var prototype = {prop: 11}

q.prop // undefined
q.__proto__ = prototype
q.prop // 11

W konstruktorach funkcji silnik javascript wywołuje to q.__proto__ = prototype automatycznie po zapisaniu new Class, a w __proto__ zestaw prop Class.prototype

function Class(){}
Class.prototype = {prop: 999} // set prototype as we need, before call new

var q = new Class() // q.__proto__ = Class.prototype
q.prop // 999

Enjoy %)