본문 바로가기

Programing371

[ONEBITE-REACT] JS 심화 - 원시 타입과 객체 타입 (Primitive Types and Object Types) 정의 원시타입 (Primitve Types) 단순한 값 구성 : 숫자(Number), 문자열(String), 불리언(Boolean), Null, Undefined, Symbol 객체 타입 (Object types) 여러 속성을 포함할 수 있는 복잡한 데이터 타입 구성 : 배열(Array []), 객체(Object {}), 함수(Function), 날짜(Date) 차이 값의 저장 방식에서의 차이 원시 타입 변수가 스택 메모리에 직접 저장된다 객체 타입 변수가 스택 메모리에 직접 저장되는 것이 아니라 힙(heap) 메모리에 저장된다. 변수에는 값이 직접 저장되는 것이 아니라 변수에 대한 참조(reference)가 저장된다. 예를 들어 let num = 1 이라는 number 타입의 원시 타입 데이터는 num.. Programing/React 2024. 3. 15.
[ONEBITE-REACT] JS 심화 - Spread 연산자 & Rest 매개변수 Spread 연산자 의미 스프레드 연산자는 배열이나 객체를 펼쳐서 개별 오소로 분리하는 연산자이다. 스프레드 연산자는 주로 여러개의 배열이나 객체를 복사하거나 하나로 합칠 때 사용한다. 예를 들어 아래와 같은 두 개의 배열이 있는데, arr1을 arr2의 요소 중 4와 5사이, 즉 arr2 배열의 0번 인덱스와 1번 인덱스 사이에 넣고 싶다면 원래대로라면 이렇게 코드를 작성할 수 있다. let arr1 = [1, 2, 3]; let arr2 = [4, 5, 6]; // 정석적인 방법대로 추가 let arr2 = [4, arr1[0], arr1[1], arr1[2], 5, 6]; console.log(arr2); // [4, 1, 2, 3, 5, 6] 그런데 배열이라는 것은 원래 값을 유동적으로 바꾸기 위.. Programing/React 2024. 3. 14.
[ONEBITE-REACT] JS 심화 - 구조 분해 할당(Destructing Assignment) 의미 구조 분해 할당(Destructing Assignment)이란 배열이나 객체의 값을 해체하여 그 값을 개별 변수에 할당하는 것을 말한다. 이를 통해 배열이나 객체에서 원하는 값만을 추출할 수 있다. 예를 들어 arr라는 배열에 "초콜릿", "떡볶이", "삼겹살"이 있다면 이것을 변수1에 "초콜릿", 변수2에 "떡볶이", 변수3에 "삼겹살"을 담아 각각 다른 변수 3개를 만들어서 각각의 값을 분해해서 담는 것도 가능하다. 배열의 구조 분해 할당 배열을 나누려면 일반적으로는 아래와 하나씩 변수로 나눠주는 형태로 번거롭게 작업 해야 한다. let arr = [1, 2, 3] let one = arr[0]; let two = arr[1]; let three = arr[2]; 기본형 let 원래변수명 = [.. Programing/React 2024. 3. 14.
[ONEBITE-REACT] JS 심화 - 단락 평가 (Short-circuit Evaluation) 의미 단락평가(Short-circuit Evaluation)란, 논리 연산자인 &&(and), ||(or)에서 발생하는 평가 방식을 말한다. a && b 이든 c || d 이든 각각의 연산자는 두개의 항을 가지고 있기 때문에 둘 다 연산해야 할 것 같지만, 실제로는 왼쪽의 1항의 결과에 따라 2항을 계산할지 말지 결정한다. 논리 and 연산자 (&&) 왼쪽 피연산자가 참이면 오른쪽 피연산자를 평가하고 오른쪽 피연산자까지 참이어야 참을 반환한다. 왼쪽 피연산자가 거짓이면 오른쪽 피연산자를 평가하지 않고 바로 거짓으로 반환한다. 논리 or 연산자 (||) 왼쪽 피연산자가 참이면 오른쪽 피연산자를 평가하지 않고 참을 반환한다. 왼쪽 피연산자가 거짓이면 오른쪽 피연산자를 평가한다. // 논리 and 연산자 (&.. Programing/React 2024. 3. 12.
[ONEBITE-REACT] JS 심화 - Truthy와 Falsy 의미 자바스크립트는 true나 false인 조건이 주어지지 않아도, true나 false로 인식하는 경우가 있다. 이런 경우를 Truthy(참 같은 값), Falsy(거짓 같은 값)라고 한다. if (123) { console.log("true"); } else { console.log("false"); } // true if (undefined) { console.log("true"); } else { console.log("false"); } // false 위의 코드를 보면 '123이 124보다 크면' 이런 조건을 붙인 것이 아니라 그냥 123이라는 number type 자체를 조건식에 넣었고, 이것이 true면 "true" false면 "false"를 반환하도록 하였다. 그런데 true를 반환했고.. Programing/React 2024. 3. 12.