Стандартні об'єкти JavaScript: Пояснення методів призначення, значень, hasOwnProperty та getOwnPropertyNames

У JavaScript Objectтип даних використовується для зберігання пар значень ключів, і, як і Arrayтип даних, містить багато корисних методів. Це кілька корисних методів, які ви будете використовувати під час роботи з об’єктами.

Метод призначення об’єкта

Object.assign()Метод використовується для

  1. додати властивості та значення до існуючого об’єкта
  2. зробити нову копію існуючого об'єкта, або
  3. об'єднати кілька існуючих об'єктів в один об'єкт.

Object.assign()Метод вимагає один в targetObjectякості параметра і може приймати необмежену кількість в sourceObjectsякості додаткових параметрів.

Тут важливо зазначити, що targetObjectпараметр буде завжди модифікований. Якщо цей параметр вказує на існуючий об'єкт, тоді цей об'єкт буде одночасно змінено та скопійовано.

Якщо ви хочете створити копію об'єкта, не змінюючи цей оригінальний об'єкт, ви можете передати порожній об'єкт {}як перший ( targetObject) параметр, а об'єкт, який потрібно скопіювати, як другий ( sourceObject) параметр.

Якщо об’єкти, передані як параметри, Object.assign()мають однакові властивості (або ключі), значення властивостей, які з’являються пізніше у списку параметрів, замінять ті, що надійшли раніше.

Синтаксис

Object.assign(targetObject, ...sourceObject);

Повернене значення

Object.assign()повертає targetObject.

Приклади

Модифікація та копіювання targetObject:

let obj = {name: 'Dave', age: 30}; let objCopy = Object.assign(obj, {coder: true}); console.log(obj); // { name: 'Dave', age: 30, coder: true } console.log(objCopy); // { name: 'Dave', age: 30, coder: true }

Копіювання targetObjectбез змін:

let obj = {name: 'Dave', age: 30}; let objCopy = Object.assign({}, obj, {coder: true}); console.log(obj); // { name: 'Dave', age: 30 } console.log(objCopy); // { name: 'Dave', age: 30, coder: true }

Об'єкти з однаковими властивостями :

let obj = {name: 'Dave', age: 30, favoriteColor: 'blue'}; let objCopy = Object.assign({}, obj, {coder: true, favoriteColor: 'red'}); console.log(obj); // { name: 'Dave', age: 30, favoriteColor: 'blue' } console.log(objCopy); // { name: 'Dave', age: 30, favoriteColor: 'red', coder: true }

Метод об'єктних значень

Object.values()Метод приймає об'єкт в якості параметра і повертає масив його значень. Це робить його корисним для побудови ланцюжка з загальними Arrayметодами , як .map(), .forEach(), і .reduce().

Синтаксис

Object.values(targetObject);

Повернене значення

Масив targetObjectзначень ( ) переданого об'єкта .

Приклади

const obj = { firstName: 'Quincy', lastName: 'Larson' } const values = Object.values(obj); console.log(values); // ["Quincy", "Larson"]

Якщо об'єкт, який ви передаєте, має в якості ключів цифри, тоді Object.value()поверне значення відповідно до числового порядку ключів:

const obj1 = { 0: 'first', 1: 'second', 2: 'third' }; const obj2 = { 100: 'apple', 12: 'banana', 29: 'pear' }; console.log(Object.values(obj1)); // ["first", "second", "third"] console.log(Object.values(obj2)); // ["banana", "pear", "apple"]

Якщо передано щось інше, ніж об’єкт Object.values(), це буде примушено до об’єкта перед поверненням як масив:

const str = 'hello'; console.log(Object.values(str)); // ["h", "e", "l", "l", "o"]

Об'єкт hasOwnProperty Метод

У Object.hasOwnProperty()методі повертає логічне значення , яке вказує , якщо об'єкт має вказане властивість.

Це зручний спосіб перевірити, чи має об'єкт вказану властивість чи ні, оскільки він відповідно повертає true / false.

Синтаксис

Object.hasOwnProperty(prop)

Повернене значення

true // or false

Приклади

Використання, Object.hasOwnProperty()щоб перевірити, чи існує властивість у даному об’єкті чи ні:

const course = { name: 'freeCodeCamp', feature: 'is awesome', } const student = { name: 'enthusiastic student', } course.hasOwnProperty('name'); // returns true course.hasOwnProperty('feature'); // returns true student.hasOwnProperty('name'); // returns true student.hasOwnProperty('feature'); // returns false

Об'єкт getOwnPropertyNames Метод

Object.getOwnPropertyNames()Метод приймає об'єкт в якості параметра і повертає масив і всіх його властивостей.

Синтаксис

Object.getOwnPropertyNames(obj)

Повернене значення

Масив рядків властивостей переданого об'єкта.

Приклади

const obj = { firstName: 'Quincy', lastName: 'Larson' } console.log(Object.getOwnPropertyNames(obj)); // ["firstName", "lastName"]

Якщо передано щось інше, ніж об’єкт Object.getOwnPropertyNames(), це буде примушено до об’єкта перед поверненням як масив:

const arr = ['1', '2', '3']; console.log(Object.getOwnPropertyNames(arr)); // ["0", "1", "2", "length"]

Promise.prototype. then

Promise.prototype.thenФункція приймає два аргументи і повертає обіцянку.

Перший аргумент - це обов’язкова функція, яка приймає один аргумент. Успішне виконання обіцянки спричинить цю функцію.

The second argument is an optional function that also accepts one argument of its own. A thrown Error or Rejection of a Promise will trigger this function.

 function onResolved (resolvedValue) { /* * access to resolved values of promise */ } function onRejected(rejectedReason) { /* * access to rejection reasons of promise */ } promiseReturningFunction(paramList) .then( // then function onResolved, [onRejected] );

Promise.prototype.then allows you to perform many asynchronous activities in sequence. You do this by attaching one then function to another separated by a dot operator.

 promiseReturningFunction(paramList) .then( // first then function function(arg1) { // ... return someValue; } ) ... .then( // nth then function function(arg2) { // ... return otherValue; } )

Map.prototype.entries

Returns a new Iterator object that contains the [key, value] pairs for each element in the Map object in insertion order.

Syntax

myMap.entries()

Example

const myMap = new Map(); myMap.set('foo',1); myMap.set('bar',2); myMap.set('baz',3); var iterator = myMap.entries(); console.log(iterator.next().value); // ['foo', 1] console.log(iterator.next().value); // ['bar', 2] console.log(iterator.next().value); // ['baz', 3]

More info on objects in JavaScript:

  • How to create objects in JavaScript
  • How to loop through objects in JavaScript

More info about booleans:

  • Booleans in JavaScript