javascript

JavaScript 자바스크립트 객체(Object) 메서드 및 반복문 사용법

by

자바스크립트 객체 메서드

자바스크립트에서 객체를 다루는 것은 프로그래밍에서 중요한 부분 중 하나입니다. 여러 가지 내장 메서드를 사용하여 객체를 조작할 수 있습니다.

주요 객체 메서드

Object.keys(obj)

객체의 속성 이름들을 배열로 반환합니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };
const keys = Object.keys(myObject);
console.log(keys); // ['a', 'b', 'c']
JavaScript

Object.values(obj)

객체의 속성 값들을 배열로 반환합니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };
const values = Object.values(myObject);
console.log(values); // [1, 2, 3]
JavaScript

Object.entries(obj)

객체의 속성과 값의 쌍을 배열로 반환합니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };
const entries = Object.entries(myObject);
console.log(entries); // [['a', 1], ['b', 2], ['c', 3]]
JavaScript

Object.assign(target, source)

여러 객체를 결합하여 하나의 객체로 만듭니다.

JavaScript
const targetObject = { a: 1, b: 2 };
const sourceObject = { b: 3, c: 4 };
Object.assign(targetObject, sourceObject);
console.log(targetObject); // { a: 1, b: 3, c: 4 }
JavaScript

Object.hasOwnProperty(prop)

객체가 특정 속성을 직접 소유하고 있는지 여부를 확인합니다.

JavaScript
const myObject = { a: 1, b: 2 };
console.log(myObject.hasOwnProperty('a')); // true
console.log(myObject.hasOwnProperty('c')); // false
JavaScript

Object.freeze(obj)

객체를 동결하여 새로운 속성 추가와 이미 존재하는 속성 삭제, 수정이 모두 금지됩니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };
Object.freeze(myObject);

// 아래의 작업들은 모두 에러를 발생시킵니다.
myObject.a = 4; // 에러: Cannot assign to read-only property 'a'
myObject.b = 5; // 에러: Cannot assign to read-only property 'b'
myObject.c = 6; // 에러: Cannot assign to read-only property 'c'
myObject.d = 7; // 에러: Cannot add property 'd', object is not extensible
delete myObject.a; // 에러: Cannot delete property 'a' of #<Object>

console.log(myObject); // { a: 1, b: 2, c: 3 }
JavaScript

Object.seal(obj)

객체를 밀봉하여 새로운 속성 추가와 이미 존재하는 속성 삭제가 금지됩니다. 그러나 속성 값은 변경 가능합니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };
Object.seal(myObject);

// 아래의 작업들은 모두 에러를 발생시킵니다.
myObject.a = 4; // 에러: Cannot assign to read-only property 'a'
myObject.b = 5; // 에러: Cannot assign to read-only property 'b'
myObject.c = 6; // 에러: Cannot assign to read-only property 'c'
myObject.d = 7; // 에러: Cannot add property 'd', object is not extensible
delete myObject.a; // 에러: Cannot delete property 'a' of #<Object>

// 아래의 작업들은 에러를 발생시키지 않고 값이 변경됩니다.
myObject.a = 10;
myObject.b = 20;
myObject.c = 30;

console.log(myObject); // { a: 10, b: 20, c: 30 }
JavaScript

객체 반복문

자바스크립트에서 객체를 반복하는 방법에는 여러 가지가 있습니다. 가장 흔한 방법은 for…in 루프를 사용하는 것이지만, Object.keys(), Object.values(), Object.entries() 메서드를 활용하는 방법도 있습니다.

for…in 루프

for…in 루프는 객체의 열거 가능한 속성들을 반복합니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };

for (const key in myObject) {
  console.log(`${key}: ${myObject[key]}`);
}
// 출력:
// a: 1
// b: 2
// c: 3
JavaScript

Object.keys() 메서드 반복

Object.keys() 메서드는 객체의 키 목록을 반환하므로, 이를 이용하여 반복할 수 있습니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };

const keys = Object.keys(myObject);
for (const key of keys) {
  console.log(`${key}: ${myObject[key]}`);
}
// 출력:
// a: 1
// b: 2
// c: 3
JavaScript

Object.values() 메서드 반복

Object.values() 메서드는 객체의 값 목록을 반환하므로, 이를 이용하여 반복할 수 있습니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };

const values = Object.values(myObject);
for (const value of values) {
  console.log(value);
}
// 출력:
// 1
// 2
// 3
JavaScript

Object.entries() 메서드 반복

Object.entries() 메서드는 객체의 키-값 쌍 목록을 반환하므로, 이를 이용하여 반복할 수 있습니다.

JavaScript
const myObject = { a: 1, b: 2, c: 3 };

const entries = Object.entries(myObject);
for (const [key, value] of entries) {
  console.log(`${key}: ${value}`);
}
// 출력:
// a: 1
// b: 2
// c: 3
JavaScript

결론

자바스크립트 객체 메서드와 반복문을 통해 객체를 효과적으로 다룰 수 있습니다. 또한 객체의 속성 및 구조를 다양한 방식으로 관리하고 상호작용할 수 있도록 도와줍니다. 이를 통해 코드의 가독성을 높이고 유지보수성을 향상 시킬 수 있습니다.

Leave a Comment