1. Julian on JavaScript: Objects Julian M Bucknall, CTO

2. Ubiquitous objects −Everything that’s not a boolean, number, string, null or undefined is … an object −Namely: −Arrays are objects −Functions are objects −And objects are objects

3. An object is… − A hash table, or − A collection of key/value pairs − The keys are strings − The values can be any type − If they’re data they’re known as properties − If functions, they’re known as methods − Passed as a reference not a value − NOT an instance of a class

4. Extending objects −Objects are not fixed: −You can add new properties/methods −You can remove a property/method − delete(myObject.name); −You can redefine a property/method

5. Creating an empty object − var o = {}; −Preferred − var o = new Object(); −It’s beginner stuff, no one does it this way − var o = Object.create(Object.prototype); −Just don’t

6. Creating an object −Easy way: object literals −Start with open brace, end with closing brace −Define set of key/value pairs −Separate them with commas −Each key is a string or some identifier −Each value can be anything, including expressions −Separate key from value with colon

7. Object literals… −Are great since you can use them wherever a value is needed

8. Object literals… −Are great for passing a set of data (parameters) to a function as a single parameter −Allows for default parameters −Needs an “extend” type function

9. Inheritance −Objects are NOT instances of some class −There are no classes in JavaScript −Objects can inherit from each other −Done through the “prototype”

10. Prototypes: reading manager −officeNumber −(prototype link) manager −officeNumber −(prototype link) employee −name −(prototype link) employee −name −(prototype link)

11. Prototypes: writing manager −officeNumber − −(prototype link) manager −officeNumber − −(prototype link) employee −name −(prototype link) employee −name −(prototype link)

12. Object.create −Object.create() makes a new object that inherits from (has as prototype) an existing one

13. Prototypal inheritance −C# has classes and classes inherit from each other −JavaScript has objects and objects inherit from each other through the prototype −It does the same thing, but differently

14. Prototypal inheritance −Works by… −Defining some interesting object −Then creating other objects with that as prototype −Object.create −Then customizing those new objects

15. Prototypal inheritance −The end of the prototypal chain is always Object.protoype −So all objects have some inherited methods −toString() −hasOwnProperty()

16. Arrays −Are objects −Are wacky compared to C# −Elements are key/value pairs −Key is the index as a string − length is always computed as “largest index” plus 1 −No single type for values −Don’t use “ for.. in ” with arrays, use for −The prototype is Array.prototype

17. How do you identify an array? − typeof obj returns “object” −Rats! − obj instanceof Array −Pretty good, but doesn’t work if object is from another iframe −ECMAScript 5? Array.isArray(obj) − Object.prototype.toString(obj) returns "[object Array]"

18. Creating an array − var a = new Array(); −It’s beginner stuff, people − var a = []; −Much better, no need to declare initial size − var a = [1, 2, "3", true]; −Much easier to read

19. Array methods −Defined on the Array prototype −Examples: − push/pop − shift/unshift − concat/join − slice/splice − sort

20. Removing an element − delete myArray[index]; −Just sets the element to undefined − myArray.splice(index, 1); −Removes the element −Reindexes the higher elements −Changes the length

21. Thank You Julian M Bucknall ∙ CTO ∙ DevExpress @jmbucknall julianb@devexpress.com http://devexpress.com/julian