삐뚤빼뚤 프론트 개발

응용프로그램에서 브라우저는 보통 최소한의 메모리(RAM)을 할당 받는다. 브라우저에서 동작하는 자바스크립트가 지나친 메모리를 사용하여 운영체제 자체를 down시켜 버리는 일을 막기 위해서다.

메모리 사용 최적화를 위해서는 코드 실행에 필요한 데이터만 유지하는 것이다.

그러기 위해서 사용이 끝난 변수의 값은 null을 주어서 참조를 없애주는 것이 좋다. (가비지 콜렉터는 변수의 참조 유무로 해당 메모리를 회수 할지 말지 결정한다.) 

보통 함수내의 변수들은 함수의 실행이 끝난후에는 자동으로 삭제되므로 전역 변수 및 전역 객체의 변수들의 사용이 끝난후에는 null을 부여하는 것이 좋다. 이렇게 한다고 바로 메모리가 회수되는 것은 아니고, 다음 가비지 콜렉터가 실행될 때 메모리가 회수 되게 하기 위함이다.

자바스크립트는 실행중에 자동으로 메모리를 할당하고, 회수(더 이상 사용하지 않을 변수를 찾아서, 그 변수가 쓰고 있던 메모리를 회수)한다.

이 메모리 정리는 주기적으로 일어난다. 이것을 특정 시점에 일어나게 할 수도 있다.

가비지 콜렉터(Garbage Collector)는 어떤 변수가 더 이상 사용되지 않을지, 사용될 지를 스스로 판단해서 해당 메모리를 남겨두거나 회수하거나 한다. 그 기준은 브라우저마다 조금씩 다르다. 

그 기준 판단 방식으로는 크게 두가지가 있다.

1. 표시하고 지우기 (mark and sweep) 방식 - 현재 사용하지 않는 값에 표시를 남겨 메모리를 회수하는 방법

2. 참조 카운팅 (reference counting) 방식 - 순환 참조의 문제 가능성이 있음

함수 외부에 있는 값은 함수 내부의 매개 변수에 복사된다. 이는 변수 사이에서 값을 복사하는 것과 같다.

값이 객체인 경우, 값 복사의 경우 참조로 이루어지는 것과 달리, 매개 변수에서는 원시값 복사와 같은 형태로 복사된다. 그러나 접근할 때는 참조형태로 힙(전역)에 존재하는 객체에 접근한다. (이 부분 나도 아직 명확히 이해가 잘 안됨;)

매개변수는 함수 내에서의 지역변수라고 이해하면 편하다.

function = setName(obj) { // 매개변수 obj에 person의 값(객체)를 복사한다. <--person의 객체

obj.name = "gh" // obj의 name 속성의 값은 "gh"로 세팅된다. <--- person의 객체

obj = new Object() // obj에 새로운 값(객체)를 부여 한다. <--- 함수 내 지역변수(매개변수)에 새로운 객체 (값)을 부여했다. 이 순간 함수가 호출될 때, obj 변수에 복사되었던 person의 객체는 삭제되고, 새로운 객체가 부여되었다. 여기서부터는  person의 객체가 아닌 새로운 객체이다.

obj.name = "js" // 바로 윗줄에서 생성된 객체 name속성의 값은 "js"로 세팅된다.

}

let person = new Object()

setName(person)

console.log(person.name) //gh

자바스크립트의 변수는 느슨한 타입을 취하므로 변수는 특정 시간에서 특정 값을 가리키는, 문자 그대로 이름일 뿐이다.

종류

1. 원시값

2. 참조값 - 여러 값으로 구성되는 객체를 의미. 메모리에 저장된 객체. 자바스크립트는 객체의 메모리를 직접 조작하지 않고, 해당 객체에 대한 '참조'를 조작한다. 따라서 객체를 가리키는 값은 '참조로 접근한다.'라고 한다.

문자열(string)의 경우 다른 언어와 다르게 원시값으로 본다.