[JS] 객체

객체 선언/ 호출

• 객체는 키 값을 사용하여 속성(멤버 변수) 식별
• 객체 생성자 혹은 중괄호를 사용하여 객체 생성
• ‘[ ](대괄호)’ 또는 ‘.’(점)으로 요소의 값에 접근
• 속성에 모든 자료형이 올 수 있다. 그 중 함수 자료형인 요소:메소드
• 객체 내에서 자신의 속성을 호출 할 때 반드시 this키워드를 사용
• 객체의 모든 속성을 출력하려면 for in문을 사용해야 한다.
  -> 단순 for문이나 while문으로 출력 불가
• -> 식별자로 사용할 수 없는 문자(띄어쓰기, 특수문자)를 속성으로 사용할 경우
  ‘ ‘로 묶어서 선언하고, 접근 시에는 [ ]만 가능

 

객체 선언하는 방법

let 변수명(객체명) = {
	속성(키값) : 값,
	속성(키값) : 값,
	속성(키값) : 값
};

 

속성값 접근

	변수명(객체명)[‘요소명(키값)’];
	변수명(객체명)[‘요소명(키값)’];
또는
	변수명(객체명).요소명(키값);
	변수명(객체명).요소명(키값);

 

객체 속성 추가 및 삭제

- 속성 및 메소드를 동적으로 추가 및 삭제 가능

/* 추가 */
	변수명(객체명).속성명 = ‘값’;
	변수명(객체명).속성명 = ‘값’;
	변수명(객체명).속성명 = function(){
				메소드 로직;
				[return [리턴값]];
};

/* 삭제 */
	delete(변수명(객체명).속성명);

 

함수 활용 객체 생성

- 함수의 매개변수에 필요한 속성값을 다 받아서 객체를 생성 후 리턴

/* 함수 활용 객체 생성 */
function 함수명(value1, value2, value3, ....){
	let 변수명(객체명) = {
		속성명:‘value1’,
		속성명:‘value2’,
		....
	}
	return 변수명(객체명);
}

위 코드를 더 간단하게 줄일 수도 있다.

function 함수명 (value1, value2, ...) {
	return {
		속성명,
		속성명
    }
}

in with 키워드 

in : 객체 내부에 해당 속성이 있는지 확인하는 키워드

속성명 in 변수명(객체명) // 있으면 true, 없으면 false

for in 문

for in문 : 객체의 속성에 순차적으로 접근하는 반복문

for(let key in 객체명) {
	// key : 속성 키, 객체명[key] : 속성 값
}

 

객체의 메소드 속성

객체의 속성에 저장 된 함수를 메소드라고 하며 객체명.메소드()와 같은 형식으로 사용한다.

메소드는 this로 객체를 참조한다.

let 객체명 = {
	속성명 : function(){
			// this.속성명으로 참조
		},
	속성명(){} // 단축해서 사용 가능
}
객체명.속성명 = function(){}; // 동적 추가
객체명.속성명 = 선언 된 함수; // 선언 된 함수 추가도 가능

 

생성자 함수

this키워드를 사용하여 속성을 생성하는 함수

new라는 키워드를 사용하여 객체 생성

생성자명의 첫 글자는 대문자로 시작

function 생성자명(value1, value2, value3, ....){
		this.속성명=‘value1’,
		this.속성명=‘value2’,
		....
	}
}

 

객체 배열 활용

생성된 객체를 배열에 넣어 활용 가능

let 변수명 = [ ]; //배열 생성

/* 데이터 대입 */
변수명.push({속성명:’값’,속성명:’값’,속성명:’값‘,…});
변수명.push({속성명:’값’,속성명:’값’,속성명:’값‘,…});
변수명.push({속성명:’값’,속성명:’값’,속성명:’값‘,…});