[Javascript 200] 배열과 객체

배열과 객체는 비슷한 친구들이다.

 

생성방법

 

let arr_toystory = [ 'Buzz', 'Woody', 'Jessie']

let obj_toystory = { 
	Firstname: 'Buzz',
    Lastname: 'Lightyear',
    members : {},
    addFamily: function(age, name, role){
    	this.members[role] = {
        	age: age,
            name: name
        };
    },
    getHeadcount: function(){
    	return Object.keys(this.members).length;
    }
};

 

배열 let arr = [ 값 , 값 ]

객체 let ojb = { 키:값 , 키:값 }

 

- 둘 다 콤마(',')로 각 값을 구분한다. 즉, 형식이 비슷하다.

 

 

 

 

---

불러오기 (접근)

 

//불러오기(접근)
console.log(arr_toystory[0]);
console.log(obj_toystory['Firstname']);
console.log(obj_toystory.Firstname);

배열 불러오기	객체 불러오기
- 배열변수이름[인덱스번호] arr_toystory[0]  //Buzz	- 객체변수이름[프로퍼티키] 1) obj_toystory['Firstname'] //Buzz 2) obj_toystory.Firstname //Buzz

 

 

  >변수 내 프로퍼키 값이 객체일 경우

// 객체에 접근하기
var printMembers = function() {
    var members = obj_toystory.members; //토이스토리 객체 안의 members 키
    for (role in members) { //member 객체 안에 role이라는 키
        console.log(`role: ${role}, age: ${members[role].age}, name: ${members[role].name}`);
        //members.role.name 은 안된다.
        //this.role.name도 안된다. -> 이건 내가 this에 대해 잘 몰라서 그런 듯
    }
};
printMembers();

 

- 해당 객체의 프로퍼티키를 불러와서(obj_toystory.members) 변수(members)에 넣어서 다시 불러와야한다.

즉, 일차적으로만 들어갈 수 있고 2차, 3차까지 들어가진 못한다.

 

console.log(obj_toystory.members)  //일반 값을 호출할 땐 ()사용 안함
console.log(obj_toystory[members]) //객체 내 객체는 호출이 안됨.

 

- 또한, 호출 시 []를 사용하면 undefiend가 뜸. 객체 내 객체는 불러올 수 없다.

고로, 콤마('.')를 사용할 것

 

 

---

속성추가

 

// 객체에 값 넣기
obj_toystory.addFamily('Secrit', 'Woody' , 'cowboy');
obj_toystory.addFamily('Secrit', 'Jessie' , 'cowgirl');

 

- addFamily라는 함수를 정의해놨으므로 해당 함수를 이용해서 값을 넣어준다.

 

 

 

//새로운 멤버 추가
var members = obj_toystory.members
members.dog = {age: 'unknown', name:'slinky'}
console.log(obj_toystory.members)

 

- 값을 추가하거나 변경하기 위해서 접근할 때에도 불러오기 방법과 동일하게 표기한 후 연산자(=)를 통해 값을 넣어준다.

 

 

 

 

---

삭제

 

//삭제
delete members.cowgirl;
console.log(members);

delete arr_toystory[2];
console.log(arr_toystory);

 

- delete 객체변수이름[프로퍼티키]를 넣으면 된다.

 

 

 

 

 

---

참고

- JS의 객체와 매우 유사한 구조를 가진 JSON이라는 데이터교환형식이 있다.

- 2021.06.26 - [To infinity/Javascript 이론] - [Javascript 200] 배열과 객체 (ES6기능)