자바스크립트 객체(Object)

1. 객체 선언과 사용

var 객체이름 = {
property 이름1 : property값,
property 이름2 : property값
};

• 객체는 { }(중괄호)로 감싸져 있고,
• , 로 구분된 이름/값 쌍들이
• 쉽표로 분리된 목록의 형태입니다.

객체 = 이름 : 값 으로 구성된 프로퍼티들의 집합

1-1. 객체 생성의 규칙

• property 이름은 중복될 수 없다.
• property 이름과 propert 값 사이에 :(콜론)으로 구분한다.
• property를 추가할 때는 ,(쉼표)를 붙여준다.
• property 값에는 어느 type이나 가능하다(string, number, array, object, function...)

1-2. 객체의 property값 접근하기

[1] 객체이름.프로퍼티이름
[2] 객체이름["프로퍼티이름"]

• [1] 마침표(.) 연산자를 사용하며, 접근하려는 객체명은 왼쪽에, 프로퍼티명은 오른쪽에 위치합니다.
• [2] 대괄호([ ])를 사용하여, 접근하려는 객체명은 왼쪽에, 프로퍼티명은 쌍따옴표(" ")와 함께 대괄호 안에 작성합니다.

<script>
let plan = {
   name : "성정민",
   age : 26
};
console.log(plan.name);
console.log(plan["name"]);
</script>

1-3. 대괄호로 접근할 경우

마침표로 객체에 접근하는게 더 쉬워보이는데,
대괄호로 접근하는 이유가 뭘까요?

대괄호 안에는 "변수"가 들어갈 수 있습니다.

예를들어 plan 객체의 name이라는 프로퍼티에 접근하고 싶을 때, 아래와 같이 사용할 수 있습니다.

<script>
let plan = {
   name : "성정민",
   age : 26
};
let propertyName = "name"; //변수로 만들기
console.log(plan[propertyName]);
</script>

아래의 코드에서 어떻게 객체의 프로퍼티에 접근했는데 확인해보세요

<script>
let myObj = {
   property1 : "hello",
   property2 : [1,2,3,4,5],
   property3 : {
      childproperty: "hey"
   }
};
//대괄호로 객체에 접근
let name = "property";
console.log(mtObj[name+"1"])
console.log(mtObj[name+"2"])
console.log(mtObj[name+"3"])
console.log(mtObj[name+"3"]["child"=name]);
//. 으로 객체에 접근
console.log(myObj.property1);
console.log(myObj.property2);
console.log(myObj.property3);
console.log(myObj.property3.childproperty);
</script>

1-4. 객체 프로퍼티값 수정하기

객체를 정의한 후에야 property값을 수정할 수 있습니다.

<script>
let name = "property1";
myObj[name]
</script>