¿Cuál es la diferencia entre Constructor y ngOnInit en AngularJS?

Constructor: Constructor es el método predeterminado para una clase que se crea cuando se instala una clase y asegura la correcta ejecución de los roles en la clase y sus subsecciones. Angular es preferiblemente el Inyector de dependencia (DI), analiza los componentes del constructor y cuando crea una nueva función llamando al nuevo MyClass() intenta encontrar proveedores que coincidan con los tipos de parámetros del constructor, resolverlos y pasarlos a componentes similares.

new MyClass(someArg);

Ejemplo:

var AddNumbers= (function () {
    function AddNumbers(x, y) {
        this.x = x;
        this.y = y;
    }
    AddNumbers.prototype.add = function () {
      return this.x + point.x;
    };
    return AddNumbers;
})();
  
  
var numbers = new AddNumbers(2, 4);
var additionOfNumbers = numbers.add();
console.log(additionOfNumbers);

Producción:

6

ngOnInit: OnInit es un widget de ciclo de vida llamado Angular para mostrar que Angular está hecho para crear un componente. Tenemos que importar OnInit así para usarlo (en realidad, usar OnInit no es obligatorio, pero se considera bueno).

Sintaxis:

import {Component, OnInit} from '@ angular / core';

y para usarlo para ejecutar el método OnInit, deberíamos usar una sección como esta:

Ejemplo:

import { Component, OnInit } from '@angular/core';
  
@Component({
    selector:'app-checkbox',
    templateUrl:'./checkbox.component.html',
    styleUrls: ['./checkbox.component.css']
})
  
export class CheckboxComponent implements OnInit {
    constructor() {
        console.log('Called Constructor');
    }
  
    ngOnInit() {
        console.log('Called ngOnInit method');
    }
}

Producción:

Called Constructor
Called ngOnitit method

Nota: Ventas de aplicaciones de clase

constructor () {
// First called before ngOnInit ()
}
Oninit () {
// Named after the constructor and named after NgOnChanges()
}

Utilice esta interacción para aplicar el pensamiento de inicio personalizado después del lanzamiento de la propiedad de administración. NGOnInit lleva el nombre de la indexación de los sitios de destino por primera vez y antes de que se pruebe cualquiera de sus hijos. Solo una vez se incluye una guía.

Diferencia entre ngOnInit y Constructor:

  • Principalmente usamos ngOnInit en cada inicio/anuncio y evitamos que las cosas funcionen en los constructores. El constructor solo debe usarse para iniciar miembros de la clase, pero no debe hacer el «trabajo» real.
  • Por lo tanto, debe usar el constructor() para configurar la inyección de dependencia y no mucho. ngOnInit() es un mejor «punto de partida»: aquí es donde/cuando se resuelven las combinaciones de componentes.
  • Usamos constructor() para todas las inicializaciones/declaraciones.
  • Es mejor evitar escribir el trabajo real en el constructor.
  • El constructor() solo debe usarse para inicializar miembros de la clase, pero no debe hacer un «trabajo» real.
  • Entonces, deberíamos usar constructor() para configurar la inyección de dependencia, la inicialización de campos de clase, etc.
  • ngOnInit() es un mejor lugar para escribir «código de trabajo real» que necesitamos ejecutar tan pronto como se crea una instancia de la clase.
  • Como cargar datos de la base de datos, para mostrar al usuario en su vista de plantilla HTML. Dicho código debe escribirse en ngOnInit().

Conclusión:

  • El constructor inicializa los miembros de la clase.
  • ngOnInit() es un lugar para colocar el código que necesitamos ejecutar al principio tan pronto como se crea una instancia de la clase.

Publicación traducida automáticamente

Artículo escrito por techni621 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *