
Overview
In JavaScript, there are numerous methods used to manage an object by accessing, changing, or returning properties.
JavaScript Object.defineProperty()
The Object.defineProperty() method can be used to:
- Add a new property to an object
- Change property values
- Change property metadata
- Change object getters and setters
Syntax:
Object.defineProperty(object, property, descriptor)
Adding a new property:
// create target object
const person = {
firstName: "Johnny",
lastName: "Shay",
age: 12
};
// add a property
Object.defineProperty(person, "year", {value:"2013"}); // adds the property year which equals 2013
Changing a property value:
// create target object
const person = {
firstName: "Johnny",
lastName: "Shay",
age: 12
};
// add a property
Object.defineProperty(person, "firstName", {value : "Marty"}); // changes the property firstName to Marty
Changing Property Meta Data
All properties have a name and value, and can have attributes such as enumerable, configurable, and writable.
Setting an attribute to true:
- writable : true // property value can be changed
- enumerable : true // property can be enumerated
- configurable : true // property can be reconfigured
Setting an attribute to false:
- writable : false // property value can not be changed
- enumerable : false // property can be not enumerated
- configurable : false // property can be not reconfigured
// create target object
const person = {
firstName: "Johnny",
lastName: "Shay",
age: 12
};
// make age read only
Object.defineProperty(person, "age", {writable:false});
JavaScript getOwnPropertyNames()
The Object.getOwnPropertyNames() method can list object properties.
Syntax:
Object.defineProperty(object, property, descriptor)
List all object properties:
// create target object
const person = {
firstName: "Johnny",
lastName: "Shay",
age: 12
};
// get all properties
Object.getOwnPropertyNames(person); // firstName,lastName,age
JavaScript Object.keys()
The Object.keys() method can list enumerable object properties.
Syntax:
Object.keys(object)
List all object properties:
// create target object
const person = {
firstName: "Johnny",
lastName: "Shay",
age: 12
};
// get all properties
Object.getOwnPropertyNames(person); // firstName,lastName,age
Adding Getters and Setters
The Object.defineProperty() method can be used to add Getters and Setters to an Object.
// create target object
const person = {
firstName: "Johnny",
lastName: "Shay",
age: 12
};
// Define a getter
Object.defineProperty(person, "fullName", {
get: function () {return this.firstName + " " + this.lastName;}
});
JavaScript Notes:
- When using JavaScript, single or double quotation marks are acceptable and work identically to one another; choose whichever you prefer, and stay consistent
- JavaScript is a case-sensitive language; firstName is NOT the same as firstname
- JavaScript variables are case sensitive (x is not the same as X)
- Arrays count starting from zero NOT one; so item 1 is position [0], item 2 is position [1], and item 3 is position [2] … and so on
- JavaScript variables must begin with a letter, $, or _
We’d like to acknowledge that we learned a great deal of our coding from W3Schools and TutorialsPoint, borrowing heavily from their teaching process and excellent code examples. We highly recommend both sites to deepen your experience, and further your coding journey. We’re just hitting the basics here at 1SMARTchicken.
