혼공자바스크립트 5주차 객체

미리쓰는 5주차

 

객체

객체는 C에서의 구조체와 유사하게, 직접 자료형을 만든다는 느낌으로 사용한다.

위 frog 객체는 name 과 cry, introduce라는 항목이 존재한다.

name은 객체속에 있는 변수처럼 보이는데 이와 같은 경우를 속성 이라고 한다.

 

아래 두개에는 함수가 들어가있는데, 객체에서는 속성을 함수 자료형으로서 저장할 수 있고, 이를 메소드 라고 한다.

 

생성된 객체에 접근하기 위해서는 . (dot) 연산자를 사용하는데, 객체이름.속성 과 같이 사용하면 해당 객체의

그 속성에 저장된 값을 얻을 수 있다.

(22번 라인, 콘솔출력 1번째줄)

메소드도 동일하게 객체이름.메소드() 방식으로 해당 함수를 실행할 수 있다.

(23번, 24번라인, 콘솔 출력에서 2번째,3번째줄)

위와같이 없던 속성을 추가해주거나 속성을 삭제(delete 객체.속성) 할 수 있다.

출력 결과가 다른 모습을 확인할 수 있다.

 

메서드를 선언할 때 function까지 쓰는것이 번거롭다면 위와같이 생략하거나

(객체 속에서 this는 속해있는 해당 객체 자체를 의미함. this.name이면 student 객체 속에 있으므로

student.name 인것)

화살표 함수를 쓰면 되는데, 화살표함수를 사용하니 this가 조금 이상하게 작동한다.

화살표함수랑 일반 선언적 함수로 비교해보자.

두번째 출력된 19번라인 선언적함수는 해당 객체를 잘 보여주는데 16번 함수는 Window 객체를 보여주고 있다.

해당 객체는 브라우저 요소들과 자바스크립트 엔진 등 모든것을 담고 있는 최상위 객체다.

화살표 함수로 선언한 함수에서는 this가 존재하지 않기 때문에 이런 현상이 발생한다. 그러므로

해당 범위 상위의 객체를 보여주고 있는 것이다.

위와같이 선언적 함수 메서드 속에 화살표 함수를 담고 출력해보면

해당 범위 한칸 상위인 introduce2 메서드가 속해있는 객체인 student를 출력하고 있는 것을 볼 수 있다.

 

 

let a =5 같은 기본자료형의 경우에는 .연산자를 사용하더라도 속성을 추가할 수 없다.

new를 사용하면 기본자료형을 객체로 선언하는것이 가능하다.

.length 를 사용하는 경우에는 기본 자료형을 객체처럼 사용하는 것 같아 잘못돼 보이지만.

자바스크립트에서 기본자료형에 .연산을 하려고 하면 해당 기본자료형을 '일시적' 으로 객체로 승급시키기에 가능하다.

해당 연산 중에만 일시적으로 승급되는 것.

일시적승급인 것을 위와같이 확인해볼 수 있다.

이 일시적 승급하는것을 prototype 라고 하는데, 위처럼 특정 자료형의 prototype에 메서드를 추가해줄 수 있다.

 

선택문제

Math 객체로 sin값 구하기

그냥 했더니 문제에 있던대로 1이 딱 나오지 않았다. mozila 문서를 참고하자.

라디안 단위로 변환해준다고한다.  90도라는 각도를 라디안 형태로 바꿔주어야겠다.

1이 출력되는 것을 확인할 수 있었다.

 

내 지난 2주

망했다

혼공자바 포기