Funciones y objetos de Javascript

Question

Estoy aprendiendo Javascript, he estado usando PHP durante aproximadamente 10 años, así que tengo un poco de conocimiento de Javascript, sobre todo simplemente usando jQuery y hackándolo juntos, creo que es hora de esforzarme en aprenderlo mejor así que he estado leyendo sobre eso.

A continuación se muestran mis ejemplos de definición y llamada de algunas funciones.

Método 1

function testFunction1() { 
    console.log('TestFunction1() was ran'); 
} 
testFunction1(); 

---

Método 2

var testFunction2 = function() { 
    console.log('TestFunction2() was ran'); 
} 
testFunction2(); 

---

Método 3

var TestFunction3 = { 
    flag: function() { 
     console.log('TestFunction3.flag() was ran'); 
    }, 
    unflag: function() { 
     console.log('TestFunction3.unflag() was ran'); 
    } 
}; 
TestFunction3.flag(); 
TestFunction3.unflag(); 

---

Método 4

var TestFunction4 = { 
    Like: { 
     comment: function() { 
      console.log('TestFunction4.Like.comment() was ran'); 
     }, 
     user: function() { 
      console.log('TestFunction4.Like.user() was ran'); 
     } 
    }, 
    Unlike: { 
     comment: function() { 
      console.log('TestFunction4.Unlike.comment() was ran'); 
     }, 
     user: function() { 
      console.log('TestFunction4.Unlike.user() was ran'); 
     } 
    } 
}; 
TestFunction4.Like.comment(); 
TestFunction4.Like.user(); 
TestFunction4.Unlike.comment(); 
TestFunction4.Unlike.user(); 

---

Ok, así que entender el método 1 y 2 para ser sólo una llamada a la función básica.

1)
Método 3 y 4 son donde comienzan mis preguntas, desde otro puesto y de la lectura, no se puede saber si estos todavía se consideran una función básica de los espacios de nombre aplicado, o si ésta se consideraría como objetos?

2)
que he visto donde a veces un objeto sería llamado con la palabra new sin embargo funcionando todo esto en el navegador funciona bien, así que supongo que esto no es un objeto? Si no es un objeto, ¿cómo lo convertiría en un objeto?

3)
Ejemplo 3 y 4 son prácticamente lo mismo con la excepción de que el ejemplo 4 ha funciones definidas por 1 nivel más profundo a continuación, el ejemplo 3, es allí un nombre para el ejemplo 3 y 4 o son considerados lo mismo?

4)
Por último de los 4 ejemplos, ¿se prefiere alguno de estos 4 métodos sobre el otro?

Lo siento por todas las preguntas en 1 pero todas están relacionadas y no creo que deba comenzar 4 preguntas separadas para esto.

Answer 1

3 es un objeto. Tiene propiedades de objeto, que a su vez tienen propiedades que son funciones. 4 es la misma idea, solo con menos anidamiento.

En cuanto a usar la palabra clave new, esa es solo una forma de crear objetos. Cuando se llama a una función con new, se llama invocación del constructor. Es una de las cuatro formas en que se pueden invocar las funciones. Los otros tres, para completar, son invocación de método, invocación de función y invocación de aplicación.

Si desea utilizar una función como constructor, por convención, comience con una letra mayúscula y luego llámelo con la palabra clave new. Esto crea un objeto en blanco basado en Object.prototype y lo establece igual a this. Al usar este modo de creación de objeto, agregará propiedades al objeto resultante agregándolos directamente al this, es decir, this.foo = 12

Los métodos de ese objeto se agregarían modificando el prototipo de su función.

YourConstrutor.prototype.newMethod = function() { 
    alert(this.foo); 
}; 

Tenga en cuenta que el uso de constructores viene con muchas dificultades, especialmente si se desea implementar la herencia

objetos se pueden crear más simplemente devolviéndolos a partir de una función de "regular":

function createCar() { 
    return { 
     prop1 : 12, 
     someFunc: function() { 
     alert(this.prop1); 
     } 
    } 
} 

Esto también hará fácil ocultación de la información:

function createCar() { 
    var protectedInfo = "haha I'm protected"; ///not visible outside this function 
    return { 
     prop1 : 12, 
     showProtectedData: function() { 
     alert(protectedInfo); 
     }, 
     someFunc: function() { 
     alert(this.prop1); 
     } 
    } 
} 

(puede implementar ocultación de información con constructores también, pero la información protegida será no ser visible para los métodos que coloca en el prototipo; información protegida sólo será visible a los métodos que se agregan manualmente a this)

La única desventaja aquí es que la creación será ligeramente más lento, ya que es la creación de ese método someFuncde novo cada vez; con un constructor existiría una vez, como parte del prototipo.

4. ¿Cuál es preferible? Si solo desea crear un solo objeto, entonces use 3 o 4. Simple.

Si desea crear repetidamente un objeto, entonces depende. ¿Va a crear decenas de miles de estos objetos, por lo que la velocidad es de suma importancia? Si es así, probablemente querrás un constructor. De lo contrario, depende de con qué se sienta más cómodo. Encuentro una función simple que devuelve un objeto más claro y más flexible, pero esa es solo mi preferencia. Muchos desarrolladores mucho más inteligentes que yo prefieren constructores.

Answer 2

1. 3 y 4 son todavía funciones, pero también son objetos. 1 y 2 también son objetos y funciones. Todas las funciones son objetos: JavaScript tiene funciones de primera clase.

2. Instala un objeto. Las funciones que se llaman con new son constructores. Crean objetos.

3. Son exactamente lo mismo. Al igual que en el n. ° 1, el nivel de anidación no tiene efecto en el tipo de nada ...

4. No, porque todos son equivalentes. Un Function es un Object y no importa dónde se encuentre. En general, sin embargo, evitará el anidamiento pesado con el propósito de espacios de nombres, ya que puede ralentizar su código, sin todo ese beneficio de claridad. JavaScript no fue realmente diseñado con espacios de nombres en mente.

Answer 3

AFAIK

1) En JS todas las funciones son objetos. En el caso de 3, sí sería considerado como un objeto porque está dentro de las llaves

3) Son lo mismo, pero una forma en que PODRÍA animar las cosas sería 'devolver' una de las propiedades de más alto nivel y no el otro, que esencialmente oculta la función no devuelta y le da una forma de crear métodos públicos y privados.

4) Probablemente 4 está más cerca de lo que creo que quiere y sigue algunas aproximaciones razonables, pero como dice Andrés, me inclinaría a cambiar 4 en algo como esto:

var TestFunction4 = (function(){ 
    return { 
     flag: function() { 
      console.log('TestFunction4.flag() was ran'); 
     }, 
     unflag: function() { 
      console.log('TestFunction4.unflag() was ran'); 
     } 
    } 
})(); 
TestFunction4.flag(); 
TestFunction4.unflag(); 

Nota del paréntesis en el la cola del método, obligando a la función para ejecutar de inmediato y hacerse disponible, antes de tiempo de ejecución para el resto de la aplicación (en términos de, por ejemplo, intelliSense)

EDIT:

Ésta es la forma en que haría uso de ' funciones privadas en respuesta t O el '¿por qué haces esto' comentario:

var TestFunction4 = (function(){ 
    //private function 
    var private = { 
     aPrivateFunction: function(a) { 
      return a + 1; 
     } 
    } 
    //public return object 
    var public = { 
     flag: function() { 
      console.log('Calling private function aPrivateFunction(10) expecting 11'); 
      console.log('result' + private.aPrivateFunction(10)); 
      console.log('TestFunction4.flag() was ran'); 
     }, 
     unflag: function() { 
      console.log('TestFunction4.unflag() was ran'); 
     } 
    } 
    //return things to expost publicly 
    return public; 
})();