What is the Difference between Constructor and ngOnInit in AngularJS ? Last Updated : 24 Apr, 2020 Comments Improve Suggest changes 4 Likes Like Report Constructor: Constructor is the default method for a class that is created when a class is installed and ensures the proper execution of the roles in the class and its subsections. Angular are preferably the Dependency Injector (DI), analyzes the builder's components and when creating a new feature by calling the new MyClass() tries to find suppliers that match the builder's parameter types, resolve them and pass them to similar components. new MyClass(someArg); Example: javascript 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); Output: 6 ngOnInit: OnInit is a life cycle widget called Angular to show that Angular is made to create a component. We have to import OnInit like this to use it (actually using OnInit is not mandatory but it is considered good). Syntax: import {Component, OnInit} from '@ angular / core'; and to use it to execute the OnInit method, we should use a section like this: Example: javascript 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'); } } Output: Called Constructor Called ngOnitit method Note: Class app sales constructor () { // First called before ngOnInit () } Oninit () { // Named after the constructor and named after NgOnChanges() } Use this interaction to apply custom startup thinking after the launch of the admin property. NGOnInit is named after the indexing of the target sites for the first time, and before any of its children are tested. Only once a guide is included. Difference between ngOnInit and Constructor: We mostly use ngOnInit in every startup/announcement and avoid things to work in builders. The constructor should only be used to start class members but should not do the actual "work". So you should use the constructor() to set Dependency Injection and not much. ngOnInit() is a better "starting point" - this is where / when component combinations are solved. We use constructor() for all the initialization/declaration. It’s better to avoid writing actual work in the constructor. The constructor() should only be used to initialize class members but shouldn't do actual "work". So we should use constructor() to set up Dependency Injection, Initialization of class fields, etc. ngOnInit() is a better place to write "actual work code" that we need to execute as soon as the class is instantiated. Like loading data from Database — to show the user in your HTML template view. Such code should be written in ngOnInit(). Conclusion: Constructor initializes class members. ngOnInit() is a place to put the code that we need to execute at very first as soon as the class is instantiated. Create Quiz Comment T techni621 Follow 4 Improve T techni621 Follow 4 Improve Article Tags : Web Technologies AngularJS AngularJS-Misc Explore AngularJS BasicsAngularJS Tutorial 5 min read Introduction to AngularJS 4 min read Angular CLI | Angular Project Setup 3 min read AngularJS Expressions 2 min read AngularJS Modules 3 min read AngularJS ng-model Directive 4 min read AngularJS Data Binding 4 min read AngularJS Controllers 3 min read AngularJS | Scope 2 min read AngularJS Services 4 min read AngularJS | AJAX - $http 3 min read AngularJS | Tables 2 min read AngularJS Select Boxes 2 min read AngularJS SQL 3 min read AngularJS HTML DOM 2 min read AngularJS Events 3 min read AngularJS | Forms 3 min read AngularJS Form Validation 3 min read AngularJS | API 2 min read AngularJS and W3.CSS 2 min read AngularJS Includes 3 min read AngularJS Animations 1 min read AngularJS | Application 3 min read AngularJS DirectivesAngularJS Directives 9 min read AngularJS ng-app Directive 1 min read AngularJS ng-bind Directive 2 min read AngularJS ng-bind-html Directive 2 min read AngularJS ng-bind-template Directive 2 min read AngularJS ng-blur Directive 1 min read AngularJS ng-change Directive 2 min read AngularJS ng-checked Directive 2 min read AngularJS ng-class Directive 2 min read AngularJS ng-class-even Directive 2 min read AngularJS ng-class-odd Directive 2 min read AngularJS ng-click Directive 2 min read AngularJS ng-cloak Directive 2 min read AngularJS ng-controller Directive 2 min read AngularJS Directives Complete Reference 2 min read AngularJS FiltersAngularJS | Filters 7 min read AngularJS currency Filter 2 min read AngularJS | date Filter 2 min read AngularJS filter Filter 3 min read AngularJS json Filter 2 min read AngularJS limitTo Filter 2 min read AngularJS lowercase Filter 1 min read AngularJS number Filter 1 min read AngularJS orderBy Filter 4 min read AngularJs uppercase Filter 1 min read AngularJS Converting FunctionsAngularJS angular.lowercase() Function 2 min read AngularJS angular.uppercase() Function 1 min read AngularJS angular.forEach() Function 1 min read AngularJS Comparing FunctionsAngularJS angular.isArray() Function 2 min read AngularJS angular.isDate() Function 2 min read AngularJS angular.isDefined() Function 2 min read AngularJS angular.isElement() Function 2 min read AngularJS angular.isFunction() Function 2 min read AngularJS angular.isNumber() Function 2 min read AngularJS angular.isObject() Function 2 min read AngularJS | angular.isString() Function 1 min read AngularJS angular.isUndefined() Function 2 min read AngularJS angular.equals() Function 2 min read AngularJS angular.toJson() Function 2 min read AngularJS QuestionsHow to bundle an Angular app for production? 4 min read How to add many functions in one ng-click directive? 2 min read How to directly update a field by using ng-click in AngularJS ? 3 min read How to Add Dynamic Options for Multiple Selects Inside ng-repeat Directive ? 3 min read How to detect when an @Input() value changes in Angular? 3 min read How to open popup using Angular and Bootstrap ? 2 min read How to reload or re-render the entire page using AngularJS? 2 min read How to add input fields dynamically on button click in AngularJS ? 2 min read How to Create Button Dynamically with Click Event in Angular ? 2 min read How to use jQuery in Angular ? 2 min read AngularJS Examples 2 min read Like