[JavaScript] Object 객체(참조 자료형)

Object 

키로 구분된 데이터 집합(data collection)을 저장하는 자료형

※ 파이썬 dict와 혼동할 수 있지만 dict가 아님에 유의하자.(오히려 class에 가깝다고 할 수 있다)

 

구조 및 속성

객체 구조 

• 중괄호('{}')를 이용해 작성한다. 
• 중괄호 안에는 key: value 쌍으로 구성된 property를 여러개 작성할 수 있다. 
• key는 문자형만 허용
  • key에 공백이 없으면 따옴표를 생략해서 key를 지정할 수 있다(method도 마찬가지)
  • 그래서 아래 key with space 같은 경우는 따옴표가 필요하다
• value는 모든 자료형 허용

객체 구조 및 조회

 

속성 참조

• 점('.', chaining operator) 또는 대괄호('[]')로 객체 요소 접근
• key 이름에 띄어쓰기 같은 구분자가 있으면 대괄호 접근만 가능(user['key with space'])
• 추가, 수정, 삭제

추가, 수정 후 조회 결과

 

'in' 연산자

• 속성이 객체에 존재하는지 확인

console.log('greeting' in user) // true
console.log('country' in user) // false

 

 

Method

객체 속성에 정의된 함수

• object.method() 방식으로 호출(함수는 단독으로 사용 가능)
• method는 객체를 '행동'할 수 있게 한다.(단순히 값으로서가 아니라 logic을 추가적으로 작성할 수 있다)

greeting은 method

• 'this' 키워드를 사용해 객체에 대한 특정한 작업을 수행할 수 있다.
  • 'this' keyword
  • 함수나 메서드를 호출한 객체를 가리키는 키워드
  • 함수 내에서 객체의 속성 및 메서드에 접근하기 위해 사용

method & this 사용예시(객체 내에서 this는 person)

 

This

JavaScript에서 this는 함수를 호출하는 방법에 따라 가리키는 대상이 다르다.

호출방법	대상
단순 호출	전역 객체(window, 브라우저의 최상위 객체)
메서드 호출	메서드를 호출한 객체

 

1. 단순 호출 시 this

Window 전체가 출력

 

2. 메서드 호출 시 this

가리키는 대상 => 메서드를 호출한 객체

이때 this는 myObj

 

3. 중첩된 함수에서의 this 문제점과 해결책 

• 첫 번째 this(method로서 호출) : this.numbers.forEach~  에서의 this => myObj2
• 두 번째 this
  • function(number){console.log(this)} => method로서가 아닌 일반 함수 표현식으로 작성되어 호출되고 있다
  • 단순 호출이므로 this는 전역객체 즉, window를 가리키게 된다.
  • 화살표 함수로 해결할 수 있다. 

▷ forEach(method)의 인자로 작성된 함수는 일반적인 함수 호출이므로 this가 전역 객체를 가리킨다

=> 화살표 함수는 자신만의 this를 가지지 않기 때문에 외부 함수(myFunc(부모함수))에서의 this값(myObj3) 가져온다.  

따라서 객체 내의 함수에서 this를 사용하려면 화살표 함수를 사용해야만 한다. (call back)

 

 

JavaScript 'this' 정리

• JavaScript의 함수는 호출될 때 this를 암묵적으로 전달 받는다.
• JavaScript에서 this는 함수가 '호출되는 방식'에 따라 결정되는 현재 객체를 나타낸다.
• Python의 self와 Java의 this가 선언 시 이미 값이 정해지는 것에 비해
• JavaScript의 this는 함수가 호출되기 전까지 값이 할당되지 않고 호출 시에 결정된다.(동적 할당)
• this가 미리 정해지지 않고 호출 방식에 의해 결정된다는 것은
  • 함수(메서드)를 하나만 만들어 여러 객체에서 재사용할 수 있다는 장점이 있지만
  • 이러한 유연함이 실수로 이어질 수도 있음을 의미하기도 한다.

this의 동작 방식을 충분히 이해하고 장점만을 취할 수 있는 개발자가 되자^-^