[JS] 객체의 키, 데이터 가져오기
- 프론트/자바스크립트
- 2024. 7. 22.
Object (객체)
여러가지 {`Key`:`Value`} 를 하나의 변수에 저장할 수 있는 데이터 타입을 `객체(Object)` 라고 한다.
간단한 객체 예시
let person = {
name: "홍길동",
age: 30,
gender: "남자",
}
각각의 `Key`로 데이터에 접근할 수 있고, `Key`자체를 구할수도 있다.
Key를 구하는법 | Object.Keys()
let keys = Object.keys(person);
console.log("keys => ", keys);
// 출력: keys => [ 'name', 'age', 'gender' ]
- `Object.keys()` : 인자로 객체를 넣어주면 해당 객체의 `Key`들을 배열 형태로 반환한다.
Value를 구하는법 | Object.Values()
let values = Object.values(person);
console.log("values => ", values);
// 출력: values => [ '홍길동', 30, '남자' ]
- `Object.values()` : 인자로 객체를 넣어주면 해당 객체의 `Value`들을 배열 형태로 반환한다.
Value 접근하기
위의 방법들은 `Keys`, `Values`의 데이터를 확인하는 방법이고 수정하려면 다음과 같이 접근하면 된다.
person.name = "나그네";
console.log(person.name);
// 출력: 나그네
- `object.key`: 해당하는 `Key`의 `Value`값에 접근한다. 일반 변수처럼 데이터의 확인 및 변경이 가능하다.
Key와 Value를 묶어서 배열로 가져오기 | Object.Entries()
`Keys()`, `Values()` 는 각각 따로 가져오지만 `Entries()`를 사용하면 `key`, `value`를 묶어서 배열로 가져온다. (2차원 배열)
let entries = Object.entries(person);
console.log(entries);
// 출력: [ [ 'name', '나그네' ], [ 'age', 30 ], [ 'gender', '남자' ] ]
- 끝 -
'프론트 > 자바스크립트' 카테고리의 다른 글
[JS] Promise | 기기기~초초초 개념 (0) | 2024.07.24 |
---|---|
[JS] 객체 데이터 비교하기 (0) | 2024.07.23 |
[JS] filter() | 배열을 걸러보자 (0) | 2024.07.08 |
[JS] 화살표함수 | 난해하다 난해해 (0) | 2024.07.01 |
[JS] reduce() | 배열의 합을 구해보자 (0) | 2024.07.01 |