variable tipos orientado objetos example es6 ejemplos clases javascript oop getter-setter

tipos - ¿La mejor manera de crear clasificadores/creadores de clases en Javascript?



javascript orientado a objetos pdf (7)

Desde C # / PHP, me gustaría tener getters / setters completos en las clases (funciones) que creo con Javascript.

Sin embargo, en gran parte del código Javascript que he encontrado, no se utilizan los captadores y los configuradores, sino variables públicas simples.

Me complació encontrar el artículo de John Resig sobre captadores y configuradores, pero algunos comentarios sobre el mismo indican que algunos navegadores "no son compatibles con captadores y definidores", lo cual me confunde ya que no son una "característica" de Javascript sino más Patrón simple que utiliza sintaxis básica de Javascript. Este artículo también se escribió en 2007, por lo que podría estar desactualizado.

¿Cuál es el estado actual de getters y setters en Javascript? ¿Están realmente "soportados" por todos los navegadores de hoy (lo que sea que eso signifique)? ¿Son un patrón de programación útil para Javascript o las clases de Javascript (son funciones) están mejor con variables públicas? ¿Hay una mejor manera de implementarlos que la siguiente?

$(document).ready(function() { var module = new Module(''idcode''); module.set_id_code(''new idcode''); module.set_title(''new title''); $(''body'').html(module.get_id_code()+'': ''+module.get_title()); }); function Module(id_code, title) { var id_code = id_code; var title = title; //id_code this.get_id_code = function() { return id_code; } this.set_id_code = function(value) { id_code = value; } //title this.get_title = function() { return title; } this.set_title = function(value) { title = value; } }


Firefox, Safari, Chrome y Opera (pero no IE) tienen el mismo mecanismo no estándar de getter y setter integrado. ECMAScript 5 incluye una sintaxis diferente que actualmente se está abriendo camino en los navegadores y se convertirá en el estándar en el futuro. IE 8 ya tiene esta característica, pero solo en nodos DOM, no en objetos JavaScript nativos normales. Así es como se ve la sintaxis:

var obj = {}; Object.defineProperty(obj, "value", { get: function () { return this.val; }, set: function(val) { this.val = val; } });


Los captadores y los definidores no son funciones, sino "patrones de diseño" (código inflado en este caso) para idiomas que no admiten la sintaxis de propiedad.

Dado que Javascript no necesita adeptos y definidores, no desea escribirlos. Use las funciones de idioma que están disponibles para usted y los idiomas que funcionan bien en un idioma no funcionan tan bien en otro.

Una de mis citas favoritas proviene de la comunidad de Python:

Todos estamos consintiendo adultos aquí

cuando se discute por qué las variables privadas y la ocultación de la información no son necesarias.

La cita se puede encontrar here .

Aprende lo que el idioma te ofrece y adopta su cultura y reglas.


Me gusta esto :

// Module var Module = function() { // prive getter/setter value var __value; // private getter/setter method var _value = function() { if(!arguments.length) return __value; else __value = arguments[0]; }; // output/public return { value: _value }; }


Qué tal si:

function Module(id_code, title) { var id_code = id_code; var title = title; var privateProps = {}; this.setProperty = function(name, value) { // here you could e.g. log something privateProps[name] = value; } this.getProperty = function(name) { return privateProps[name]; } }

Los métodos de obtención y establecimiento aquí actúan sobre un objeto privado utilizado para almacenar propiedades a las que no se puede acceder desde ningún otro método. Por lo tanto, podría, por ejemplo, implementar un establecedor (o captador) que registre o realice ajax o lo que sea, cada vez que se modifique una propiedad (uno de los propósitos de los métodos de captador / definidor).


Realmente puedes definir setters y getters en javascript y no solo imitarlos. Creo que funciona en todos los navegadores, excepto en IE8 y anteriores.

$(document).ready(function() { var module = new Module(''idcode''); module.id = ''new idcode''; module.title = ''new title''; $(''body'').html(module.id + '': '' + module.title); }); function Module(id, title) { return { id_code: id_code, _title: title, get id() { return id_code; }, set id(value) { id_code = value; }, get title() { return _title; }, set title(value) { title = value; } } };


Te estás perdiendo el punto, creo. (O tal vez a los demás respondedores les falta el punto). ECMAScript proporciona un mecanismo de obtención / establecimiento "detrás de escena", de modo que

x.foo = 3; y = x.foo;

realmente se traduce en (tipo de)

x.PutValue("foo",3); y = x.GetValue("foo");

donde PutValue y GetValue tienen nombre, no se puede acceder directamente a las funciones para los establecedores y getters para las propiedades. (Consulte la norma ECMAScript, 3ª ed. , Sección 8.7.1. Y 8.7.2) La tercera edición no parece definir explícitamente cómo los usuarios pueden configurar captadores personalizados y funciones de configuración. La implementación de JavaScript de Mozilla hizo y sigue haciendo , por ejemplo (esto es en JSDB que usa Javascript 1.8):

js>x = {counter: 0}; [object Object] js>x.__defineGetter__("foo", function() {return this.counter++; }); js>x.foo 0 js>x.foo 1 js>x.foo 2 js>x.foo 3 js>x.foo 4

La sintaxis es (o al menos ha sido hasta ahora) específica del navegador. En particular, falta Internet Explorer, al menos de acuerdo con esta pregunta SO .

La 5ª edición del estándar ECMAScript parece estandarizarse en este mecanismo. Vea esta pregunta SO sobre captadores y definidores .

Edición : Un ejemplo más práctico, tal vez, para sus propósitos:

function makePrivateObject() { var state = 0; var out = {}; out.__defineSetter__("foo", function(x) {}); // prevent foo from being assigned directly out.__defineGetter__("foo", function() { return state; }); out.count = function() { return state++; } return out; } js>x = makePrivateObject() [object Object] js>x.foo 0 js>x.foo = 33 33 js>x.foo 0 js>x.count() 0 js>x.count() 1 js>x.count() 2 js>x.foo 3


Una manera confiable y semántica que he favorecido es usar setters y getters . Por ejemplo, creé el siguiente objeto:

var myComplexObject = { changelog: {}, log: function(name, val) { console.log("set " + name + " to " + val); if (!this.changelog[name]) this.changelog[name] = []; this.changelog[name].push(val); }, set o (val) { this.log("o", val); }, get o () { console.log("You will never know the true value!"); return 42; } }

Aquí, cada vez que lee o modifica el valor de o , el comportamiento se personaliza. Tomemos, por ejemplo, la siguiente línea de código y su salida de consola:

myComplexObject.o = "oxygen";

set o to oxygen

Luego, en este ejemplo, intentar leer los resultados del valor en esto:

var read = myComplexObject.o; console.log(read);

You will never know the true value! 42

Y, en este ejemplo, cada nuevo valor que establezca se registra:

myComplexObject.o = "Oh no!"; console.log(myComplexObject.changelog.o);

set o to Oh no! ["oxygen", "Oh no!"]