Javascript/Vanilla JS

메서드(method), this, new, Constructor, Optional chaining(.?)

Vagins 2022. 1. 25. 15:00

22.01.25

곧 연휴가 시작 됩니다. 인턴 중인 회사에서 잘 지내고 있습니다. 웹페이지 유지보수 간단하게 하면서 매일 공부하고 있습니다. 얼른 졸업하고 취업 바로 하고 싶네용

 

 

1. 메서드, this 

 

메서드는 객체에 저장된 정보에 접근할 수 있어야 메서드입니다. 메서드는 보통 객체 프로퍼티의 값을 활용합니다.

메서드 내부에서 this를 사용하면 객체에 접근할 수 있습니다. this. 는 메서드 호출시 사용된 객체를 말합니다.

let user = {

  name: "John",

  age: 30,

  sayHi() {

  // 'this'는 '현재 객체'를 나타냅니다.

  alert(this.name);

  }

};   위에서 this는 user를 나타냅니다.

 

* javascript this의 특징은 this 값이 런타임에 결정된다는 점입니다.

 

 

 

2. new 연산자와 Constructor

 

new 연산자와 생성자 함수는 유사한 객체를 여러개 만들때 사용합니다. 생성자 함수도 일반 함수와 같지만 

두가지가 다릅니다.

1. 함수이름의 첫 글자가 대문자인 점.  2. 반드시 new 연산자를 붙여 실행하는 점. 

 

* javascript는 언어 차원에서 다양한 생성자 함수를 제공합니다. 날짜, 집합 (Date, Set) 등 내장객체는 생성자 함수를 이용해 만들 수 있습니다.

 

 

3. Optional chaining(?.)

 

만들어 진지 얼마 안된 문법이므로 간단하게만 설명하겠습니다.

기능부터 말하면 ?. 접근하는 대상이 undefined나 null이면 멈추고 undefined를 반환합니다.

(일반 dot notation(.) 을 사용하면 앞의 접근 대상이 undefined나 null이면 에러가 뜹니다.)

 

user.address.street 로 해당 값을 불러 올때 address 정보가 없는 user도 있을수 있기 때문에 오류를 막고 undefined를 얻기 위해 생겨난 문법입니다. (javascript.info 참고)