texto - Javascript agrega método para objetar

modificar un label con javascript

Question

Supongamos que tengo un objeto Foo

¿Cómo puedo extender este objeto agregando un método bar() y también asegurar que las futuras instancias de Foo tengan este método?

Answer 1

Hay muchas formas de crear objetos reutilizables como este en JavaScript. Mozilla tiene una buena presentación aquí:

• https://developer.mozilla.org/en-US/docs/JavaScript/Introduction_to_Object-Oriented_JavaScript

Lo siguiente funcionará en tu ejemplo:

function Foo(){
    this.bar = function (){
        alert("Hello World!");
    }
}

myFoo = new Foo();
myFoo.bar(); // Hello World​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

Answer 2

Puedes hacer de la barra una función que lo convierte en un método.

Foo.bar = function(passvariable){  };

Como propiedad, solo se le asignaría una cadena, tipo de datos o booleano

Foo.bar = "a place";

Answer 3

Todo esto depende de cómo está creando Foo y cómo piensa usar .bar() .

Primero, ¿estás usando una función constructora para tu objeto?

var myFoo = new Foo();

Si es así, entonces puede ampliar la propiedad del prototype la función Foo con .bar , así:

function Foo () { /*...*/ }
Foo.prototype.bar = function () { /*...*/ };

var myFoo = new Foo();
myFoo.bar();

De esta forma, cada instancia de Foo ahora tiene acceso a la MISMA instancia de .bar .
A saber: .bar tendrá acceso COMPLETO a this , pero no tendrá absolutamente ningún acceso a las variables dentro de la función de constructor:

function Foo () { var secret = 38; this.name = "Bob"; }
Foo.prototype.bar = function () { console.log(secret); };
Foo.prototype.otherFunc = function () { console.log(this.name); };

var myFoo = new Foo();
myFoo.otherFunc(); // "Bob";
myFoo.bar(); // error -- `secret` is undefined...
             // ...or a value of `secret` in a higher/global scope

De otra manera, podría definir una función para devolver cualquier objeto (no this ), con .bar creado como una propiedad de ese objeto:

function giveMeObj () {
    var private = 42,
        privateBar = function () { console.log(private); },
        public_interface = {
            bar : privateBar
        };

    return public_interface;
}

var myObj = giveMeObj();
myObj.bar(); // 42

De esta manera, tiene una función que crea nuevos objetos.
Cada uno de esos objetos tiene una función .bar creada para ellos.
Cada función .bar tiene acceso, a través de lo que se llama cierre , a las variables "privadas" dentro de la función que devolvió su objeto particular.
Cada .bar todavía tiene acceso a this también, como this , cuando llamas a la función como myObj.bar(); siempre se referirá a myObj ( public_interface , en mi ejemplo Foo ).

La desventaja de este formato es que si vas a crear millones de estos objetos, también hay millones de copias de .bar , que comerán en la memoria.

También podría hacer esto dentro de una función de constructor, estableciendo this.bar = function () {}; dentro del constructor - una vez más, el lado positivo sería el cierre; el acceso a las variables privadas en el constructor y la desventaja serían los mayores requisitos de memoria.

Entonces la primera pregunta es:
¿Espera que sus métodos tengan acceso para leer / modificar datos "privados", a los que no se puede acceder a través del objeto mismo (a través de this o myObj.X )?

y la segunda pregunta es: ¿Están haciendo suficiente de estos objetos para que la memoria sea una gran preocupación, si les da a cada uno su propia función personal, en lugar de darles uno para compartir?

Por ejemplo, si le .draw cada triángulo y cada textura su propia función .draw en un juego 3D de alta gama, eso podría ser exagerado, y probablemente afectaría la velocidad de fotogramas en un sistema tan delicado ...

Sin embargo, si está buscando crear 5 barras de desplazamiento por página, y desea que cada una de ellas pueda establecer su posición y realizar un seguimiento de si está siendo arrastrada, sin dejar que ninguna otra aplicación tenga acceso para leer / configurar esas mismas cosas. , entonces realmente no hay razón para temer que 5 funciones adicionales vayan a matar tu aplicación, suponiendo que ya tenga 10,000 líneas de largo (o más).

Answer 4

necesitas agregarlo al prototipo de Foo:

function Foo(){}
Foo.prototype.bar = function(){}
var x = new Foo()
x.bar()