78 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
		
		
			
		
	
	
			78 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| 
								 | 
							
								---
							 | 
						||
| 
								 | 
							
								title: Object Instantiation
							 | 
						||
| 
								 | 
							
								---
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								## Object Instantiation
							 | 
						||
| 
								 | 
							
								In Javascript and most other languages, an object contains a series of properties, which are a key, value pair. There are multiple options available to you when you need to construct an object.
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								### Initialize an object variable
							 | 
						||
| 
								 | 
							
								You can create an object with pre-defined properties like so:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```javascript
							 | 
						||
| 
								 | 
							
								let myObject = {
							 | 
						||
| 
								 | 
							
								  name: "Dave",
							 | 
						||
| 
								 | 
							
								  age: 33
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								### Creating an empty object
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								This creates an empty object inside our myObject variable:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```javascript
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								let myObject = new Object();
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								When you wish to add properties to your object, you simply use either dot notation or bracket notation with the property name of your choice:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```javascript
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								myObject.name = "Johnny Mnemonic"
							 | 
						||
| 
								 | 
							
								myObject["age"] = 55
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								### Using a constructor function
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								You can define a constructor function that you can use to create your objects:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```javascript
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								function Kitten(name, cute, color) {
							 | 
						||
| 
								 | 
							
								  this.name = name,
							 | 
						||
| 
								 | 
							
								  this.cute = cute,
							 | 
						||
| 
								 | 
							
								  this.color = color
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								You can define a variable containing an instantiation of this object by calling the constructor function:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```javascript
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								let myKitten = new Kitten("Nibbles", true, "white")
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								### Object.create()
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								The Object.create() method (first defined in ECMAScript 5.1) allows you to create objects. it allows you to choose the prototype object for your new object without needing to define a constructor function beforehand.
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```javascript
							 | 
						||
| 
								 | 
							
								// Our pre-defined object
							 | 
						||
| 
								 | 
							
								let kitten = {
							 | 
						||
| 
								 | 
							
								  name: "Fluff",
							 | 
						||
| 
								 | 
							
								  cute: true,
							 | 
						||
| 
								 | 
							
								  color: "gray"
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								// Create a new object using Object.create(). kitten is used as the prototype
							 | 
						||
| 
								 | 
							
								let newKitten = Object.create(kitten)
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								console.log(newKitten.name) // Will output "Fluff"
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								#### More Information
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects' target='_blank' rel='nofollow'>MDN article on working with objects</a>
							 |