Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
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,81 +1,81 @@
First, let's see why the latter code doesn't work.
Primero, veamos por qué el código anterior no funciona.

The reason becomes obvious if we try to run it. An inheriting class constructor must call `super()`. Otherwise `"this"` won't be "defined".
La razón se vuelve evidente si intentamos ejecutarlo. Un constructor de clase heredado tiene que llamar a `super()`. De lo contrario `"this"` no será "definido".

So here's the fix:
Así que aquí está la solución:

```js run
class Rabbit extends Object {
constructor(name) {
*!*
super(); // need to call the parent constructor when inheriting
super(); // necesita llamar al constructor padre cuando se hereda
*/!*
this.name = name;
}
}

let rabbit = new Rabbit("Rab");

alert( rabbit.hasOwnProperty('name') ); // true
alert( rabbit.hasOwnProperty('name') ); // verdadero
```

But that's not all yet.
Pero eso no es todo.

Even after the fix, there's still important difference in `"class Rabbit extends Object"` versus `class Rabbit`.
Incluso después de arreglarlo, aún existe una diferencia importante en `"class Rabbit extends Object"` versus `class Rabbit`.

As we know, the "extends" syntax sets up two prototypes:
Como sabemos, la sintaxis "extends" configura dos prototipos:

1. Between `"prototype"` of the constructor functions (for methods).
2. Between the constructor functions themselves (for static methods).
1. Entre `"prototype"` de las funciones del constructor (para métodos).
2. Entre las propias funciones del constructor (para métodos estáticos).

In our case, for `class Rabbit extends Object` it means:
En nuestro caso, para `class Rabbit extends Object` significa:

```js run
class Rabbit extends Object {}

alert( Rabbit.prototype.__proto__ === Object.prototype ); // (1) true
alert( Rabbit.__proto__ === Object ); // (2) true
alert( Rabbit.prototype.__proto__ === Object.prototype ); // (1) verdadero
alert( Rabbit.__proto__ === Object ); // (2) verdadero
```

So `Rabbit` now provides access to static methods of `Object` via `Rabbit`, like this:
Entonces `Rabbit` ahora proporciona acceso a los métodos estáticos de `Object` a través de `Rabbit`, así:

```js run
class Rabbit extends Object {}

*!*
// normally we call Object.getOwnPropertyNames
// normalmente llamamos a Object.getOwnPropertyNames
alert ( Rabbit.getOwnPropertyNames({a: 1, b: 2})); // a,b
*/!*
```

But if we don't have `extends Object`, then `Rabbit.__proto__` is not set to `Object`.
Pero si no tenemos `extends Object`, entonces `Rabbit.__proto__` no está definido como `Object`.

Here's the demo:
Aquí está la demostración:

```js run
class Rabbit {}

alert( Rabbit.prototype.__proto__ === Object.prototype ); // (1) true
alert( Rabbit.__proto__ === Object ); // (2) false (!)
alert( Rabbit.__proto__ === Function.prototype ); // as any function by default
alert( Rabbit.prototype.__proto__ === Object.prototype ); // (1) verdadero
alert( Rabbit.__proto__ === Object ); // (2) falso (!)
alert( Rabbit.__proto__ === Function.prototype ); // como cualquier función por defecto

*!*
// error, no such function in Rabbit
// error, no existe esta función en Rabbit
alert ( Rabbit.getOwnPropertyNames({a: 1, b: 2})); // Error
*/!*
```

So `Rabbit` doesn't provide access to static methods of `Object` in that case.
Entonces `Rabbit` no proporciona acceso a métodos estáticos de `Object` en este caso.

By the way, `Function.prototype` has "generic" function methods, like `call`, `bind` etc. They are ultimately available in both cases, because for the built-in `Object` constructor, `Object.__proto__ === Function.prototype`.
Por cierto, `Function.prototype` tiene métodos de función "genéricos", como `call`, `bind` etc. Finalmente, están disponibles en ambos casos, por el `Object` que tiene el constructor incorporado `Object.__proto__ === Function.prototype`.

Here's the picture:
Aquí está la imagen:

![](rabbit-extends-object.svg)

So, to put it short, there are two differences:
Por lo tanto, en pocas palabras, existen dos diferencias:

| class Rabbit | class Rabbit extends Object |
|--------------|------------------------------|
| -- | needs to call `super()` in constructor |
| -- | necesita llamar a `super()` en el constructor |
| `Rabbit.__proto__ === Function.prototype` | `Rabbit.__proto__ === Object` |
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ importance: 3

---

# Class extends Object?
# ¿La clase extiende el objeto?

As we know, all objects normally inherit from `Object.prototype` and get access to "generic" object methods like `hasOwnProperty` etc.
Como sabemos, todos los objetos normalmente heredan de `Object.prototype` y obtienen acceso a métodos de objeto "genéricos" como `hasOwnProperty` etc.

For instance:
Por ejemplo:

```js run
class Rabbit {
Expand All @@ -18,16 +18,16 @@ class Rabbit {
let rabbit = new Rabbit("Rab");

*!*
// hasOwnProperty method is from Object.prototype
alert( rabbit.hasOwnProperty('name') ); // true
// el método hasOwnProperty proviene de Object.prototype
alert( rabbit.hasOwnProperty('name') ); // verdadero
*/!*
```

But if we spell it out explicitly like `"class Rabbit extends Object"`, then the result would be different from a simple `"class Rabbit"`?
Pero si lo escribimos explícitamente como `"class Rabbit extends Object"`, entonces ¿el resultado sería diferente de una simple `"class Rabbit"`?

What's the difference?
¿Cuál es la diferencia?

Here's an example of such code (it doesn't work -- why? fix it?):
Aquí un ejemplo de dicho código (no funciona -- ¿por qué? ¿Arréglalo?):

```js
class Rabbit extends Object {
Expand Down