Objects
Objects in javascript can have properties and methods, methods are functions that are stored within the object. Javascript has some built in objects as a language, such as a date object, and a math object.
object literal
We can create object literals by declaring them in a way that is similar to arrays, only the objects are enclosed in curly braces {}.
let user = { name: 'Billy', age: '30', email: 'billy@bob.com', location: 'Sydney', blogs: ['Throw another prawn on the barbi Shela', 'hunting kangaroo\'s'] } console.log(user);
Object properties can be accessed by calling the member name using the dot notation, else they can be called by name treating the object as a hashmap. Using the hashmap to call the data can be useful as it permits us to use a variable to retrieve an objects property value.
console.log(user.name); // Billy console.log(user['name']); // Billy let local = ''; let key = 'location'; local = user[key]; console.log(local); // Sydney
methods on objects
A major part of objects us is the calling of functions or methods on them. We can define an objects method by defining a function when the object literal is declared.
let user = { name: 'Billy', age: '30', email: 'billy@bob.com', location: 'Sydney', blogs: ['Throw another prawn on the barbi Shela', 'hunting kangaroo\'s'] login: function() { console.log('user login'); } } user.login(); // user login
this
If we want to use any properties of the object from inside of any of its methods, we use the 'this' keyword to refer to the enveloping object.
let device = { name: 'ZR315', type: 'sensor', value: '512', read: function() { console.log(this.value); } } device.read(); // 512
Calling this out side of an objects method will refer to the global window objects. If this is used inside of an arrow function the this will refer to what ever this was in the scope that the arrow function was called. As such, if we want 'this' to refer to the properties of an object from within an objects method, then we must define that method using the function key word.
We can abbreviate the use of the function key word to brackets following after the functions name definition, the 'this' keyword will still refer to the enclosing object in this case.
let device = { name: 'ZR315', type: 'sensor', value: '512', read() { console.log(this.value); } } device.read(); // 512
Math object
Javascript comes with some pre built objects one of which is the math object, it can be called by typing Math. Logging this math object to the console gives us a full listing of all of its properties and methods.
console.log(Math); // Math { … } console.log(Math.PI); // 3.141592653589793 const area 7.7; console.log(Math.round(area)); // 8 console.log(Math.floor(area)); // 7 console.log(Math.ceil(area)); // 8 console.log(Math.trunc(area)); // 7 const random = Math.random(); console.log(random); // 0.2040760237726449 console.log(Math.round(random * 100)); // 20
primitive or reference
In javascript there are two principle types:
- primitive
- - numbers
- - strings
- - boolean
- - null
- - undefined
- - symbols
- reference
- - all types of objects
- - object literals
- - arrays
- - functions
- - dates
- - all other objects
When we create primitive types they are stored in stack memory where as reference types are created on the heap. A resulting effect of this is a difference in the way that the two types of variables are copied. When primitive type are copied, the data is doubled and an actual copy is made. When reference types are copied, the pointer to the data on the heap is copied, making a second reference, but both the original and the new reference point to the same data on the heap, if one reference alters the data, it is changed for the second reference also.
let scoreOne = 60; let scoreTwo = scoreOne; // scoreOne: 60, scoreTwo: 60 console.log(`scoreOne: ${scoreOne}, scoreTwo: ${scoreTwo}`); scoreTwo = 120; // scoreOne: 60, scoreTwo: 120 console.log(`scoreOne: ${scoreOne}, scoreTwo: ${scoreTwo}`); const user1 = {name: 'Tom', age: 30}; const user2 = user1; console.log(user1, user2); // Object { name: "Tom", age: 30 } // Object { name: "Tom", age: 30 } user1.age = 60; console.log(user1, user2); // Object { name: "Tom", age: 60 } // Object { name: "Tom", age: 60 }