Skip to content

F.prototype #231

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@

Answers:
Respostas:

1. `true`.

The assignment to `Rabbit.prototype` sets up `[[Prototype]]` for new objects, but it does not affect the existing ones.
A atribuição do `Rabbit.prototype` seta o `[[Prototype]]` para novos objetos, mas não afeta os objetos que já existem.

2. `false`.

Objects are assigned by reference. The object from `Rabbit.prototype` is not duplicated, it's still a single object referenced both by `Rabbit.prototype` and by the `[[Prototype]]` of `rabbit`.
Objetos são atrbuídos por referência. O objeto do `Rabbit.prototype` não é duplicado, ele continua sendo um único objeto refereciado por `Rabbit.prototype` e pelo `[[Prototype]]` do `rabbit`.

So when we change its content through one reference, it is visible through the other one.
Portanto, quando nós mudamos o seu conteúdo através de uma referência, ele fica visível para as outras.

3. `true`.

All `delete` operations are applied directly to the object. Here `delete rabbit.eats` tries to remove `eats` property from `rabbit`, but it doesn't have it. So the operation won't have any effect.
Todas as operações de `delete` são aplicadas diretamente ao objeto. Neste caso, `delete rabbit.eats` tenta remover a propriedade `eats` do `rabbit`, mas ele não a tem. Assim, essa operação não tem nenhum efeito.

4. `undefined`.

The property `eats` is deleted from the prototype, it doesn't exist any more.
A propriedade `eats` é deletada do protótipo, então ela realmente não existe mais.
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
importance: 5
importância: 5

---

# Changing "prototype"
# Mudando o "prototype"

In the code below we create `new Rabbit`, and then try to modify its prototype.
No código abaixo, nós criamos um `new Rabbit`, depois tentamos modificar seu protótipo.

In the start, we have this code:
No começo, nós temos esse código:

```js run
function Rabbit() {}
Expand All @@ -19,8 +19,7 @@ let rabbit = new Rabbit();
alert( rabbit.eats ); // true
```


1. We added one more string (emphasized). What will `alert` show now?
1. Nós adicionamos uma linha (realçada). O que o `alert` vai mostrar agora?

```js
function Rabbit() {}
Expand All @@ -37,7 +36,7 @@ alert( rabbit.eats ); // true
alert( rabbit.eats ); // ?
```

2. ...And if the code is like this (replaced one line)?
2. ...E se o código for assim (a linha foi substituída)?

```js
function Rabbit() {}
Expand All @@ -54,7 +53,7 @@ alert( rabbit.eats ); // true
alert( rabbit.eats ); // ?
```

3. And like this (replaced one line)?
3. E se for assim (a linha foi substituída)?

```js
function Rabbit() {}
Expand All @@ -71,7 +70,7 @@ alert( rabbit.eats ); // true
alert( rabbit.eats ); // ?
```

4. The last variant:
4. A última variação:

```js
function Rabbit() {}
Expand Down
91 changes: 46 additions & 45 deletions 1-js/08-prototypes/02-function-prototype/article.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
# F.prototype

Remember, new objects can be created with a constructor function, like `new F()`.
Lembre-se, novos objetos podem ser criados com uma função construtora, usando `new F()`.

If `F.prototype` is an object, then the `new` operator uses it to set `[[Prototype]]` for the new object.
Se `F.prototype` é um objeto, então o operador `new` usa ela para setar `[[Prototype]]` no novo objeto.

```smart
JavaScript had prototypal inheritance from the beginning. It was one of the core features of the language.
JavaScript tem herança prototipada desde o começo. Isso era uma das funcionalidades centrais da linguagem.

But in the old times, there was no direct access to it. The only thing that worked reliably was a `"prototype"` property of the constructor function, described in this chapter. So there are many scripts that still use it.
Mas antigamente não havia um acesso direto a ela. A única coisa que funcionava de forma confiável era uma propriedade `"prototype"` da função construtora, descrita nesse capítulo. Então, existem muitos scripts que ainda a utilizam.
```

Please note that `F.prototype` here means a regular property named `"prototype"` on `F`. It sounds something similar to the term "prototype", but here we really mean a regular property with this name.
Note que o `F.prototype` aqui significa uma propriedade regular de nome `"prototype"` dentro de `F`. Isso soa um pouco similar ao termo "prototype" (protótipo), mas aqui nós estamos falando realmente de uma propriedade regular com esse nome.

Here's the example:
Aqui temos um exemplo:

```js run
let animal = {
Expand All @@ -32,27 +32,27 @@ let rabbit = new Rabbit("White Rabbit"); // rabbit.__proto__ == animal
alert( rabbit.eats ); // true
```

Setting `Rabbit.prototype = animal` literally states the following: "When a `new Rabbit` is created, assign its `[[Prototype]]` to `animal`".
Setando `Rabbit.prototype = animal` literalmente significa o seguinte: "Quando o `new Rabbit` for criado, atribua seu `[[Prototype]]` para `animal`".
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Setando `Rabbit.prototype = animal` literalmente significa o seguinte: "Quando o `new Rabbit` for criado, atribua seu `[[Prototype]]` para `animal`".
Configurando `Rabbit.prototype = animal` literalmente significa o seguinte: "Quando o `new Rabbit` for criado, atribua seu `[[Prototype]]` para `animal`".


That's the resulting picture:
Essa é a imagem do resultado:

![](proto-constructor-animal-rabbit.svg)

On the picture, `"prototype"` is a horizontal arrow, meaning a regular property, and `[[Prototype]]` is vertical, meaning the inheritance of `rabbit` from `animal`.
Na imagem, `"prototype"` é a seta na horizontal, indicando uma propriedade regular, e `[[Prototype]]` está na vertical, indicando a herança de `rabbit` vinda do `animal`.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Na imagem, `"prototype"` é a seta na horizontal, indicando uma propriedade regular, e `[[Prototype]]` está na vertical, indicando a herança de `rabbit` vinda do `animal`.
Na imagem, `"prototype"` é a seta na horizontal, indicando uma propriedade regular, e `[[Prototype]]` está na vertical, indicando a herança de `rabbit` vinda de `animal`.


```smart header="`F.prototype` only used at `new F` time"
`F.prototype` property is only used when `new F` is called, it assigns `[[Prototype]]` of the new object.
```smart header="`F.prototype` é usado apenas na chamada `new F`"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
```smart header="`F.prototype` é usado apenas na chamada `new F`"
```smart header="`F.prototype` é usada apenas na chamada `new F`"

A propriedade `F.prototype` é usada apenas quando `new F` é chamado, e ela atribui um valor para o `[[Prototype]]` do novo objeto.

If, after the creation, `F.prototype` property changes (`F.prototype = <another object>`), then new objects created by `new F` will have another object as `[[Prototype]]`, but already existing objects keep the old one.
Se, depois da criação, a propriedade `F.prototype` mudar (`F.prototype = <another object>`), então novos objetos criados com `new F` vão ter outro objeto como `[[Prototype]]`, enquanto os objetos que já existirem vão manter o antigo.
```

## Default F.prototype, constructor property
## F.prototype default, propriedade do construtor
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
## F.prototype default, propriedade do construtor
## F.prototype padrão, propriedade do construtor


Every function has the `"prototype"` property even if we don't supply it.
Toda função tem a propriedade `"prototype"`, mesmo que não a use.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Toda função tem a propriedade `"prototype"`, mesmo que não a use.
Toda função tem a propriedade `"prototype"`, mesmo quando nós não a provermos.


The default `"prototype"` is an object with the only property `constructor` that points back to the function itself.
O `"prototype"` default é um objeto com apenas uma propriedade `constructor` que aponta para a própria função a que pertence.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
O `"prototype"` default é um objeto com apenas uma propriedade `constructor` que aponta para a própria função a que pertence.
O `"prototype"` padrão é um objeto com apenas uma propriedade `constructor` que aponta para a própria função a que pertence.


Like this:
Assim:

```js
function Rabbit() {}
Expand All @@ -64,33 +64,33 @@ Rabbit.prototype = { constructor: Rabbit };

![](function-prototype-constructor.svg)

We can check it:
Nós podemos conferir isso:

```js run
function Rabbit() {}
// by default:
// Por definição:
// Rabbit.prototype = { constructor: Rabbit }

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

Naturally, if we do nothing, the `constructor` property is available to all rabbits through `[[Prototype]]`:
Naturalmente, se nós não fizermos nada, a propriedade `constructor` está disponível para todos os coelhos (*rabbits*) através do `[[Prototype]]`:

```js run
function Rabbit() {}
// by default:
// Por definição:
// Rabbit.prototype = { constructor: Rabbit }

let rabbit = new Rabbit(); // inherits from {constructor: Rabbit}
let rabbit = new Rabbit(); // herda de {constructor: Rabbit}

alert(rabbit.constructor == Rabbit); // true (from prototype)
alert(rabbit.constructor == Rabbit); // true (vindo do protótipo)
```

![](rabbit-prototype-constructor.svg)

We can use `constructor` property to create a new object using the same constructor as the existing one.
Nós podemos usar a propriedade `constructor` para criar um novo objeto usando o próprio construtor de um objeto que já exista.

Like here:
Como abaixo:

```js run
function Rabbit(name) {
Expand All @@ -105,17 +105,17 @@ let rabbit2 = new rabbit.constructor("Black Rabbit");
*/!*
```

That's handy when we have an object, don't know which constructor was used for it (e.g. it comes from a 3rd party library), and we need to create another one of the same kind.
Isso é prático quando nós temos um objeto, não sabemos qual construtor foi usado para ele (de uma biblioteca de terceiros, por exemplo), e nós precisamos criar outro objeto do mesmo tipo.

But probably the most important thing about `"constructor"` is that...
Mas provavelmente a coisa mais importante sobre o `"constructor"` é que...

**...JavaScript itself does not ensure the right `"constructor"` value.**
**...O próprio JavaScript não garante qual é o valor correto do `"constructor"`.**

Yes, it exists in the default `"prototype"` for functions, but that's all. What happens with it later -- is totally on us.
Sim, existe um `"prototype"` default para funções, mas é só isso. O que acontece com ele depois -- está totalmente por nossa conta.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Sim, existe um `"prototype"` default para funções, mas é só isso. O que acontece com ele depois -- está totalmente por nossa conta.
Sim, existe um `"prototype"` padrão para funções, mas é só isso. O que acontece com ele depois -- está totalmente por nossa conta.


In particular, if we replace the default prototype as a whole, then there will be no `"constructor"` in it.
Em particular, se nós substituirmos o `prototype` default como um todo, não vai haver um `"constructor"` nele.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Em particular, se nós substituirmos o `prototype` default como um todo, não vai haver um `"constructor"` nele.
Em particular, se nós substituirmos o `prototype` padrão como um todo, não vai haver um `"constructor"` nele.


For instance:
Por exemplo:

```js run
function Rabbit() {}
Expand All @@ -129,18 +129,18 @@ alert(rabbit.constructor === Rabbit); // false
*/!*
```

So, to keep the right `"constructor"` we can choose to add/remove properties to the default `"prototype"` instead of overwriting it as a whole:
Portanto, para manter o `"constructor"` certo, nós podemos escolher adicionar/remover propriedades do `"prototype"` ao invés de sobrescrevê-lo completamente:

```js
function Rabbit() {}

// Not overwrite Rabbit.prototype totally
// just add to it
// não sobrescreva Rabbit.prototype completamente
// apenas adicione
Rabbit.prototype.jumps = true
// the default Rabbit.prototype.constructor is preserved
// o Rabbit.prototype.constructor default fica preservado
```

Or, alternatively, recreate the `constructor` property manually:
Outra alternativa é recriar a propriedade `constructor` manualmente:

```js
Rabbit.prototype = {
Expand All @@ -150,26 +150,27 @@ Rabbit.prototype = {
*/!*
};

// now constructor is also correct, because we added it
// agora o constructor também está correto, porque nós o adicionamos
```


## Summary
## Resumo

In this chapter we briefly described the way of setting a `[[Prototype]]` for objects created via a constructor function. Later we'll see more advanced programming patterns that rely on it.
Neste capítulo, nós descrevemos brevemente a forma de setar um `[[Prototype]]` para os objetos via função construtura. Mais tarde nós vamos ver padrões (*patterns*) mais avançados de programação que dependem disso.

Everything is quite simple, just a few notes to make things clear:
É tudo bem simples, mas aqui estão algumas notas para deixar as coisas claras:

- The `F.prototype` property (don't mistake it for `[[Prototype]]`) sets `[[Prototype]]` of new objects when `new F()` is called.
- The value of `F.prototype` should be either an object or `null`: other values won't work.
- The `"prototype"` property only has such a special effect when set on a constructor function, and invoked with `new`.
- A propriedade `F.prototype` (não confunda com o `[[Prototype]]`) seta o `[[Prototype]]` de novos objetos quando `new F()` é chamado.
- O valor de `F.prototype` deveria ser ou um objeto ou `null`: outros valores não vão funcionar.
- A propriedade `"prototype"` só tem o efeito especial quando setada em uma função construtora, e invocada com `new`.

Em objetos regulares, o `prototype` não tem nada de especial:

On regular objects the `prototype` is nothing special:
```js
let user = {
name: "John",
prototype: "Bla-bla" // no magic at all
prototype: "Bla-bla" // nenhuma mágica aqui
};
```

By default all functions have `F.prototype = { constructor: F }`, so we can get the constructor of an object by accessing its `"constructor"` property.
Por definição, todas as funções possuem `F.prototype = { constructor: F }`, então nós podemos obter o construtor de um objeto acessando sua propriedade `"constructor"`.