Apa itu instance di javascript?
In this article, I am going to discuss Object Instances in JavaScript with Examples. This is a continuation part to our previous article, so, please read our previous article where we discussed Object Constructors in JavaScript.
Understanding Object InstancesWe just can’t look at a JavaScript object and identify that it is an object of a specific type, like a dog or a car. In JavaScript, objects are dynamic structures, and the type of all objects is “object” only, no matter what properties and methods it has. But we can get some information about an object if we know about the constructor that created the object. Remember that each time we call a constructor using the new operator, we are creating a new instance of an object. And, if we used, say, the Car constructor to do that, then we say, informally, that the object is a car. More formally, we say that an object is an instance of a Car. As we know, each instance can have its own unique set of property values, but we think of all the objects created from the Car constructor as instances of Car. We can think of these cars as being the same kind of object because they all were created by the same constructor. Now saying an object is an instance of some constructor is more than talk. We can actually write code to check the constructor that made an object with the instanceof operator. Let’s look at some code: As it proves that, one of the things the new operator does behind the scenes when the object is created is to store information that allows it to determine, at any time, the constructor that created the object. And instanceof uses that to determine if an object is an instance of a certain constructor or not. What we discussed above is given in the below example. Example: Object’s creation in JavaScript, by Using Object constructor to check object instances of constructor
Now run the above code, open the browser developer tool by pressing the F12 key and have a look at the Console tab and you should see the following message in the Console.
Run the above code, open the browser developer tool by pressing the F12 key and have a look at the Console tab and you should see the following messages in the Console. So, an object is a dog if it was created with a Dog constructor, -and not otherwise? Yes, that’s how it works. JavaScript doesn’t have a strong sense of an object’s type, so if we need to compare objects to see if they are both cats or both dogs, we check to see if they were constructed the same way—that is, with the same constructor function. As we have said, a cat is a cat if it was created by the Cat constructor, and a dog is a dog if it was created by the Dog constructor. Objects can have their own independent properties even constructed object tooWe have talked a lot about how to use constructors to create consistent objects—objects that have the same set of properties and the same methods. But what we haven’t mentioned is that using constructors still doesn’t prevent us from changing an object into something else later, because after an object has been created by a constructor, it can be altered. As we know that Properties and methods can change at any time What exactly are we talking about? If we remember when we introduced object literals? We looked at how we could add properties after the object was created. we can do the same with objects created from constructors. var fido = new Dog("Fido", "Mixed", 38); // dog constructor fido.owner = "Bob"; //adding new property delete fido.weight; //deleting a property using delete operator Here’s our dog Fido is created with the Dog constructor. We can add a new property just by assigning it a value in our object. Or we can get rid of/remove a property by using the delete operator. We can even add new methods if we like: fido.trust = function (person) { //anonymous function return (person === "Bob"); }; To add a method just assign the method to a new property name in the object using assignment operator i.e.: =, They are added like Anonymous function See, they are everywhere in an object when assigning the method to it. Notice that here we’re changing only the fido object. If we add a method to fido, only fido has that method. No other dogs have it: var notBite = fido.trust(“Bob”); This line of code works because trust is defined previously in the fido object. So notBite is true. var spot = new Dog(“Spot”, “Chihuahua”, 10); So, if I change a car object after I create it, is it still a car?Yes, a car is still a car, even if we change it later. And what we mean by that is if we check to see if our object is still an instance of Car, it will be. For instance, if we create a car object: var cadiParams = { make: "GM", model: "Cadillac", year: 1955, color: "tan", passengers: 5, convertible: false, mileage: 12892 }; var cadi = new Car(cadiParams); We can add a new property chrome to it and delete the property convertible from the cadi object: cadi.chrome = true; delete cadi.convertible; and yet, the cadi is still a car: cadi instanceof Car;// Evaluate to be true Now is it really a car in practical terms? What if we deleted all the property in the object? Would it still be a car? The instanceof operator would tell us yes. But judging by our own terms, probably not. This is what we meant earlier when we said that JavaScript has a dynamic type system. What we discussed above is given in the below example. Example: Object’s creation in JavaScript, by Using Object constructor to check constructed objects can have their own independent properties
Output: When calling the unassigned method i.e. spot.trust(“Bob”); we will get the following error in the console tab. Now the unassigned method i.e. spot.trust(“Bob”); as shown in the below example.
Now run the above code and you should get the following messages in the Console tab. In the next article, I am going to discuss Real-World Constructors in JavaScript with Examples. Here, in this article, I try to explain Object Instances in JavaScript with Examples and I hope you enjoy this Object Instances in JavaScript article. |