자바스크립트에서 Object.keys()의 사용법은 무엇인가요?
_____A1: Object.keys()는 주어진 객체의 열거 가능한(Enumerables) 속성 이름(key)들을 배열 형태로 반환하는 자바스크립트 내장 함수입니다.
Q2: Object.keys()의 기본 사용법은 어떻게 되나요?
A2:
```javascript
const obj = {a: 1, b: 2, c: 3};
const keys = Object.keys(obj);
console.log(keys); // ['a', 'b', 'c']
```
객체 `obj`의 속성 이름들만 배열로 반환합니다.
Q3: Object.keys()가 반환하는 배열에는 어떤 값들이 포함되나요?
A3: 해당 객체의 자신의 열거 가능한 속성 이름(String 형태)만 포함됩니다. 상속된 프로퍼티나 Symbol 키는 포함되지 않습니다.
Q4: 객체에 상속된 키도 포함되나요?
A4: 아니요. Object.keys()는 직접 객체에 정의된(own property) 열거 가능한 키만 반환합니다. 상속된 프로퍼티는 제외됩니다.
Q5: 배열에 Object.keys()를 사용하면 어떤 결과가 나오나요?
A5: 배열도 객체이므로 인덱스 번호(문자열 타입)들이 키로 반환됩니다. 예:
```javascript
const arr = ['a', 'b'];
```
Q6: 빈 객체에 Object.keys()를 사용하면 어떻게 되나요?
A6: 빈 배열 `[]`가 반환됩니다.
Q7: Object.keys()와 Object.getOwnPropertyNames()의 차이는 무엇인가요?
A7:
- Object.keys(): 열거 가능한 속성 이름만 반환합니다.
- Object.getOwnPropertyNames(): 열거 가능 여부와 상관없이 모든 자신의 속성 이름을 반환합니다.
Q8: 객체에 Symbol 키가 있는 경우 Object.keys()는 어떻게 처리하나요?
A8: Symbol 타입의 키는 Object.keys()로는 반환되지 않습니다. Symbol 키를 얻으려면 Object.getOwnPropertySymbols()를 사용해야 합니다.
Q9: 객체가 null 혹은 undefined면 Object.keys()는 어떻게 되나요?
A9: TypeError가 발생합니다. 반드시 객체 타입이어야 하며 null과 undefined는 불가능합니다.
Q10: Object.keys()는 객체를 변경하나요?
A10: 아니요, 객체를 전혀 변경하지 않고 키 배열만 반환합니다.
---
이와 같이 Object.keys()는 객체의 자신의 열거 가능한 속성 이름을 배열 형태로 간편하게 추출할 때 유용하며, 상속 프로퍼티, Symbol 키 등은 포함하지 않는다는 점을 염두에 두어야 합니다.
이 메서드는 ES5(ECMAScript
5)에서 도입되었으며, 객체의 키를 쉽게 가져와서 다양한 작업에 활용할 수 있도록 도와줍니다.
아래에서 `Object.keys()`의 사용법과 다양한 예제를 통해 자세히 설명하겠습니다.
기본 사용법 `Object.keys()` 메서드는 다음과 같은 형식으로 사용됩니다: ```javascript Object.keys(obj); ``` 여기서 `obj`는 키를 얻고자 하는 객체입니다.
이 메서드는 객체의 열거 가능한 속성 이름을 문자열 배열로 반환합니다.
반환되는 배열은 객체의 속성이 정의된 순서에 따라 정렬됩니다.
예제 1. 기본 예제 ```javascript const person = { name: 'Alice', age: 25, city: 'New York' }; const keys = Object.keys(person); console.log(keys); // ['name', 'age', 'city'] ``` 위의 예제에서 `Object.keys(person)`을 호출하면 `person` 객체의 키인 `name`, `age`, `city`가 포함된 배열이 반환됩니다.
2. 빈 객체 빈 객체를 전달하면 빈 배열이 반환됩니다.
```javascript const emptyObject = {}; const keys = Object.keys(emptyObject); console.log(keys); // [] ```
3. 열거 가능한 속성만 반환 `Object.keys()`는 객체의 열거 가능한 속성만 반환합니다.
즉, 프로토타입 체인에 있는 속성이나 비열거 속성은 포함되지 않습니다.
```javascript const obj = Object.create({ inheritedProp: 'inherited' }); obj.ownProp = 'own'; console.log(Object.keys(obj)); // ['ownProp'] ```
4. 배열과 함께 사용하기 `Object.keys()`는 배열에도 사용할 수 있습니다.
배열은 객체의 일종이기 때문에 배열의 인덱스가 키로 간주됩니다.
```javascript const arr = ['apple', 'banana', 'cherry']; const keys = Object.keys(arr); console.log(keys); // ['0', '1', '2'] ```
5. 객체의 속성 값과 함께 사용하기 `Object.keys()`와 `Array.prototype.map()`을 조합하여 객체의 키와 값에 접근할 수 있습니다.
```javascript const car = { make: 'Toyota', model: 'Camry', year: 2020 }; const entries = Object.keys(car).map(key => `${key}: ${car[key]}`); console.log(entries); // ['make: Toyota', 'model: Camry', 'year: 2020'] ``` 주의사항 - `Object.keys()`는 객체의 속성이 문자열 또는 심볼일 때만 작동합니다.
숫자형 키는 문자열로 변환되어 반환됩니다.
- 객체의 키 순서는 다음과 같은 규칙에 따라 결정됩니다: 1. 정수형 키 (0, 1, 2, ...)가 오름차순으로 정렬됩니다.
2. 문자열 키가 정의된 순서대로 정렬됩니다.
3. 심볼 키가 정의된 순서대로 정렬됩니다.
결론 `Object.keys()`는 JavaScript에서 객체의 키를 배열로 반환하는 유용한 메서드입니다.
이를 통해 객체의 속성에 쉽게 접근하고, 다양한 작업을 수행할 수 있습니다.
객체의 열거 가능한 속성만 반환하므로, 객체의 구조를 이해하고 조작하는 데 매우 유용합니다.
다양한 예제를 통해 `Object.keys()`의 사용법을 익히고, 실제 코드에서 활용해 보세요!
작성자:
김채현 [비회원]
| 작성일자: 1년 전
2024-09-08 14:47:26
조회수: 277 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
조회수: 277 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.