Download presentation
Presentation is loading. Please wait.
Published byElinor Wilkinson Modified over 8 years ago
1
Objects © Copyright 2014, Fred McClurg All Rights Reserved
2
Object Declared What is an object? Data structure that combines data (via properties) and actions (via methods) into an encapsulated collection. Examples: // declare object var emptyObject = {}; // curly braces // print object console.log( emptyObject ); 2 objDeclare.html
3
Object Properties Initialized Defining an object: Object properties can be declared and initialized in a single statement. Example: // declare and initialize object var car = { make: 'Toyota', model: 'Corolla', mpgCity: 30, mpgHwy: 42, }; console.log( car ); 3 objPropInit.html
4
Accessing Object Properties Getting (retrieving) Properties: var car = { make: 'Toyota', model: 'Corolla', mpgCity: 30, mpgHwy: 42, }; // access property via dot notation console.log( car.make ); // Toyota // access property via associative array console.log( car['make'] ); // Toyota 4 objAccessProp.html
5
Modifying Object Properties Modifying Existing Properties: var car = { make: 'Toyota', model: 'Corolla', mpgCity: 30, mpgHwy: 42, }; car.mpgCity = 28; // property via dot car['mpgHwy'] = 37; // property via key // display entire object console.log( car ); 5 objModProp.html
6
Adding Object Properties Adding New Properties: var car = { make: 'Toyota', model: 'Corolla', mpgCity: 30, mpgHwy: 42, }; // add new properties car.color = 'Silver'; // add property via dot car['edition'] = 'LE'; // add property via key // display entire object console.log( car ); 6 objAddProp.html
7
Deleting Object Properties Deleting Properties: var car = { make: 'Toyota', model: 'Corolla', mpgCity: 30, mpgHwy: 42, }; // delete properties delete car.mpgCity; // deleting via dot delete car['mpgHwy']; // deleting via key // display entire object console.log( car ); 7 objDelProp.html
8
Object Method Declared Defining an object: An object method is a property with an anonymous function defined as the value. Example: // declare object property and method var car = { make: 'Toyota', // object property sound: function() { // object method console.log( car.make + ": Honk!" ); }, }; // call object method car.sound(); // Toyota: Honk! 8 objMethInit.html
9
Using “this” in Object Method Description: Keyword “this” is a way to reference the object name: Example: // create object var car = { make: 'Toyota', // property color: null, // property displayInfo: function() { // method console.log( "Make: " + this.make ); // car.make console.log( "Color: " + this.color ); // car.color } }; car.color = "red"; // set object property car.displayInfo(); // call object method 9 objMethThis.html
10
Object “Copying by Reference” Discussion: Object assignment performs a “copy by reference”. The object properties are not copied. The new object reference is actually just a pointer to the original object. This means that modifying the reference object is the same as modifying the original object. 10
11
Object “Copy by Reference” Example Example: var wildAnimal = { 'name': 'squirrel', 'wild': true, }; // copy reference of original object var zooAnimal = wildAnimal; // modify the reference property zooAnimal.wild = false; // display original property console.log( wildAnimal.wild ); // false 11 objCopyRef.html
Similar presentations
© 2024 SlidePlayer.com Inc.
All rights reserved.