객체와 학생 목록

관련 정보를 하나로 묶기

객체는 이름이 붙은 여러 속성을 하나로 묶습니다. 학생의 이름과 점수를 따로 관리할 수도 있지만, { name: "민지", score: 80 }처럼 하나의 객체에 담으면 어느 점수가 누구의 것인지 함께 표현할 수 있습니다. name과 score는 속성 이름이고, 콜론 오른쪽은 각 속성의 값입니다.

student.name처럼 점 뒤에 속성 이름을 적으면 값을 읽을 수 있습니다. student.score = 85;처럼 대입하면 기존 속성을 수정합니다. 대괄호 표기인 student[key]도 사용할 수 있습니다. 이때 key의 값이 "name"이면 student.name과 같은 속성을 읽습니다.

실행 예제와 결과

const student = {
  name: "민지",
  score: 80
};

console.log("이름", student.name);
console.log("처음 점수", student.score);
student.score = 85;
console.log("수정한 점수", student.score);

const key = "name";
console.log("키로 조회", student[key]);

const students = [
  student,
  { name: "지우", score: 92 },
  { name: "하늘", score: 76 }
];

for (let index = 0; index < students.length; index = index + 1) {
  console.log(`${students[index].name}: ${students[index].score}점`);
}

처음 점수는 80이지만 속성을 수정한 뒤에는 85입니다. students 배열의 첫 항목은 앞에서 만든 student 객체이므로 반복 출력에서도 민지의 점수는 85입니다. students[index]로 현재 학생 객체를 얻고, 그 뒤에 .name이나 .score를 붙여 속성을 읽습니다. 배열을 순회하면서 각 학생의 정보를 한 줄씩 보여 주는 구조입니다.

객체를 수정할 때의 주의점

student를 const로 선언했어도 객체 내부 속성을 바꾸는 것은 가능합니다. const가 막는 것은 student = 다른값처럼 이름에 새 값을 재할당하는 일입니다. 따라서 속성 변경이 다른 곳에도 영향을 줄 수 있는지 살펴야 합니다. 이 예제에서 배열의 첫 항목과 student는 같은 객체를 가리킵니다.

없는 속성을 읽으면 undefined가 나옵니다. 예를 들어 student.age를 만들지 않았다면 나이를 숫자처럼 계산할 수 없습니다. 점 표기법은 적어 놓은 속성 이름을 그대로 사용하고, 대괄호 안의 변수는 그 변수가 가진 값을 속성 이름으로 사용합니다. student.key는 key라는 이름의 속성을 읽으므로 student[key]와 다를 수 있습니다.

이름표와 실제 객체를 구분하기

객체는 관련된 값을 속성 이름으로 묶습니다. student.name은 객체 전체를 출력하는 것이 아니라 name이라는 속성 하나를 읽는 표현입니다. 대괄호 표기는 속성 이름을 변수로 전달할 수 있다는 차이가 있습니다. const key = "name";일 때 student[key]는 student.name과 같은 속성을 읽습니다. student.key라고 쓰면 문자열 “name”이 아니라 실제로 key라는 이름의 속성을 찾게 됩니다.

표현	읽는 대상	예제의 결과
student.name	name 속성	민지
student[key]	key 변수에 담긴 이름의 속성	민지
student.score	수정한 score 속성	85

student는 const로 선언했지만 student.score = 85;는 가능합니다. 이름 student에 다른 객체를 재할당한 것이 아니라 기존 객체의 속성을 바꿨기 때문입니다. 따라서 const라는 이유만으로 객체 내부가 읽기 전용이라고 생각하면 안 됩니다.

예제의 students 배열 첫 칸에는 student가 가리키는 객체가 들어갑니다. 두 곳에서 같은 학생을 볼 수 있다고 해서 서로 독립적인 사본 두 개가 만들어진 것은 아닙니다. 배열을 만든 뒤 그 첫 학생의 점수를 바꾸면 다른 이름으로 읽어도 변경된 속성이 보일 수 있습니다. 여러 곳에서 같은 정보를 수정하는 프로그램에서는 이런 공유 관계를 먼저 파악해야 합니다. 이번 강의는 속성 조회와 변경에 집중하며, 객체를 깊게 복사하는 방법은 별도의 주제로 구분합니다.

연습문제와 해설

이름이 "서준"이고 점수가 70인 학생 객체를 만든 뒤 점수를 75로 수정하고 이름과 점수를 출력해 보세요. 객체를 const로 선언해도 student.score = 75;처럼 속성을 수정할 수 있습니다. 예상 출력은 이름 서준과 점수 75입니다.

학생 객체 두 개를 배열에 넣고 반복문으로 이름만 출력해 보세요. 각 반복에서 students[index].name을 읽으면 됩니다. 인덱스는 0에서 시작하고 조건은 배열 길이보다 작도록 작성합니다. 배열은 학생들의 순서를 관리하고 객체는 각 학생의 서로 다른 정보를 묶는 역할을 합니다.