-
[javascript] javascript 개발자가 알아야 할 핵심 개념 33가지 - (1)FrontEnd/Javascript 2021. 7. 6. 03:01
본 내용은 https://github.com/leonardomso/33-js-concepts#11-javascript-engines 의 내용을 다루고 있습니다.
해당 레포는 현재 40k가 넘는 star를 가진 레포입니다.1. Call Stack
Javascript를 실행하면, javascript에 존재하는 함수들이 스택에 쌓이게 된다.
쌓인 함수들은 스택에서 pop하듯이 맨 위에서부터 실행이 완료되고 stack에서 빠져나가게 된다.
python과 같은 언어에서 재귀호출 시 1000번이 넘어가면 max recursion depth가 생기듯이, javascript의 call stack에 일정량 이상의 함수가 쌓이면 maximum call sctack size exceed가 발생한다.
2. Primitive Type
Javascript에서 사용하는 변수명을 말한다.
- string
일반적인 문자열. 같은 따움표로 시작하고 끝 맺어야 한다. - number
일반적인 숫자 표현. integer와 float를 모두 포함한다. - boolean
일반적인 참 거짓. true와 false - undefined
정의하지 않음. 즉 선언은 했지만, 값이 할당되지 않은 경우 - null
존재하지 않음. 선언 후 null이라는 값을 할당해주어야 한다. 이 점에서 undefined와 다르다. - NaN
Not a Number의 줄임말. 수식 계산을 했는데 정상적인 수가 아닌 경우 나온다. - symbol
유일한 식별자(unique identifier)를 만들고 싶을 때 사용한다.
var a = Symbol() 혹은 var b = Symbol('b') 와 같이 생성 가능하다. 이 때 Symbol안의 arg는 symbol이름이라고 한다.
iterable에 symbol을 index 혹은 key로 한 값이 있다면, for ... in 문을 돌거나 keys를 통해 key를 확인할 때 나타나지 않는다. (숨김기능)
실무에서 잘 쓰지 않는다.
3. Value Type vs Reference Type
Javascript에는 Value Type과 Reference Type이 있다.
다른 언어에도 모두 존재하듯이, 비참조형과 참조형을 말한다.
Shallow copy( = )를 사용했을 때 값이 복사되면 value, 참조 주소값이 복사되면 reference type이다.
위 예시를 보면 value type과 reference type의 차이가 선명하게 보일 것이다.
value type의 경우 = 을 이용한 Shallow copy를 사용한 경우, a의 값이 바뀌어도 b의 값이 변하지 않는다.
하지만 reference type의 경우 Shallow copy를 사용하면 a의 값이 바뀌면 b도 변한다.
value type의 경우 같은 value를 가진 두 변수는 ==로 확인하면 true 이다.
reference type의 경우 두 변수가 같은 value를 가졌지만, 둘은 서로 다른 주소를 참조하고 있으므로 ==으로 확인하면 false를 출력한다.
reference type의 경우 다른 변수에 한 변수가 가진 값을 할당할 때, 참조값이 아닌 그 주소가 가리키는 값을 복사하려면 Deep copy를 사용해야하는데, for loop를 이용하여 모든 값을 복사하는 함수를 새로 정의하는 방법 혹은 lodash 라이브러리의 cloneDeep을 이용하는 방법 등이 있다.
배열을 Deep copy하는 경우 [...<arr>] 의 방법도 사용 가능하다.
https://kevinkim95-dev.tistory.com/16
'FrontEnd > Javascript' 카테고리의 다른 글
[javascript] javascript 개발자가 알아야 할 핵심 개념 33가지 - (2) (1) 2021.07.10 [Javascript] 튜토리얼 (1) - HTML 파일에서 Javascript 사용하기 (2) 2021.06.17 - string