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> |