Viewing: ar.javascript.info

( new F() ).

F.prototype new [[Prototype]] .

. "prototype" . .

F.prototype "prototype" F. .

          let animal = {
  eats: true
};

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

Rabbit.prototype = animal; // 

let rabbit = new Rabbit("White Rabbit"); //  rabbit.__proto__ == animal

alert( rabbit.eats ); // true
        

Rabbit.prototype = animal : new Rabbit [[Prototype]] animal.

[proto-constructor-animal-rabbit.png]

"prototype" ( ) [[Prototype]] ( rabbit animal).

F.prototype new F [[Prototype]]. F.prototype (F.prototype = <another object>) [[Prototype]] ( ) .

prototype

"prototype" .

          function Rabbit() {}

/*  prototype
Rabbit.prototype = { constructor: Rabbit };
*/
        

[function-prototype-constructor.png]

          function Rabbit() {}
// :
// Rabbit.prototype = { constructor: Rabbit }

alert( Rabbit.prototype.constructor == Rabbit ); // true
        

constructor rabbit [[Prototype]]:

          function Rabbit() {}
// :
// Rabbit.prototype = { constructor: Rabbit }

let rabbit = new Rabbit(); //   {constructor: Rabbit}

alert(rabbit.constructor == Rabbit); //  true  prototype
        

[rabbit-prototype-constructor.png]

constructor .

          function Rabbit(name) {
  this.name = name;
  alert(name);
}

let rabbit = new Rabbit("White Rabbit");

// 
let rabbit2 = new rabbit.constructor("Black Rabbit");
        

( ) .

"constructor" "constructor".

"prototype" . .

prototype "constructor".

          function Rabbit() {}
Rabbit.prototype = {
  jumps: true
};

let rabbit = new Rabbit();
// 
alert(rabbit.constructor === Rabbit); // false
        

"constructor" "prototype" . :

          function Rabbit() {}

//     Rabbit.prototype
//    
Rabbit.prototype.jumps = true
//    Rabbit.prototype.constructor  
        

( ) constructor :

          Rabbit.prototype = {
  jumps: true,
  constructor: Rabbit // 
};

//        
        

[[Prototype]] . .

F.prototype ( [[Prototype]]) [[Prototype]] new F().
F.prototype null .
"prototype" new.

          let user = {
  name: "John",
  prototype: "Bla-bla" //  
};
        

F.prototype = { constructor: F } "constructor" .

prototype

: 5

new Rabbit prototype .

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

alert( rabbit.eats ); // true
        

( ). alert

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

Rabbit.prototype = {}; // (*)

alert( rabbit.eats ); // ?
        

( )

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

Rabbit.prototype.eats = false; // (*)

alert( rabbit.eats ); // ?
        

( )

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

delete rabbit.eats; // (*)

alert( rabbit.eats ); // ?
        

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

delete Rabbit.prototype.eats; // (*)

alert( rabbit.eats ); // ?
        

true.

Rabbit.prototype [[Prototype]] .
false. Rabbit.prototype Rabbit.prototype Rabbit.prototype [[Prototype]] rabbit.

.
true. . delete rabbit.eats rabbit . .
undefined.

eats prototype .

: 5

obj .

let obj2 = new obj.constructor();

obj .

"constructor" .

"prototype" :

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

let user = new User('John');
let user2 = new user.constructor('Pete');

alert( user2.name ); // Pete (!)
        

User.prototype.constructor == User.

User.prototype constructor User .

          function User(name) {
  this.name = name;
}
User.prototype = {}; // (*)

let user = new User('John');
let user2 = new user.constructor('Pete');

alert( user2.name ); // undefined
        

user2.name undefined

new user.constructor('Pete'):

constructor user .
prototype prototype user User.prototype .
User.prototype {} prototype Object.prototype Object.prototype.constructor == Object .

let user2 = new Object('Pete') Object . let user2 = {} user2 .

-- F.prototype The JavaScript language

Changing "prototype"

In the code below we create new Rabbit, and then try to modify its prototype.

In the start, we have this code:

function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

alert( rabbit.eats ); // true

We added one more string (emphasized). What will alert show now?

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

Rabbit.prototype = {};

alert( rabbit.eats ); // ?
        

And if the code is like this (replaced one line)?

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

Rabbit.prototype.eats = false;

alert( rabbit.eats ); // ?
        

And like this (replaced one line)?

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

delete rabbit.eats;

alert( rabbit.eats ); // ?
        

The last variant:

          function Rabbit() {}
Rabbit.prototype = {
  eats: true
};

let rabbit = new Rabbit();

delete Rabbit.prototype.eats;

alert( rabbit.eats ); // ?
        

Answers:

true.

The assignment to Rabbit.prototype sets up [[Prototype]] for new objects, but it does not affect the existing ones.
false.

Objects are assigned by reference. The object from Rabbit.prototype is not duplicated, its still a single object referenced both by Rabbit.prototype and by the [[Prototype]] of rabbit.

So when we change its content through one reference, it is visible through the other one.
true.

All delete operations are applied directly to the object. Here delete rabbit.eats tries to remove eats property from rabbit, but it doesnt have it. So the operation wont have any effect.
undefined.

The property eats is deleted from the prototype, it doesnt exist any more.

Create an object with the same constructor

Imagine, we have an arbitrary object obj, created by a constructor function we dont know which one, but wed like to create a new object using it.

Can we do it like that?

let obj2 = new obj.constructor();

Give an example of a constructor function for obj which lets such code work right. And an example that makes it work wrong.

We can use such approach if we are sure that "constructor" property has the correct value.

For instance, if we dont touch the default "prototype", then this code works for sure:

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

let user = new User('John');
let user2 = new user.constructor('Pete');

alert( user2.name ); // Pete (worked!)

It worked, because User.prototype.constructor == User.

But if someone, so to speak, overwrites User.prototype and forgets to recreate constructor to reference User, then it would fail.

For instance:

function User(name) {
  this.name = name;
}
User.prototype = {}; // (*)

let user = new User('John');
let user2 = new user.constructor('Pete');

alert( user2.name ); // undefined

Why user2.name is undefined?

Heres how new user.constructor('Pete') works:

First, it looks for constructor in user. Nothing.
Then it follows the prototype chain. The prototype of user is User.prototype, and it also has nothing.
The value of User.prototype is a plain object {}, its prototype is Object.prototype. And there is Object.prototype.constructor == Object. So it is used.

At the end, we have let user2 = new Object('Pete'). The built-in Object constructor ignores arguments, it always creates an empty object, similar to let user2 = {}, thats what we have in user2 after all.

-2-

prototype

prototype

Changing "prototype"

Create an object with the same constructor