📘 Frontend/Javascript2023. 7. 24. 06:22Javascript - Garbage Collection

Garbage Collection 자바스크립트는 눈에 보이지 않는 곳에서 메모리 관리를 수행합니다. 원시값, 객체, 함수 등 우리가 만드는 모든 것은 메모리를 차지합니다. 그렇다면 더는 쓸모 없어지게 된 것들은 어떻게 처리될까요? 지금부턴 자바스크립트 엔진이 어떻게 필요 없는 것을 찾아내 삭제하는지 알아보겠습니다. 자바스크립트는 도달 가능성(reachability) 이라는 개념을 사용해 메모리 관리를 수행합니다. ‘도달 가능한(reachable)’ 값은 쉽게 말해 어떻게든 접근하거나 사용할 수 있는 값을 의미합니다. 도달 가능한 값은 메모리에서 삭제되지 않습니다. 아래 소개해 드릴값들은 그 태생부터 도달 가능하기 때문에, 명백한 이유 없이는 삭제되지 않습니다. 현재 함수의 지역 변수와 매개변수 중첩 함수..

📘 Frontend/Javascript2023. 7. 24. 03:20Javascript - 참조에 의한 객체 복사

참조에 의한 객체 복사 객체와 원시 타입의 근본적인 차이 중 하나는 객체는 ‘참조에 의해(by reference)’ 저장되고 복사된다는 것입니다. 원시값(문자열, 숫자, 불린 값)은 ‘값 그대로’ 저장·할당되고 복사되는 반면에 말이죠. 변수엔 객체가 그대로 저장되는 것이 아니라, 객체가 저장되어있는 '메모리 주소’인 객체에 대한 '참조 값’이 저장됩니다. let user { name: "Kim" }; let admin = user; // 객체의 참조값을 복사함 참조에 의한 비교 객체 비교 시 동등 연산자 ==와 일치 연산자 ===는 동일하게 동작합니다. 비교 시 피연산자인 두 객체가 동일한 객체인 경우에 참을 반환하죠. 두 변수가 같은 객체를 참조하는 예시를 살펴봅시다. 일치·동등 비교 모..

📘 Frontend/Javascript2023. 7. 16. 17:53Javascript - Object

Object 자바스크립트에서 객체는 중괄호 {…}를 이용해 만들 수 있습니다. 중괄호 안에는 ‘키(key): 값(value)’ 쌍으로 구성된 프로퍼티(property) 를 여러 개 넣을 수 있는데, 키엔 문자형, 값엔 모든 자료형이 허용됩니다. 프로퍼티 키는 ‘프로퍼티 이름’ 이라고도 부릅니다. 빈 객체를 만드는 2가지 방법이 있습니다. 객체 생성자 문법 객체 리터럴 문법 let user = new Object(); // 객체 생성자 let user = {}; // 객체 리터럴 보통 객체 선언 시 리터럴 {...} 을 사용합니다. Literal & Property 자바스크립트의 객체 내부 {...} 안의 프로퍼티들은 Json 처럼 키 : 값 쌍으로 구성된 프로퍼티가 들어갑니다. let user = { n..

📘 Frontend/Javascript2023. 7. 16. 15:13JavaScript - Function

Function 함수의 정의는 다른 언어들과 동일하기 때문에 기본적인 함수 설명은 생략 함수 파라미터 기본값 설정 Kotlin의 Default Parameter와 유사한 구조입니다. 파라미터가 2개 있는 함수에 1개의 파라미터만 전달하게 되면, 값을 할당받지 못한 파라미터는 Undefined 할당됩니다. 하지만 Undefined를 할당시키기 보다 함수를 선언할 때 기본값을 설정해주는게 더 좋습니다. function showMessage(from, text = "No Text Given") { alert(from + ": " + text); } showMessage("Kim"); // 결과값 : Kim: No Text Given 파라미터에 값을 전달해도 그 값이 Undefined와 엄격히(Strict) 일..

📘 Frontend/Javascript2023. 7. 16. 12:51Javascript - Nullish 병합 연산자

Nullish 병합 연산자 '??' nullish 병합 연산자(nullish coalescing operator) ??를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 ‘확정되어있는’ 변수를 찾을 수 있습니다. Kotlin의 Elvis 연산자와 !! 키워드와 비슷한 느낌이지만 다른것 같습니다. a ?? b의 평가 결과는 다음과 같습니다. a가 null도 아니고 undefined도 아니면 a 그 외의 경우는 b nullish 병합 연산자 ??없이 x = a ?? b와 동일한 동작을 하는 코드를 풀어보면 다음과 같습니다. x = (a !== null && a !== undefined) ? a : b; 또 다른 예시를 살펴봅시다. firstName, lastName, nickName이란 변수..

📘 Frontend/Javascript2023. 7. 16. 12:25Javascript - Operators & Condition

Operators 자바스크립트에서의 기본 연산자는 다음과 같습니다. 덧셈 연산자 +, 뺄셈 연산자 -, 곱셈 연산자 *, 나눗셈 연산자 /, 나머지 연산자 %, 거듭제곱 연산자 ** 나머지 연산자(remainder operator)는 % 기호로 나타내지만, 비율을 나타내는 퍼센트와 관련이 없습니다. 나머지 연산자를 사용한 표현식 a % b는 a를 b로 나눈 후 그 나머지(remainder)를 정수로 반환해줍니다. 거듭제곱 연산자(exponentiation operator)를 사용한 a ** b를 평가하면 a를 b번 곱한 값이 반환됩니다. if & ? 을 이용한 조건 처리 다른 언어와 마찬가지로 if 줄이 1줄일때, {}를 생략할 수 있습니다. if문은 다른 언어와 비슷하므로 대충 작성합니다. if (ye..

📘 Frontend/Javascript2023. 7. 15. 16:56JavaScript - Type Conversion (Primitive Type Only)

Type Conversion (형변환) 함수와 연산자에 전달되는 값은 대부분 적절한 자료형으로 자동 변환됩니다. 이런 과정을 "형 변환(type conversion)"이라고 합니다. alert가 전달받은 값의 자료형과 관계없이 이를 문자열로 자동 변환하여 보여주는 것이나, 수학 관련 연산자가 전달받은 값을 숫자로 변환하는 경우가 형 변환의 대표적인 예시입니다. 이 외에, 전달받은 값을 의도를 갖고 원하는 타입으로 변환(명시적 변환)해 주는 경우도 형 변환이라고 할 수 있습니다. 이 글에서 아직 객체의 형변환은 다루지 않고 Primitive Type에 대한 형변환만 다루겠습니다. 문자 변환 문자형으로의 형 변환은 문자형의 값이 필요할 때 일어납니다. alert메서드는 매개변수로 문자형을 받기 때문에, al..

image