JAVASCRIPT OBJECT CONSTRUCTOR CODE

As well as creating a new object, a constructor specifies the properties and behaviors that will belong to it. A constructor is a function you can use to create an instance of an object. With our knowledge of constructors and the new operator, we can easily add properties to the newly constructed object. What Is a Constructor in JavaScript Constructors are one of the fundamental concepts in object-oriented programming. JavaScript Design Patterns For Creating Constructors Again, as a rule, a constructor should not have a return statement❗ 💥 Also notice the BadPerson constructor that returns its own object fails to return the object created from the new operator.

JAVASCRIPT OBJECT CONSTRUCTOR CODE

We can see from the result of the code above that the regular function returns undefined as expected but the constructor returns a new object created by the new operator which also binds the this variable in that constructor to this object. In JavaScript there are two ways to create an object: the constructor function or the literal notation. In this article I want to sort it out for good. In our code example above, Person is the constructor and person is the regular function. JavaScript is, quite surprisingly, an object-oriented programming language that can be confusing when it comes to object creation. This would also serve as a reminder for you to use the new operator with every constructor. The first letter of a constructor's name is always capitalized. 💡 We use this pattern in JavaScript to differentiate constructors from regular functions. Notice that the first letter of the constructor's name is capitalized while the regular function name is all lowercase. Infix Notation: In this notation, operators are placed between their operands.Ĭonsole.log('regular function result', regularDeveloper)Ĭonst constructorDeveloper = new Person()Ĭonsole.log('Person constructor result', constructorDeveloper)Ĭonsole.log('BadPerson constructor result', BadJack)įrom the code example above I have deliberately given 2 of the 3 functions the same name but since JavaScript is case sensitive they are two different functions.This includes all intrinsic JavaScript objects except the Global. Operators much like regular functions take parameters (which are called operands) but unlike regular functions, they give us a convenient syntax which can be in the form of any of the three notations below: The constructor property is a member of the prototype of every object that has a prototype. You can see all the properties of the tellDevName function and the Date constructor when you run the code but if you uncomment the lines where I passed an operator as a parameter, and try to run the code, runkit would throw an error, this tells us that they are not regular function objects. 💡 The console.dir() displays an interactive list of the properties of the specified JavaScript object console.dir('function properties', new) if you uncomment the lines below and run the codes in you get an error. Kindly run the codes below and consider the results:Ĭonsole.dir('function properties', tellDevName)

They are not like a regular JavaScript functions objects hence passing them to console.dir() would throw an error. Operators are special JavaScript functions that are syntactically different from regular functions. Hence, a good understanding of operators in JavaScript is necessary to grasp the power of this operator. ✨ The key to understanding it is to always see it as another regular JavaScript operator. The new operator can be very confusing and somewhat intimidating at first. Note that the value of this property is a.

This is a very powerful JavaScript operator that has the ability to modify certain behaviours of a function. Returns a reference to the Object function that created the instances prototype. Hence it is a common pattern in JavaScript, that constructors do not have a return statement Stated simply, the prototype is another object that the original object inherits from, which is to say, the. It will create an empty object if null or undefined is passed. This behaviour is leveraged in creating constructors as we are able to modify what that function returns using the new operator. All objects in JavaScript have a prototype. In JavaScript, the object constructor lets us create object wrapper with the given values. 💡 The JavaScript engine would return undefined from any function that does not return a value. Another thing that should be pretty obvious about the Person function is that it does not have a return statement hence when invoked it would return undefined.if the object is just a container for data/state), I would use an object literal.The above example shows that the this variable inside a function is pointing to the global object. If you don't have behaviour associated with an object (i.e.

Javascript object constructor