[Javascript] 객체, this

객체

• 메모리에 저장된 자료구조
• 속성(상태, 값)과 기능(메서드)을 가지고있다.
• 객체가 대입된 변수는 참조변수라고 한다.
• ( {key : value} ) 키와 값 한쌍으로 값, 메서드 정의가 가능하다.

객체 선언

	<script type="text/javascript">
		var obj01 = new Object();
		console.log(obj01, '객체 선언 1'); //{} '객체선언 1'
		var obj02 = {};
		console.log(obj02, '객체 선언 2'); //{} '객체선언 2'
		
		//값을 대입하면서 객체선언
		var obj03 = {
			name : '홍길동', //속성 = 필드
			age : 20,
			getName : function(){ //메서드
				//코드 
				console.log('메서드호출');
			}
		};
		//객체의 멤버에 접근하기 (도트연산자를 활용하여 객체의 멤버에 접근가능)
		console.log(obj03.name); //속성접근
		console.log(obj03.age); //속성접근
		obj03.getName(); //메서드 호출
	</script>

📌 .도트연산자를 활용하여 객체의 멤버에 접근이 가능하다.

객체에 값 대입하기

• 객체에 속성이나 메서드명이 없는 상태에서 대입될 경우
  자동생성하며 대입한다. (없는 객체를 만들어서 쓸 수 있다.)

<script type="text/javascript">
		/* 
			객체가 아닌 대상에는 도트연산자 활용이 불가능하다.
			var num = 0;
			num.name = 0; 
			console.log(num, num.name); 
		*/
        
		var obj04 = {};
		obj04.name = '홍길동';
		obj04.getName = function(){	
		};
		console.log(obj04);
		
		var obj05 = {};
		obj05['name'] = '이순신';
		obj05['getName'] = function(){
		};
		console.log(obj05);
		
		//기존 키가 존재할 경우 갱신
		obj05.name = '고길동';
		console.log(obj05);
	</script>

객체가 아닌 대상에는 도트연산자 활용이 불가능하다.

ex)
var num = 0;
num.name = 0;
console.log(num, num.name);

*고길동 갱신

this.

• 메서드 내에서 사용되며, 객체화 된 나 자신을 가리킨다.

<script type="text/javascript">
		var obj06 = {
			userName : '홍길동',
			getName : function(n){
				//name = n; 윈도우네임, 쓰지말것
				this.userName = n; //나 자신 가리킬때는 무조건, 변수명 달라도 this키워드 쓸 것
				console.log(this,'this 출력'); 
				console.log(this.userName, 'this.name');
				this.print();
				return this.userName; //리턴시에도 this키워드
			},
			print : function(){
				console.log('print');
			}
		};
		var result = obj06.getName('이순신'); //메서드호출, getName값이 result에 담긴다.(최종값)
		console.log(result, '메서드의 리턴값'); 
	</script>

this.userName = n;
나 자신 가리킬때 무조건 변수명 달라도 this키워드 쓸 것

return this.userName;
리턴시에도 this키워드

var result = obj06.getName('이순신');
메서드호출, getName값이 result에 담긴다.(최종값)

console.log(result, '메서드의 리턴값');

객체 활용
	<script type="text/javascript">
		var myObj = {
				arr : [],
				getSum : function(){
					var sum = 0;
					for(var i=0; i <this.arr.length; i++){
						sum += this.arr[i];
					}
					return sum;
				},
				getAvg : function(){
					return this.getSum() / this.arr.length;
				},
				addNum : function(n){
					this.arr.push(n);
					return this;
				}
		}
		
		myObj.addNum(10).addNum(20).addNum(30);
		console.log(myObj.getSum(),'<===합산값');
		console.log(myObj.getAvg(),'<===평균값');
	</script>