한번 더 정리할법한 부분

형변환

• 문자형으로 변환 :
  • 문자형의 값을 기대할 때 변환된다. (말고도 ""와의 연결연산 등등)
  • 예측 가능한 방식으로 변환된다.
• 숫자형으로 변환
  • 수학 관련 연산자를 적용하면 피연산자는 자동으로 형변환이 된다. (+ === Number() )
  • 비교 연산자를 적용할 때에도 피연산자의 형이 다르다면 숫자형으로 형변환 후 비교한다. (숫자형으로 바뀌지 않는 문자는 유니코드 순으로 비교)
  • NaN도 숫자형이며, 그 어느것과 비교연산을 수행해도 false가 된다.
    • 이는 Object.is를 통해서 비교하면 올바르게 비교할 수 있다. (부호가 있는 0도 잘 비교한다.)
  • 숫자형도 문자형이 예측 가능한 방식으로 변환되듯 예측 가능하게 변환 되긴 한다.
  • 형 변환이 특이한 경우
    • undefined : NaN
    • null : 0
    • true / false : 1 / 0
    • string
      • trim() 연산 이후, 빈 문자열이라면 0, 아니라면 숫자를 읽는다. 숫자가 아닌 다른 글자가 포함되었다면 NaN이 된다.
• 불린형으로 변환
  • 숫자 0, 빈 문자열, null, undefined, NaN은 false
• null과 undefined는 타입은 달라도, 비어있다는 점에서 == 에서는 true, === 에서는 false

객체

• 일반 객체는 for...in을 사용하여 key에 접근할 수 있다. (Symbol형은 안됨)

• 객체를 할당하면 참조에 의한 복사가 일어난다.

  	let user = {
  		name: "John"
  	};
  	let admin = user; // 참조값을 복사함
  
  	// 참조에 의한 복사 예시
  	let a = {};
  	let b = a; // 참조에 의한 복사
  
  	alert( a == b ); // true, 두 변수는 같은 객체를 참조합니다.
  	alert( a === b ); // true
  
  

  • 이로 인해서 변수에는 객체의 주소가 들어가고, 객체의 이름으로 비교연산 수행시 같은 객체를 담고 있는지를 확인한다.

얕은 비교 vs 깊은 비교 얕은 비교 : 원시타입의 경우 값을 비교, 참조형의 경우 참조 위치를 비교한다. 내용이 같아도. 깊은 비교 : 객체의 경우에도 값을 비교한다. 내용이 완전히 같다면 동일하다고 판단한다.

리액트에서는 어떤 비교를 사용할까? 리엑트에서 변화 감지 (state, props)를 위해 비교가 필요하다. 이때 리액트에서는 Object.is를 활용한 1 depth 정도의 앝은 비교를 사용한다. 객체의 1depth의 내용만 확인 후 동일하면 동일하다고 판단한다.

실행 컨텍스트 정리

JavaScript 엔진이 코드를 실행할 때 필요한 정보들을 담고 있는 내부적인 데이터 구조 코드가 실행되는 순간의 환경과 상태를 나타내며, 변수, 함수, this 바인딩 등의 정보를 포함

종류

1. 전역 실행 컨텍스트 (Global Execution Context)

• 프로그램이 시작될 때 가장 먼저 생성되는 컨텍스트
• 전역 객체(브라우저에서는 window, Node.js에서는 global)와 연결됨 (사실은 그 자체)
• 프로그램당 하나만 존재

2. 함수 실행 컨텍스트 (Function Execution Context)

• 함수가 호출될 때마다 새로 생성되는 컨텍스트
• 각 함수 호출마다 고유한 컨텍스트를 가짐