객체는 JavaScript의 기본 부분으로, 데이터 저장 및 관리를 위한 백본 역할을 합니다. 객체는 속성의 컬렉션이며 각 속성은 키(또는 이름)와 값 간의 연결입니다. 객체를 생성, 조작 및 활용하는 방법을 이해하는 것은 모든 JavaScript 개발자에게 중요합니다. 이 글에서는 JavaScript의 다양한 개체 기능을 살펴보고 이를 익히는 데 도움이 되는 자세한 설명, 예제 및 설명을 제공합니다.

JavaScript의 객체 소개

JavaScript에서 객체는 데이터 컬렉션과 더 복잡한 엔터티를 저장하는 데 사용됩니다. 객체 리터럴이나 객체 생성자를 사용하여 생성됩니다.

// Using object literals
let person = {
    name: "John",
    age: 30,
    city: "New York"
};

// Using the Object constructor
let person = new Object();
person.name = "John";
person.age = 30;
person.city = "New York";

개체 속성

• Object.prototype: 모든 JavaScript 객체는 프로토타입에서 속성과 메서드를 상속합니다.

let obj = {};
console.log(obj.__proto__ === Object.prototype); // Output: true

객체 메소드

1.객체.할당()

하나 이상의 소스 개체에서 열거 가능한 모든 자체 속성 값을 대상 개체에 복사합니다. 대상 객체를 반환합니다.

let target = {a: 1};
let source = {b: 2, c: 3};
Object.assign(target, source);
console.log(target); // Output: {a: 1, b: 2, c: 3}

2.객체.생성()

지정된 프로토타입 개체와 속성을 사용하여 새 개체를 만듭니다.

let person = {
    isHuman: false,
    printIntroduction: function() {
        console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
    }
};

let me = Object.create(person);
me.name = "Matthew";
me.isHuman = true;
me.printIntroduction(); // Output: My name is Matthew. Am I human? true

3. 객체 정의속성()

객체에서 직접 새 속성을 정의하거나 기존 속성을 수정하여 객체를 반환합니다.

let obj = {};
Object.defineProperties(obj, {
    property1: {
        value: true,
        writable: true
    },
    property2: {
        value: "Hello",
        writable: false
    }
});
console.log(obj); // Output: { property1: true, property2: 'Hello' }

4. 객체 정의속성()

객체에 직접 새 속성을 정의하거나 기존 속성을 수정하고 객체를 반환합니다.

let obj = {};
Object.defineProperty(obj, 'property1', {
    value: 42,
    writable: false
});
console.log(obj.property1); // Output: 42
obj.property1 = 77; // No error thrown, but the property is not writable
console.log(obj.property1); // Output: 42

5. 객체.항목()

주어진 객체의 열거 가능한 문자열 키 속성 [키, 값] 쌍의 배열을 반환합니다.

let obj = {a: 1, b: 2, c: 3};
console.log(Object.entries(obj)); // Output: [['a', 1], ['b', 2], ['c', 3]]

6. 객체.동결()

개체를 고정합니다. 고정된 개체는 더 이상 변경할 수 없습니다. 객체를 고정하면 새 속성이 객체에 추가되지 않고, 기존 속성이 제거되지 않으며, 기존 속성 값이 변경되는 것을 방지할 수 있습니다.

let obj = {prop: 42};
Object.freeze(obj);
obj.prop = 33; // Fails silently in non-strict mode
console.log(obj.prop); // Output: 42

7. 객체.fromEntries()

키-값 쌍 목록을 객체로 변환합니다.

let entries = new Map([['foo', 'bar'], ['baz', 42]]);
let obj = Object.fromEntries(entries);
console.log(obj); // Output: { foo: 'bar', baz: 42 }

8. Object.getOwnPropertyDescriptor()

주어진 객체의 자체 속성(즉, 객체의 프로토타입 체인이 아닌 객체에 직접 존재하는 속성)에 대한 속성 설명자를 반환합니다.

let obj = {property1: 42};
let descriptor = Object.getOwnPropertyDescriptor(obj, 'property1');
console.log(descriptor);
// Output: { value: 42, writable: true, enumerable: true, configurable: true }

9. Object.getOwnPropertyDescriptors()

객체의 모든 고유 속성 설명자를 포함하는 객체를 반환합니다.

let obj = {property1: 42};
let descriptors = Object.getOwnPropertyDescriptors(obj);
console.log(descriptors);
/* Output:
{
  property1: {
    value: 42,
    writable: true,
    enumerable: true,
    configurable: true
  }
}
*/

10. 객체.getOwnPropertyNames()

주어진 객체에서 직접 발견된 모든 속성(Symbol을 사용하는 속성을 제외한 열거 불가능한 속성 포함)의 배열을 반환합니다.

let obj = {a: 1, b: 2, c: 3};
let props = Object.getOwnPropertyNames(obj);
console.log(props); // Output: ['a', 'b', 'c']

11. Object.getOwnPropertySymbols()

주어진 객체에서 직접 발견된 모든 기호 속성의 배열을 반환합니다.

let obj = {};
let sym = Symbol('foo');
obj[sym] = 'bar';
let symbols = Object.getOwnPropertySymbols(obj);
console.log(symbols); // Output: [Symbol(foo)]

12. 객체.getPrototypeOf()

지정된 객체의 프로토타입(즉, 내부 [[Prototype]] 속성 값)을 반환합니다.

let proto = {};
let obj = Object.create(proto);
console.log(Object.getPrototypeOf(obj) === proto); // Output: true

13. 객체.is()

두 값이 같은 값인지 확인합니다.

console.log(Object.is('foo', 'foo')); // Output: true
console.log(Object.is({}, {})); // Output: false

14. Object.isExtensible()

객체 확장이 허용되는지 결정합니다.

let obj = {};
console.log(Object.isExtensible(obj)); // Output: true
Object.preventExtensions(obj);
console.log(Object.isExtensible(obj)); // Output: false

15. 객체.isFrozen()

객체가 고정되었는지 확인합니다.

let obj = {};
console.log(Object.isFrozen(obj)); // Output: false
Object.freeze(obj);
console.log(Object.isFrozen(obj)); // Output: true

16. 객체.isSealed()

객체가 봉인되었는지 확인합니다.

let obj = {};
console.log(Object.isSealed(obj)); // Output: false
Object.seal(obj);
console.log(Object.isSealed(obj)); // Output: true

17. 객체.키()

주어진 객체의 열거 가능한 속성 이름의 배열을 반환하며 일반 루프와 동일한 순서로 반복됩니다.

let obj = {a: 1, b: 2, c: 3};
console.log(Object.keys(obj)); // Output: ['a', 'b', 'c']

18. Object.preventExtensions()

개체의 확장을 방지합니다.

let obj = {};
Object.preventExtensions(obj);
obj.newProp = 'test'; // Throws an error in strict mode
console.log(obj.newProp); // Output: undefined

19. 객체.씰()

객체를 봉인하여 새 속성이 객체에 추가되는 것을 방지하고 모든 기존 속성을 구성 불가능으로 표시합니다. 현재 속성의 값은 쓰기 가능한 한 계속 변경할 수 있습니다.

let obj = {property1: 42};
Object.seal(obj);
obj.property1 = 33;
delete obj.property1; // Throws an error in strict mode
console.log(obj.property1); // Output: 33

20. Object.setPrototypeOf()

지정된 객체의 프로토타입(즉, 내부 [[Prototype]] 속성)을 다른 객체 또는 null로 설정합니다.

let proto = {};
let obj = {};
Object.setPrototypeOf(obj, proto);
console.log(Object.getPrototypeOf(obj) === proto); // Output: true

21. 객체.값()

for...in 루프에서 제공하는 것과 동일한 순서로 특정 객체의 열거 가능한 속성 값의 배열을 반환합니다.

let obj = {a: 1, b: 2, c: 3};
console.log(Object.values(obj)); // Output: [1, 2, 3]

실제 사례

예 1: 객체 복제

객체를 복제하려면 Object.sign()을 사용합니다.

let obj = {a: 1, b: 2};
let clone = Object.assign({}, obj);
console.log(clone); // Output: {a: 1, b: 2}

예 2: 객체 병합

객체를 병합하려면 Object.sign()을 사용하세요.

let obj1 = {a: 1, b: 2};
let obj2 = {b: 3, c: 4};
let merged = Object.assign({},

 obj1, obj2);
console.log(merged); // Output: {a: 1, b: 3, c: 4}

예제 3: 지정된 프로토타입을 사용하여 객체 생성

Object.create()를 사용하여 지정된 프로토타입으로 객체를 생성합니다.

let proto = {greet: function() { console.log("Hello!"); }};
let obj = Object.create(proto);
obj.greet(); // Output: Hello!

예제 4: 불변 속성 정의

Object.defineProperty()를 사용하여 불변 속성을 정의합니다.

let obj = {};
Object.defineProperty(obj, 'immutableProp', {
    value: 42,
    writable: false
});
console.log(obj.immutableProp); // Output: 42
obj.immutableProp = 77; // Throws an error in strict mode
console.log(obj.immutableProp); // Output: 42

예제 5: 객체를 배열로 변환

Object.entries()를 사용하여 객체를 키-값 쌍의 배열로 변환합니다.

let obj = {a: 1, b: 2, c: 3};
let entries = Object.entries(obj);
console.log(entries); // Output: [['a', 1], ['b', 2], ['c', 3]]

결론

객체는 JavaScript의 핵심 구성 요소로, 데이터를 관리하고 조작하는 유연한 방법을 제공합니다. 객체 기능을 익히면 복잡한 작업을 쉽게 수행하고 보다 효율적이고 유지 관리가 쉬운 코드를 작성할 수 있습니다. 이 포괄적인 가이드는 JavaScript의 가장 중요한 객체 기능을 다루었으며 자세한 예제와 설명도 포함되어 있습니다. 이러한 기능을 사용하는 방법을 연습하고 다양한 사용 사례를 실험하여 이해도를 높이고 코딩 기술을 향상시키세요.