Elice SW 2/TIL

DAY 15 - TIL

자이구 2022. 4. 26. 22:36

JS 엔진

  • JS 엔진은 JS 코드를 읽어 실행하는 프로그램
  • 작성한 JS 코드는 JS엔진을 통해 파싱되고 실행
  • 크롬 브라우저의 경우 V8 엔진(구글 JS 엔진)을 사용

-node.js는 브라우저 외의 환경에서 JS 코드를 실행하도록 하는 프로그램

-node.js는 여러 프로그램으로 구성되며, JS 코드를 읽는 프로그램으로 V8 사용

-브라우저 환경과 node.js 환경은 같은 JS 코드를 작성해도 다르게 동작

 


 JS 코드 실행

  • JS 엔진은 코드 실행 전 실행 컨텍스트를 생성 (코드 컴파일)
  • 실행 컨텍스트는 생성 단계/실행 단계를 통해 생성
  • 생성 단계에서 JS엔진은 변수 선언을 읽음
  • 실행 단계에서 JS엔진은 변수 값을 할당

렉시컬 환경

  • 함수의 렉시컬 환경은 함수가 사용하는 변수들을 둘러싼 환경을 의미
  • 특정 변수의 값은 함수의 렉시컬 환경 안에서 찾을 수 있음
  • 렉시컬 환경은 실행 컨텍스트 안에 정의된 Variable Object로 이해

  • JS 엔진은 생성 단계에서 함수 선언문, 함수 표현식, 변수 등을 읽어 실행 컨텍스트에 저장
  • 변수의 경우, 실행 컨텍스트의 렉시컬 환경을 구성
  • 함수 선언문 외에 변수는 값이 저장되지 않음   
  • 함수 -> 함수 객체 전체 저장                   변수 -> 값 X
  • JS 엔진은 변수에 값을 할당하는 구문을 만나면 실행 컨텍스트에 값을 저장
  • 그 외 코드를 한 줄씩 읽어 나가며 실행

JS 변수 - 호이스팅

  • JS 엔진이 코드를 읽으면, 생성 단계에서 실행 컨텍스트 생성
  • 이때 함수 선언문은 실행 단계에서 함수 전체가 실행 컨텍스트에 저장
  • var 변수는 저장 시 undefined로 초기화
  • let.const는 초기화되지 않는다
console.log(callMe()) // undefined
var x = 10
console.log(callMe()) // 10
function callMe() {
	return x
}

// ReferenceError: Cannot access 'y'
// before initialization 
console.log(callyou()) //TDZ
let y = 10
console.log(callyou()) // 10
function callyou() {
	return y
}

let,const 변수는 생성 단계에서 초기화X ----> 선언문 이전에 접근 시 ReferenceError

이 경계를 TDZ(Temporal Dead Zone)

 

let,const는 호이스팅이 발생하지 않는다 

--> 호이스팅이 발생은 한다. 변수는 찾을 수 있으나 값이 초기화 되지 않아 에러 발생

https://hanamon.kr/javascript-%ED%98%B8%EC%9D%B4%EC%8A%A4%ED%8C%85%EC%9D%B4%EB%9E%80-hoisting/             

 

  • var,let,const 모두 변수를 선언하는 키워드
  • var,let은 변수에 재할당이 가능하지만, const는 재할당이 불가능
  • var은 함수 스코프, let과 const는 블록 스코프 변수

String / JSON

  • JS의 문자열 원시 타입의 래퍼 객체
  • 문자열을 조작하기 위한 여러 메서드를 포함
  • JSON - JSON 객체와 관련된 메서드를 담은 객체

JSON.stringify()는 주어진 객체를 JSON문자열로 만듬

JSON.parse()는 주어진 JSON 문자열을 JS에 맞는 결과 객체로 만듬

JSON.stringify({ name: "jaeku", age: 27})
// '{"name":"jaeku","age":27}'

JSON.parse('{"name":"jaeku","age":27}')
// { name: 'jaeku', age: 27 }