2018-09-30 23:01:58 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							
							
								---
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								id: 56533eb9ac21ba0edf2244c7
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								title: Accessing Object Properties with Dot Notation
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								challengeType: 1
							 
						 
					
						
							
								
									
										
										
										
											2019-02-14 12:24:02 -05:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								videoUrl: 'https://scrimba.com/c/cGryJs8'
							 
						 
					
						
							
								
									
										
										
										
											2018-09-30 23:01:58 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							
							
								---
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								## Description
  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< section  id = 'description' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								There are two ways to access the properties of an object: dot notation (< code > .< / code > ) and bracket notation (< code > []< / code > ), similar to an array.
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								Dot notation is what you use when you know the name of the property you're trying to access ahead of time.
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								Here is a sample of using dot notation (< code > .< / code > ) to read an object's property:
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< blockquote > var myObj = {< br >     prop1: "val1",< br >     prop2: "val2"< br > };< br > var prop1val = myObj.prop1; // val1< br > var prop2val = myObj.prop2; // val2< / blockquote >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / section >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								## Instructions
  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< section  id = 'instructions' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								Read in the property values of < code > testObj< / code >  using dot notation. Set the variable < code > hatValue< / code >  equal to the object's property < code > hat< / code >  and set the variable < code > shirtValue< / code >  equal to the object's property < code > shirt< / code > .
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / section >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								## Tests
  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< section  id = 'tests' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```yml
							 
						 
					
						
							
								
									
										
										
										
											2018-10-04 14:37:37 +01:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								tests:
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  -  text: < code > hatValue</ code >  should be a string
							 
						 
					
						
							
								
									
										
										
										
											2018-10-20 21:02:47 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								    testString: assert(typeof hatValue === 'string' , '< code > hatValue< / code >  should be a string');
							 
						 
					
						
							
								
									
										
										
										
											2018-10-04 14:37:37 +01:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								  -  text: The value of < code > hatValue</ code >  should be < code > "ballcap"</ code > 
							 
						 
					
						
							
								
									
										
										
										
											2018-10-20 21:02:47 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								    testString: assert(hatValue === 'ballcap' , 'The value of < code > hatValue< / code >  should be < code > "ballcap"< / code > ');
							 
						 
					
						
							
								
									
										
										
										
											2018-10-04 14:37:37 +01:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								  -  text: < code > shirtValue</ code >  should be a string
							 
						 
					
						
							
								
									
										
										
										
											2018-10-20 21:02:47 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								    testString: assert(typeof shirtValue === 'string' , '< code > shirtValue< / code >  should be a string');
							 
						 
					
						
							
								
									
										
										
										
											2018-10-04 14:37:37 +01:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								  -  text: The value of < code > shirtValue</ code >  should be < code > "jersey"</ code > 
							 
						 
					
						
							
								
									
										
										
										
											2018-10-20 21:02:47 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								    testString: assert(shirtValue === 'jersey' , 'The value of < code > shirtValue< / code >  should be < code > "jersey"< / code > ');
							 
						 
					
						
							
								
									
										
										
										
											2018-10-04 14:37:37 +01:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								  -  text: You should use dot notation twice
							 
						 
					
						
							
								
									
										
										
										
											2018-10-20 21:02:47 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								    testString: assert(code.match(/testObj\.\w+/g).length > 1, 'You should use dot notation twice');
							 
						 
					
						
							
								
									
										
										
										
											2018-09-30 23:01:58 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / section >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								## Challenge Seed
  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< section  id = 'challengeSeed' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< div  id = 'js-seed' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```js
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								// Setup
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								var testObj = {
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  "hat": "ballcap",
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  "shirt": "jersey",
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  "shoes": "cleats"
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								};
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								// Only change code below this line
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								var hatValue = testObj;      // Change this line
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								var shirtValue = testObj;    // Change this line
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / div >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								### After Test
  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< div  id = 'js-teardown' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```js
							 
						 
					
						
							
								
									
										
										
										
											2018-10-20 21:02:47 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								(function(a,b) { return "hatValue = '" + a + "', shirtValue = '" + b + "'"; })(hatValue,shirtValue);
							 
						 
					
						
							
								
									
										
										
										
											2018-09-30 23:01:58 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / div >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / section >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								## Solution
  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< section  id = 'solution' >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```js
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								var testObj = {
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  "hat": "ballcap",
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  "shirt": "jersey",
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								  "shoes": "cleats"
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								};
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
									
										
										
										
											2018-10-08 01:01:53 +01:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
							
								var hatValue = testObj.hat;
							 
						 
					
						
							
								
									
										
										
										
											2018-09-30 23:01:58 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							
							
								var shirtValue = testObj.shirt;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							
							
								< / section >