자바스크립트 중요 개념

자바스크립트는 런타임에 타입이 결정되는 동적 언어이면서

함수의 선언 위치에 따라 스코프를 결정하는 정적(렉시컬) 스코프를 갖는다.

 

 

데이터 타입

 - primitive(immutable) type = value

  => 숫자, 문자열, 불리언, null, undefiend, symbol

 - reference(mutable) type = reference

 => array, date, regexp, map, weakMap, set, weakSet

 

*immutable = 스스로 값을 바꿀 수 없음

 

밸류와 레퍼런스의 차이

 

call by value = 참조하는 값을 가져온다.

call by reference = 참조하는 주소를 가져온다.

 

a1 = [1,2]와 a2 = [1,2]가 있을때

a1 !== a2이다.

 

 a1과 a2에는 [1,2]가 바로 저장되는 것이 아니라, 각각 [1,2]를 기록한 힙의 주소가 저정된다. 왜? 오브젝트는 가변적이기에 값을 heap에 배정한다. 

 

따라서 a1에는 [1,2]를 담은 힙의 주소 (예 : &99), a2에는 [1,2]를 담은 힙의 주소 (예 : &100)가 저장되기 때문에

=> &99 와 &100은 다르다. => a1와 a2는 다르다. 

=> 다시, a2 = a1을 선언하게되면 a1 === a2가 된다. 왜? 둘이 바라보는 힙의 주소가 &99로 같기 때문

---

타입변환

 

 - 명시적

 => toString()으로 "" 씌워줌, null, undefiend는 toString() 작동안함

 => Number(), parseInt(), parseFloat(), Boolean, String

 - 암묵적

 => 2 * '10' == 20 (더하기 연산자는 스트링이 우세 => 2 + '10'을 하면 210이 됨)

 => +true == 1

 - 일시적인 객체로의 변환

 => 본래 primitive type은 메소드를 가질 수 없으나 toLowerCase()와 같은 메소드를 사용할때 일시적으로 오브젝트로의 전환이 일어남. 메소드가 실행 된 후에는 다시 primitive type으로 원복

 

 

의도치 않은 암묵적 타입 변환을 주의해야!

---

함수

  - 함수 표현식은 힙 영역에 잡힌다. 호출이 끝난 경우 메모리에서 정리됨. var 함수명 function () {}

  - 선언문은 스테이팅 영역에 잡힌다. 소스코드 전체가 끝날때까지 메모리에 할당되어있음. function 함수명 () {}

 

클로져

 - 표현식으로 선언한 함수는 가비지 컬렉션이 돌면 힙에서 제거

 - 메모리에서 이미 정리된 함수 내에서 선언된 변수를 외부에서 참조하는 경우, 함수자체는 가비지 컬렌션으로 정리되었으나 변수는 남아 있음 

 - 실행이 끝난 후 (GC가 돌았거나 돌 예정) 외부함수의 변수를 내부함수가 호출하는 것

 - GC가 돌고난 함수에 있는 값을 외부에서 접근할 수 있다.

 - 실행이 끝난 후에도 내부함수에서 외부 함수의 변수에 접근할 수 있다.

 

---

호이스팅

 - 변수 호이스팅

 - 함수 호이스팅 

  => 함수 선언문 : function f() {}

  => 함수 표현식 : const f = function(){} (변수호이스팅과 같다)

 

---

실행 컨텍스트 : https://upsanddowns.tistory.com/57

 - 호출스택

 - 이벤트루프

 - this : 완벽하게 같은 함수라도 어떤 객체에 의해 호출되느냐에 따라 this가 달라진다. (=객체에 바인딩 된다)

 - 기본 바인딩(window), 암시적 바인딩, new 바인딩, 명시적 바인딩

 - 스코프

---

추상화

 -

 

객체지향 프로그래밍

 - 자료와 함수가 함께 있는 것(객체)을 지향한다.

 - 동사 + 목적어 => 명령문 ex) getScore() => 어떤 점수를 가져온다는 것인지 알 수 없다.

 - 주어 + 동사 + 목적어 => 평서문 ex) student.getScore() => 학생의 점수를 가져온다는 것을 알 수 있다. 학생 객체가 가진 총점 계산 함수를 사용하기 때문.

 

클래스기반 vs 프로토타입기반

 - 객체지향 프로그래밍을 위해 프로토타입과 클래스 개념을 만들었다.

 - 프로토타입 기반 : 자바스크립트, 셀프, 뉴튼스크립트, 리볼, 세실, 아이오 

 - 클래스 기반 : 스몰토크, c++, c#, 자바, 파이썬, 펄, 루비, 코틀린, 스위프트

 - 클래스 진영이 압살

 - 자바스크립트도 클래스 개념을 추가함.

 

클래스는 대문자로 시작

 - 클래스는 공유함수(공유 프로시저)를 사용할 수 있음으로 자원을 절약할 수 있다.

 - private속성 : 변수명에 #을 붙이면 클래스 내부에서만 접근 가능함. => 오버라이딩 금지, this.#length

 - private속성을 굳이 확인,  변경하고 싶다? 클래스 내부에 getter, setter 함수를 내장시키고 이를 통해 private 속성을 변경함

  - 

 

참조 : https://www.youtube.com/watch?v=DiZ4_cotA6s&list=PLBXuLgInP-5kxpAKy2DNXoebCse2grHjl&index=59 

---

객체

 - 배열

 

비동기

 - 콜백

 - 프로미스

 - async/await

 - Event driven programing

 

 

 

프로토타입

 

DOM

 

디자인 패턴

 - MVC

 

함수형 프로그래밍

 - map

 - filter

 - reduce

 

함수

객체

 - 배열

 

비동기

 - 콜백

 - 프로미스

 - async/await

 - Event driven programing

 

실행 컨텍스트

 - 호출스택

 - 이벤트루프

 - this

 - 스코프

 

프로토타입

 

DOM

 

디자인 패턴

 - MVC

 

함수형 프로그래밍

 - map

 - filter

 - reduce