Objects Flashcards
What are objects in JavaScript?
An object is data that contains key:value pairs
How do we create objects in JavaScript
We create objects by containing the key:value pairs within curly braces. Multiple K:V need to be separated by commas
How can we conceptualize the relationship between key and value in an object
Each key references a value
Much like a word and its definition in the dictionary
What values can we put in an object?
Objects can contain any valid data structure - Primitives and Objects
What is another name for keys in an JavaScript object?
Keys are also known as
Properties
How can we get the value of an object property (key)?
We can use dot (.) operator (dot notation)
or
bracket [] notation
Give the syntax for using dot notation to get the value of an object property.
objectName.propertyName
aka
objectName.keyName
Give the syntax for using bracket notation to get the value of an object’s property
objectName[‘propertyName’]
note that the propertyName is a string
When do you need to use bracket notation to access the value of an object’s properties?
- When you access the value of a property with a variable.
- When the property name is an invalid identifier
How do we set the value of a property (key) in an object?
We can use either dot notation (preferred) or bracket notation
Give the syntax for setting an object property value.
objectName.propertyName = value
we can use bracket notation too
How do we delete an object key:value pair?
delete objectName.propertyName
we can use bracket notation too
If two objects hold the same information will the equate to equal using comparison opperators?
No, objects are compared by reference, not by content.
When will two variables that point to objects be equal using equality opperators?
Only when variables point to the same object, or one variable points to a variable pointing to an object, will they be equal.
When do keys (or identifiers) need quotation marks in an object literal?
Then the key or identifier contains special characters (like a space).
How do we create a method in an object literal?
Two ways:
- Set the method name with the key, and the value as an anonymous function after the colon
- Set the method name with the key, and create the function without the colon or function name
Give the syntax for the ES6 method creation in an object.
const objectName = {
methodName () { method code block } }
What does it mean that Objects are passed by reference
It means that when objects are assigned to variables, the variables hold a reference to the object’s location in memory, not that actual values. So, if we mutate a object by passing it to a function, the original object is mutated, regardless of the variable type.
Can we reassign objects that are passed as a variable into a function?
No. Because objects are passed by reference, when we pass in a object variable to a function, the function variable references the location of data, but not the original variable. Any reassignment occurs only within the function body and not outside
How can we iterate through objects?
The for … in loop with execute a given block of code for each property in an object
Are key:value pairs in objects ordered?
No, key:value pairs are not ordered in objects.
Do the methods of an object have direct access to other properties of that object.
Not directly, other properties are not contained within their scope.
You need to use the “this” keyword, which refers back to the calling object
How do we use the keyword this in object methods?
We use the keyword this in object methods to gain access to the object properties outside the scope of the method’s code block. This will refer to the calling object, and we use dot-notation to select the property value we need.
Will the keyword this work with methods written as arrow functions?
No, not without help. Arrow functions inherently bind their keyword this to the global object.
Does JavaScript have built in privacy for objects?
No
What is a conventional way of indicating that a property of an object is private in JavaScript?
We and prepend an underline “_” to the property name in an object to indicate privacy.
What is the basic use-case for a getter method in JavaScript?
A getter method is basically used to get and return the value of an internal property of an object.
What is the syntax of a getter method in JavaScript?
object {
get fullName() {
codeBlock
}}
How do we call or invoke a getter method in JavaScript?
We invoke a getter method much like we would access a regular property value of an object.
object.getterName
We do not use the get keyword or add ( ) to the call.
What are four advantages to using getter methods on objects?
- We can use the keyword this to access object properties
- We can manipulate or formate properties within the method
- We can use conditionals to return different values
- The code is easier to read and clearer
What should we keep in mind when naming properties and getter methods?
Getter methods and object properties may not share names.
What do setters do in the context of JavaScript objects?
Setters reassign the value of an object property
Describe the syntax of a setter method in a JavaScript object
objectName {
set age (newAge){
if(typeof newAge === ‘number’){
this._age = newAge
} else {
return ‘age must be a number
}}}
How do we invoke a setter method?
objectName.setterName = value
We do not use ( ) when invoking the setter
What is a factory function?
A factory function is a function used to create objects from a basic design or schema.
Instead of creating multiple object literals, we can use the factory function to create objects
What is the syntax of a factory function.
const factoryName = (property1, property2, property3) => {
return {
property1: property1,
property2: property2,
property3: property3,
aMethod() {
methodCode}
}
}
What is ‘property value shorthand’ in relation to JavaScript objects?
Property Value Shorthand is a type of destructuring available in ES6.
How do we use property value shorthand to assign values to properties in JavaScript objects?
When the property and value share their name (as in factory functions) we can list only the property name and omit the value (since it is the same).
Convert this factory function into property value shorthand:
function robotFactory(model, mobile){
return {
model: model,
mobile: mobile,
beep() {
console.log(‘Beep Boop’);
}
function robotFactory(model, mobile){
return {
model,
mobile,
beep() {
console.log(‘Beep Boop’);
}
What is a ‘destructured assignment” in relation to JavaScript objects?
A destructure assignment is a shorthand method to assign property values to a variable.
Give the syntax of a destructured assignment.
const {propertyName } = object
const will now equal propertyValue of propertyName
We still refer to the const by the propertyName
What are Object class methods?
Object class methods are methods “built-in” to the Object prototype that we can call on the Object data-type.
What are two or three common Object Class Methods that we might use?
Object.entries(objectName) = returns an array of key:value pairs
Object.keys(objectName) = returns an array of properties
Object.values(objectName) = returns an array of values of an objects properties
What is unusual about the invocation of a setter method?
When using a setter method we do not include the arguments in parenthesis - instead, we set the objectName.setterMethod = arguments