|
1 | 1 | # Objects
|
| 2 | +It is a collection of `keys:values` |
| 3 | + |
2 | 4 | We can see an object as the organized representation of "something".
|
3 | 5 | Objects in JS are dynamic... You can add and/or remove properties and methods in an existing object.
|
4 | 6 |
|
@@ -290,3 +292,99 @@ console.log(person);
|
290 | 292 | // }
|
291 | 293 | ```
|
292 | 294 |
|
| 295 | +A similar example using a `Constructor function` and `Object.defineProperty()` (getters and setters) |
| 296 | + |
| 297 | +```js |
| 298 | +function Person(name) { |
| 299 | + this.name = name; |
| 300 | + |
| 301 | + Object.defineProperty(this, 'name', { |
| 302 | + get() { |
| 303 | + return name; |
| 304 | + }, |
| 305 | + set(value) { |
| 306 | + name = value; |
| 307 | + } |
| 308 | + }); |
| 309 | +} |
| 310 | + |
| 311 | +const peter = new Person('Peter'); |
| 312 | + |
| 313 | +console.log(peter); |
| 314 | +// Person { name: [Getter/Setter] } |
| 315 | + |
| 316 | +console.log(peter.name); |
| 317 | +// Peter |
| 318 | + |
| 319 | +peter.name = 'Paul'; |
| 320 | + |
| 321 | +console.log(peter.name); |
| 322 | +// Paul |
| 323 | +``` |
| 324 | + |
| 325 | +## Property descriptors |
| 326 | + |
| 327 | +We can use `Object.getOwnPropertyDescriptors(obj)` to get the `property descriptors` of a given object. |
| 328 | + |
| 329 | +```js |
| 330 | +function Person(name) { |
| 331 | + this.name = name; |
| 332 | +} |
| 333 | + |
| 334 | +const peter = new Person("Peter"); |
| 335 | + |
| 336 | +Object.getOwnPropertyDescriptors(peter); |
| 337 | + |
| 338 | +// { |
| 339 | +// name: { |
| 340 | +// value: 'Peter', |
| 341 | +// writable: true, |
| 342 | +// enumerable: true, |
| 343 | +// configurable: true |
| 344 | +// } |
| 345 | +// } |
| 346 | +``` |
| 347 | + |
| 348 | +Notes: |
| 349 | +1. `value` is the value associated with the property |
| 350 | +2. `writable` if the value can be changed |
| 351 | +3. `enumerable` if its showed during enumerations (like looping) |
| 352 | +4. `configurable` if we can delete the member or not |
| 353 | + |
| 354 | +We can use `Object.defineProperty()` to set the `property descriptors attributes`: |
| 355 | +* value |
| 356 | +* writable |
| 357 | +* get |
| 358 | +* set |
| 359 | +* configurable |
| 360 | +* enumerable |
| 361 | + |
| 362 | +```js |
| 363 | +function Person(name) { |
| 364 | + this.name = name; |
| 365 | + |
| 366 | + Object.defineProperty(this, 'name', { |
| 367 | + writable: false, |
| 368 | + enumerable: false, |
| 369 | + value: 'Mike', |
| 370 | + configurable: false |
| 371 | + }); |
| 372 | +} |
| 373 | + |
| 374 | +let person = new Person('Peter'); |
| 375 | +person.name = 'Paul'; |
| 376 | +console.log(person.name); |
| 377 | +// Mike |
| 378 | + |
| 379 | +Object.keys(person); |
| 380 | +// [] |
| 381 | + |
| 382 | +delete person.name; |
| 383 | +// false |
| 384 | +``` |
| 385 | + |
| 386 | +In the previous example... |
| 387 | +1. We will not be able to change the value |
| 388 | +2. We will not be able to list the property name |
| 389 | +3. We will set Mike as the value |
| 390 | +4. We will not be able to delete the property |
0 commit comments