diff --git a/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/solution.md b/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/solution.md index 7d8edd7ca..59f037447 100644 --- a/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/solution.md +++ b/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/solution.md @@ -1,8 +1,8 @@ -Yes, it's possible. +Si, es posible. -If a function returns an object then `new` returns it instead of `this`. +Si una función devuelve un objeto, entonces `new` lo devuelve en vez de `this`. -So they can, for instance, return the same externally defined object `obj`: +Por lo tanto pueden, por ejemplo, devolver el mismo objeto definido externamente `obj`: ```js run no-beautify let obj = {}; diff --git a/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/task.md b/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/task.md index 8c1fea8eb..5d1ef6fff 100644 --- a/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/task.md +++ b/1-js/04-object-basics/06-constructor-new/1-two-functions-one-object/task.md @@ -2,9 +2,9 @@ importance: 2 --- -# Two functions – one object +# Dos funciones – un objeto -Is it possible to create functions `A` and `B` such as `new A()==new B()`? +Es posible crear las funciones `A` y `B` como `new A()==new B()`? ```js no-beautify function A() { ... } @@ -16,4 +16,4 @@ let b = new B; alert( a == b ); // true ``` -If it is, then provide an example of their code. +Si es posible, entonces proporcione un ejemplo de su código. diff --git a/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/_js.view/test.js b/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/_js.view/test.js index 036053927..b83a3059c 100644 --- a/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/_js.view/test.js +++ b/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/_js.view/test.js @@ -11,11 +11,11 @@ describe("calculator", function() { calculator.read(); }); - it("when 2 and 3 are entered, the sum is 5", function() { + it("cuando se ingresa 2 y 3, la suma es 5", function() { assert.equal(calculator.sum(), 5); }); - it("when 2 and 3 are entered, the product is 6", function() { + it("cuando se ingresa 2 y 3, el producto es 6", function() { assert.equal(calculator.mul(), 6); }); diff --git a/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/task.md b/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/task.md index 60e7c373e..85bd70438 100644 --- a/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/task.md +++ b/1-js/04-object-basics/06-constructor-new/2-calculator-constructor/task.md @@ -2,15 +2,15 @@ importance: 5 --- -# Create new Calculator +# Crear nueva Calculadora -Create a constructor function `Calculator` that creates objects with 3 methods: +Crear una función constructora `Calculator` que crea objetos con 3 métodos: -- `read()` asks for two values using `prompt` and remembers them in object properties. -- `sum()` returns the sum of these properties. -- `mul()` returns the multiplication product of these properties. +- `read()` pide dos valores usando `prompt` y los recuerda en las propiedades del objeto. +- `sum()` devuelve la suma de estas propiedades. +- `mul()` devuelve el producto de multiplicación de estas propiedades. -For instance: +Por ejemplo: ```js let calculator = new Calculator(); diff --git a/1-js/04-object-basics/06-constructor-new/3-accumulator/_js.view/test.js b/1-js/04-object-basics/06-constructor-new/3-accumulator/_js.view/test.js index a719cf45c..61fe29bbb 100644 --- a/1-js/04-object-basics/06-constructor-new/3-accumulator/_js.view/test.js +++ b/1-js/04-object-basics/06-constructor-new/3-accumulator/_js.view/test.js @@ -8,23 +8,23 @@ describe("Accumulator", function() { prompt.restore(); }); - it("initial value is the argument of the constructor", function() { + it("valor inicial es el argumento del constructor", function() { let accumulator = new Accumulator(1); assert.equal(accumulator.value, 1); }); - it("after reading 0, the value is 1", function() { + it("después de leer 0, el valor es 1", function() { let accumulator = new Accumulator(1); prompt.returns("0"); accumulator.read(); assert.equal(accumulator.value, 1); }); - it("after reading 1, the value is 2", function() { + it("después de leer 1, el valor es 2", function() { let accumulator = new Accumulator(1); prompt.returns("1"); accumulator.read(); assert.equal(accumulator.value, 2); }); -}); +}); \ No newline at end of file diff --git a/1-js/04-object-basics/06-constructor-new/3-accumulator/solution.md b/1-js/04-object-basics/06-constructor-new/3-accumulator/solution.md index eb145e79d..8d1dfc5ca 100644 --- a/1-js/04-object-basics/06-constructor-new/3-accumulator/solution.md +++ b/1-js/04-object-basics/06-constructor-new/3-accumulator/solution.md @@ -5,7 +5,7 @@ function Accumulator(startingValue) { this.value = startingValue; this.read = function() { - this.value += +prompt('How much to add?', 0); + this.value += +prompt('Cuánto más agregar?', 0); }; } diff --git a/1-js/04-object-basics/06-constructor-new/3-accumulator/task.md b/1-js/04-object-basics/06-constructor-new/3-accumulator/task.md index c2c44881e..6046490a3 100644 --- a/1-js/04-object-basics/06-constructor-new/3-accumulator/task.md +++ b/1-js/04-object-basics/06-constructor-new/3-accumulator/task.md @@ -2,26 +2,26 @@ importance: 5 --- -# Create new Accumulator +# Crear nuevo Acumulador -Create a constructor function `Accumulator(startingValue)`. +Crear una función contructor `Accumulator(startingValue)`. -Object that it creates should: +El objeto que crea debería: -- Store the "current value" in the property `value`. The starting value is set to the argument of the constructor `startingValue`. -- The `read()` method should use `prompt` to read a new number and add it to `value`. +- Almacene el "valor actual" en la propiedad `value`. El valor inicial se establece en el argumento del constructor `startingValue`. +- El método `read()` debe usar `prompt` para leer un nuevo número y agregarlo a `value`. -In other words, the `value` property is the sum of all user-entered values with the initial value `startingValue`. +En otras palabras, la propiedad `value` es la suma de todos los valores ingresados por el usuario con el valor inicial `startingValue`. -Here's the demo of the code: +Aquí está la demostración del código: ```js -let accumulator = new Accumulator(1); // initial value 1 +let accumulator = new Accumulator(1); // valor inicial 1 -accumulator.read(); // adds the user-entered value -accumulator.read(); // adds the user-entered value +accumulator.read(); // agrega el valor introducido por el usuario +accumulator.read(); // agrega el valor introducido por el usuario -alert(accumulator.value); // shows the sum of these values +alert(accumulator.value); // muestra la suma de estos valores ``` [demo] diff --git a/1-js/04-object-basics/06-constructor-new/article.md b/1-js/04-object-basics/06-constructor-new/article.md index a885e35ff..bf140a3b1 100644 --- a/1-js/04-object-basics/06-constructor-new/article.md +++ b/1-js/04-object-basics/06-constructor-new/article.md @@ -1,17 +1,17 @@ -# Constructor, operator "new" +# Constructor, operador "new" -The regular `{...}` syntax allows to create one object. But often we need to create many similar objects, like multiple users or menu items and so on. +El sintaxis habitual `{...}` permite crear un objeto. Pero a menudo necesitamos crear varios objetos similares, como múltiples usuarios o elementos de menú, etcétera. -That can be done using constructor functions and the `"new"` operator. +Esto se puede realizar utilizando el constructor de funciones y el operador `"new"`. -## Constructor function +## Función constructora -Constructor functions technically are regular functions. There are two conventions though: +La función constructora es técnicamente una función normal. Aunque hay dos convenciones: -1. They are named with capital letter first. -2. They should be executed only with `"new"` operator. +1. Son nombradas con la primera letra mayúscula. +2. Sólo deben ejecutarse con el operador `"new"`. -For instance: +Por ejemplo: ```js run function User(name) { @@ -27,31 +27,31 @@ alert(user.name); // Jack alert(user.isAdmin); // false ``` -When a function is executed with `new`, it does the following steps: +Cuando una función es ejecutada con `new`, realiza los siguientes pasos: -1. A new empty object is created and assigned to `this`. -2. The function body executes. Usually it modifies `this`, adds new properties to it. -3. The value of `this` is returned. +1. Se crea un nuevo objeto vacío y se asigna a `this`. +2. Se ejecuta el cuerpo de la función. Normalmente se modifica `this` y se le agrega nuevas propiedades. +3. Se devuelve el valor de `this`. -In other words, `new User(...)` does something like: +En otras palabras, `new User(...)` realiza algo como: ```js function User(name) { *!* - // this = {}; (implicitly) + // this = {}; (implícitamente) */!* - // add properties to this + // agrega propiedades a this this.name = name; this.isAdmin = false; *!* - // return this; (implicitly) + // return this; (implícitamente) */!* } ``` -So `let user = new User("Jack")` gives the same result as: +Entonces `let user = new User("Jack")` da el mismo resultado que: ```js let user = { @@ -60,148 +60,148 @@ let user = { }; ``` -Now if we want to create other users, we can call `new User("Ann")`, `new User("Alice")` and so on. Much shorter than using literals every time, and also easy to read. +Ahora si queremos crear otros usuarios, podemos llamar a `new User("Ann")`, `new User("Alice")`, etcétera. Mucho más corto que usar literales todo el tiempo y también fácil de leer. -That's the main purpose of constructors -- to implement reusable object creation code. +Este es el principal propósito del constructor -- implementar código de creación de objetos re-utilizables. -Let's note once again -- technically, any function can be used as a constructor. That is: any function can be run with `new`, and it will execute the algorithm above. The "capital letter first" is a common agreement, to make it clear that a function is to be run with `new`. +Tomemos nota otra vez -- técnicamente cualquier función puede ser utilizada como constructor. Es decir: cualquier función puede ser ejecutada con `new`, y ejecutará el algoritmo de arriba. La "primera letra mayúscula" es un acuerdo común, para dejar en claro que la función debe ser ejecutada con `new`. ````smart header="new function() { ... }" -If we have many lines of code all about creation of a single complex object, we can wrap them in constructor function, like this: +Si tenemos muchas líneas de código todas sobre la creación de un único objeto complejo, podemos agruparlas en un constructor de función, de ésta manera: ```js let user = new function() { this.name = "John"; this.isAdmin = false; - // ...other code for user creation - // maybe complex logic and statements - // local variables etc + // ...otro código para creación de usuario + // tal vez lógica compleja y sentencias + // variables locales etc }; ``` -The constructor can't be called again, because it is not saved anywhere, just created and called. So this trick aims to encapsulate the code that constructs the single object, without future reuse. +El constructor no puede ser llamado de nuevo porque no es guardado en ninguna parte, sólo es creado y llamado. Por lo tanto este truco apunta a encapsular el código que construye el objeto individual, sin reutilización futura. ```` -## Constructor mode test: new.target +## Constructor modo test: new.target -```smart header="Advanced stuff" -The syntax from this section is rarely used, skip it unless you want to know everything. +```smart header="Temas avanzados" +La sintaxis a partir de esta sección es raramente utilizada, puedes omitirla a menos que quieras saber todo. ``` -Inside a function, we can check whether it was called with `new` or without it, using a special `new.target` property. +Dentro de una función, podemos verificar si ha sido llamada con o sin el `new`, utilizando una propiedad especial `new.target`. -It is empty for regular calls and equals the function if called with `new`: +Está vacía para llamadas normales y es equivalente a la función si es llamada con `new`: ```js run function User() { alert(new.target); } -// without "new": +// sin "new": *!* User(); // undefined */!* -// with "new": +// con "new": *!* new User(); // function User { ... } */!* ``` -That can be used inside the function to know whether it was called with `new`, "in constructor mode", or without it, "in regular mode". +Esto puede ser utilizado dentro de la función para conocer si ha sido llamada con `new`, "en modo constructor ", o sin él, "en modo regular". -We can also make both `new` and regular calls to do the same, like this: +También podemos realizar ambas llamadas `new` y regular para que realicen lo mismo, de esta manera: ```js run function User(name) { - if (!new.target) { // if you run me without new - return new User(name); // ...I will add new for you + if (!new.target) { // si me ejecutas sin new + return new User(name); // ...Agregaré new por ti } this.name = name; } -let john = User("John"); // redirects call to new User +let john = User("John"); // redirige llamado a new User alert(john.name); // John ``` -This approach is sometimes used in libraries to make the syntax more flexible. So that people may call the function with or without `new`, and it still works. +Este enfoque es utilizado aveces en las librerías para hacer el sintaxis más flexible. Para que la gente pueda llamar a la función con o sin `new`, y aun funciona. -Probably not a good thing to use everywhere though, because omitting `new` makes it a bit less obvious what's going on. With `new` we all know that the new object is being created. +Sin embargo, probablemente no sea algo bueno para usar en todas partes, porque omitir `new` hace que sea un poco menos obvio lo que está sucediendo. Con `new` todos sabemos que se está creando el nuevo objeto. -## Return from constructors +## Return desde constructores -Usually, constructors do not have a `return` statement. Their task is to write all necessary stuff into `this`, and it automatically becomes the result. +Normalmente, los constructores no tienen una sentencia `return`. Su tarea es escribir todo lo necesario al `this`, y automáticamente se convierte en el resultado. -But if there is a `return` statement, then the rule is simple: +Pero si hay una sentencia `return`, entonces la regla es simple: -- If `return` is called with an object, then the object is returned instead of `this`. -- If `return` is called with a primitive, it's ignored. +- Si `return` es llamado con un objeto, entonces se devuelve el objeto en vez de `this`. +- Si `return` es llamado con un tipo de dato primitivo, es ignorado. -In other words, `return` with an object returns that object, in all other cases `this` is returned. +En otras palabras, `return` con un objeto devuelve ese objeto, en todos los demás casos se devuelve `this`. -For instance, here `return` overrides `this` by returning an object: +Por ejemplo, aquí `return` anula `this` al devolver un objeto: ```js run function BigUser() { this.name = "John"; - return { name: "Godzilla" }; // <-- returns this object + return { name: "Godzilla" }; // <-- devuelve este objeto } -alert( new BigUser().name ); // Godzilla, got that object +alert( new BigUser().name ); // Godzilla, recibió ese objeto ``` -And here's an example with an empty `return` (or we could place a primitive after it, doesn't matter): +Y aquí un ejemplo con un `return` vacío (o podemos colocar un primitivo después de él, no importa): ```js run function SmallUser() { this.name = "John"; - return; // <-- returns this + return; // <-- devuelve this } alert( new SmallUser().name ); // John ``` -Usually constructors don't have a `return` statement. Here we mention the special behavior with returning objects mainly for the sake of completeness. +Normalmente los constructores no tienen una sentencia `return`. Aquí mencionamos el comportamiento especial con devolución de objetos principalmente por el bien de la integridad. -````smart header="Omitting parentheses" -By the way, we can omit parentheses after `new`, if it has no arguments: +````smart header="Omitir paréntesis" +Por cierto, podemos omitir paréntesis después de `new`, si no tiene argumentos: ```js -let user = new User; // <-- no parentheses -// same as +let user = new User; // <-- sin paréntesis +// lo mismo que let user = new User(); ``` -Omitting parentheses here is not considered a "good style", but the syntax is permitted by specification. +Omitir paréntesis aquí no se considera "buen estilo", pero el sintaxis es permitido por especificación. ```` -## Methods in constructor +## Métodos en constructor -Using constructor functions to create objects gives a great deal of flexibility. The constructor function may have parameters that define how to construct the object, and what to put in it. +Utilizar constructor de funciones para crear objetos nos da mucha flexibilidad. La función constructor puede tener argumentos que definan cómo construir el objeto y qué colocar dentro. -Of course, we can add to `this` not only properties, but methods as well. +Por supuesto podemos agregar a `this` no sólo propiedades, sino también métodos. -For instance, `new User(name)` below creates an object with the given `name` and the method `sayHi`: +Por ejemplo, `new User(name)` de abajo, crea un objeto con el `name` dado y el método `sayHi`: ```js run function User(name) { this.name = name; this.sayHi = function() { - alert( "My name is: " + this.name ); + alert( "Mi nombre es: " + this.name ); }; } *!* let john = new User("John"); -john.sayHi(); // My name is: John +john.sayHi(); // Mi nombre es: John */!* /* @@ -212,19 +212,19 @@ john = { */ ``` -To create complex objects, there's a more advanced syntax, [classes](info:classes), that we'll cover later. +Para crear objetos complejos, existe una sintaxis más compleja, [classes](info:classes), que cubriremos más adelante. -## Summary +## Resumen -- Constructor functions or, briefly, constructors, are regular functions, but there's a common agreement to name them with capital letter first. -- Constructor functions should only be called using `new`. Such a call implies a creation of empty `this` at the start and returning the populated one at the end. +- Las funciones Constructoras o, más corto, constructores, son funciones normales, pero existe un común acuerdo para nombrarlas con la primera letra en mayúscula. +- Las funciones Constructoras sólo deben ser llamadas utilizando `new`. Tal llamado implica la creación de un `this` vacío al comienzo y devolver el `this` rellenado al final. -We can use constructor functions to make multiple similar objects. +Podemos utilizar funciones constructoras para crear múltiples objetos similares. -JavaScript provides constructor functions for many built-in language objects: like `Date` for dates, `Set` for sets and others that we plan to study. +JavaScript proporciona funciones constructoras para varios objetos de lenguaje incorporados: como `Date` para fechas, `Set` para sets (conjuntos) y otros que planeamos estudiar. -```smart header="Objects, we'll be back!" -In this chapter we only cover the basics about objects and constructors. They are essential for learning more about data types and functions in the next chapters. +```smart header="Objetos, volveremos!" +En este capítulo solo cubrimos los conceptos básicos sobre objetos y constructores. Son esenciales para aprender más sobre tipos de datos y funciones en los próximos capítulos. -After we learn that, we return to objects and cover them in-depth in the chapters and . +Después de aprender eso, volvemos a los objetos y los cubrimos en profundidad en los capítulos y . ```