2

Me surgió la duda, ya que lo he visto de dos formas distintas y la verdad es que dan el mismo resultado y no sé si tienen alguna diferencia en concreto. He visto estas dos formas de declarar un método en javascript:

1- Asignandole una function a una propiedad del objeto:

const persona = {
  nombre: "Leonardo",
  saludar: function() {
    console.log(`Hola! soy ${this.nombre}!!`)
  }
}


persona.saludar();

2- Definiendo el método directamente:

const persona = {
  nombre: "Agustín",
  saludar() {
  console.log(`Hola! soy ${this.nombre}!!`)
  }
}

persona.saludar();

Quería saber si primero estas distintas formas reciben un nombre en particular y segundo si existe una diferencia o es lo mismo.

1
  • No soy de tecnicismos pero la segunda forma viene de ES6 y es por decirlo asi una forma sugar sintactic corta de declarar una funcion dentro de un objeto, esto es aplicable tambien por ejemplo a las clases de ES6, de todas maneras recuerda siempre mirar la compatibilidad entre navegadores, ya que aquellos que no hagan uso de ES6 o esten muy desactualizados simplemente no reconoceran la segunda forma.
    – Layer
    Commented el 23 dic. 2020 a las 5:10

1 respuesta 1

1

En cuanto a la primera pregunta (reciben nombre el particular), sí:

  1. La función que le estás asignando recibe el nombre de "función anónima" (la función en sí no tiene nombre, de ahí el concepto de anónima), y puede dar lugar a errores si no controlas bien el contexto y las referencias de this. En lugar de ello, es más recomendable utilizar una arrow function (función flecha), que te ayuda en gran manera en ese aspecto.
  2. La segunda forma, como bien ha introducido @riven, se trata de una de las novedades introducidas en ES6, y que permite acortar la definición de propiedades (sean métodos o no), y que no deja de ser una forma más simple de escribir funciones anónimas. Tienes más detalle si deseas en este enlace.

const x = 1;

// Esta es la forma abreviada (sintaxis corta, syntactic sugar de ES6)
const obj = {
  x,
  f(a, b) {}
};

// Esta es la forma tradicional antes de ES6 o para browsers antiguos
const obj = {
  x: x,
  f: function(a, b) {}
};

En cuanto a la segunda pregunta (diferencia entre ambas formas), en el ejemplo propuesto no habría ninguna diferencia, por tratarse ambas de funciones anónimas asignadas a una propiedad de un objeto.

Espero haberte podido ayudar, y puedes utilizar los comentarios si algo no ha quedado claro.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.