React 입문주차 S.A

🐤 JavaScript의 자료형과 JavaScript만의 특성은 무엇일까 

• 느슨한 타입(loosely typed)의 동적(dynamic) 언어
  • JavaScript의 변수는 모든 타입의 값으로 할당할수도 다시 할당할수도 있다. 
• JavaScript 형변환
  • parseInt(), Number() 등을 사용해서 변수의 타입을 변경시킬수 있다.
• ==, ===
  • 둘다 변수나 조건을 비교할때 쓰는데, == 는 유형을 비교하지않고, ===는 유형도 비교한다(더 엄격하다)
• 느슨한 타입(loosely typed)의 동적(dynamic) 언어의 문제점은 무엇이고 보완할 수 있는 방법에는 무엇이 있을지 생각해보세요.
  • 동적인 언어는 Runtime에서밖에 확인할수 없기때문에, 에러를 발견하기가 어렵다. 
  • 보완하기 위해서 Typescript가 나왔다.
• undefined와 null의 미세한 차이들을 비교해보세요.
  • null은 그냥 nothing, 즉 아무것도 없는경우다. null로 선언된 변수는 그 어떤 객체도 가르키지 않는다.
  • undefined는 전역객체의 속성중 하나로, 값이 주어지지 않은 변수에 자동으로 할당된다. 

 

🐤 JavaScript 객체와 불변성이란 ?

 

• 기본형 데이터와 참조형 데이터
  • 기본형에는 바로 값을 그대로 할당, 참조형에는 값이 저장된 주소값을 할당.
• 불변 객체를 만드는 방법
  • const, Object.freeze()
• 얕은 복사와 깊은 복사
  
  • 얕은복사: 값만 복사해서 준다
  • 깊은복사: 값이 저장된 주소, 즉 메모리의 주소도 복사함

 

🐤 호이스팅과 TDZ는 무엇일까 ?

• 스코프, 호이스팅, TDZ
  • 전역 스코프 : 코드의 어느곳에서든 참조할 수 있는 범위. 이곳에 선언된 변수는 전역 변수가 되며 코드 어디에서든 참조가 가능.
  • 지역 스코프 : 코드블록, 함수내에서의 범위이며 자기자신과 하위 범위에서만 참조. 선언된 변수는 지역 변수가 됨.
  • 호이스팅: 인터프리터가 변수와 함수의 메모리 공간을 선언전에 미리 할당하는 것.
  • TDZ: temporal dead zone, 변수의 선언과 변수의 초기화 사이의 변수에 접근할 수 없는 지점.
• 함수 선언문과 함수 표현식에서 호이스팅 방식의 차이
  • var, 함수선언문은 호이스팅 대상이고, let, const, 함수표현식은 호이스팅 대상이 아님
• 실행 컨텍스트와 콜 스택
  • 실행 컨텍스트: 코드를 실행하기 위해 필요한 환경
  • 콜 스택: 함수 호출을 기록하기 위해 사용하는 우물 형태의 데이터 구조
• 스코프 체인, 변수 은닉화
  • 스코프 체인: 해당 코드의 유효 범위 안에 있는 변수를 정의하는 객체의 체인
  • 변수 은닉화: 클로저를 사용해야한다. 클로저를하게 되면 가질 수 있는 장점들이 있기 때문에 메모리 누수문제만 해결 할 수 있다면 클로저를 사용하는 것이 좋다.

 

 

 🐤 실습 과제

 

• 콘솔에 찍힐 b 값을 예상해보고, 어디에서 선언된 “b”가 몇번째 라인에서 호출한 console.log에 찍혔는지, 왜 그런지 설명해보세요. 주석을 풀어보고 오류가 난다면 왜 오류가 나는 지 설명하고 오류를 수정해보세요. 
  • a가 함수 hi 안에서 선언되었고, 스코프 밖에서 불러서 오류가 난다.

let b = 1;

function hi () {

const a = 1;

let b = 100;

b++;

console.log(a,b);

}

console.log(a);

console.log(b);

hi();

console.log(b);