반응형 웹26 JS의 Truthy vs Falsy 자바스크립트에서 truthy 값이란, 불리언(Boolean)으로 평가되는 상황에서 true로 취급되는 값을 말합니다. 자바스크립트에서는 특별히 falsy (거짓 같은)로 정의된 값을 제외한 모든 값이 truthy(참 같은) 값입니다.truthy: 참 같은 값, Boolean으로 평가되는 상황에서 true로 취급falsy: 거짓 같은 값, Boolean으로 평가되는 상황에서 false로 취급다음은 falsy 로 정의된 녀석들 입니다.출처: https://developer.mozilla.org/en-US/docs/Glossary/Falsy// truthyif (true)if ({})if ([])if (42)if ("0")if ("false")if (new Date())if (-42)if (12n)if (3... 2025. 3. 27. JS의 자료형 자바스크립트에서 값은 항상 문자열이나 숫자형 같은 특정한 자료형에 속합니다.이번에는 이 녀석을 살펴봅시다.자바스크립트에서 변수는 자료형에 관계없이 모든 데이터가 가능합니다.이게 무슨 말이냐면 어떤 변수를 let 키워드를 통해 선언한 뒤 문자열을 할당했다고 가정합시다.여기서 저는 다시 이 변수에 숫자를 할당할 수 있습니다.let a = "Hello";a = 10// 에러 상황이 아님. 정상적인 상황따라서 어떤 순간에는 문자열일 수도, 어떤 순간에는 숫자일 수도, 또 어떤 순간에는 다른 자료형일 수도 있습니다.이처럼 데이터의 타입이 존재하긴 하지만 타입이 언제든지 바뀔 수 있는 언어를 동적 타입 언어라고 합니다.자바스크립트는 이에 속하겠죠.이제 본격적으로 알아봅시다.원시 타입과 객체 타입자바스크립트의 데이터.. 2025. 3. 27. JS에서 변수 선언하기 var, let, constJS에서는 변수나 상수를 만들때 var, let, const라는 키워드를 사용합니다.var, let은 변수 선언, const는 상수 선언입니다. JS 개발자들이 주로 하는 말에는 이런 말이 있습니다.*"var는 죽어도 쓰지마!!! let이랑 const만 사용해!!"*맞는 말이지만 이유는 뭘까요??여기서는 var를 사용하면 어떤 문제가 생기고 let과 const를 사용하면 그 문제를 어떻게 보완하는지 알아보겠습니다.먼저 var와 let의 차이를 알아보겠습니다.var와 let의 차이둘의 차이는 크게 3가지가 있습니다.스코프(Scope)중복 선언(Variable redeclaration)호이스팅(Hoisting)스코프(Scope)스코프는 코드가 변수에 접근할 수 있는 범위를 뜻합니다.. 2025. 3. 27. [React] useMemo 사용하기 오늘은 useMemo 라는 리액트 훅을 사용해보자. useMemo 리렌더링 사이에서 계산 결과를 저장할 수 있다. useMemo는 컴포넌트 최상단에서 호출한다.1. useMemo의 개념을 간단하게 알아보자.const visibleTodos = useMemo( () => filterTodos(todos, tab), [todos, tab] ); 위 코드는 아주 간단한 사용예다. 매개변수로는 2개의 값을 가진다. 첫번째로는 calculateValue로 저장하려는 값을 계산하는 함수다. 이 함수는 조건이 존재한다.1. 순수함수2. 인자를 받지 않음3. 어떤 타입이든 값을 반환해야 함 리액트는 맨 처음 랜더링 중에 이 함수를 호출한다. 그리고 나서 이후의 렌더링에서는 두번째 인자로 들어가는 의존성 배.. 2024. 8. 10. [React] reducer와 useReducer 사용하기 이번에는 reducer와 useReducer를 공부해보자. 컴포넌트가 복잡해지면 컴포넌트의 state들이 업데이트 되는 것들을 한번에 파악하기 어려울 수 있다. 예를 들어서 어떠한 배열인 state가 있고, 이 state에 요소를 추가하거나 제거하거나 업데이트 하는 세가지의 이벤트 헨들러(이 녀석들은 모두상태 변화 함수를 통해서 state를 변경)가 있다고 한다면 여기저기 흩어져 있는 이벤트 헨들러를 관리하기가 어려울 것이다. 또한 흩어져 있다 보니 코드의 양도 길어질 것이다. 코드의 양을 줄이고 모든 헨들러에 접근하기 쉽게 한곳에 모으기 위해서 reducer라는 단일 함수를 사용한다. 즉, reducer는 state를 관리하는 또 다른 방법인 것이다. 3단계를 거쳐서 state들을 reducer를.. 2024. 8. 9. [React] useEffect 사용하기 useEffect는 리액트에서 컴포넌트의 side effect를 제어하는 리액트 훅이다. 컴포넌트의 side effect는 무엇인가? 리액트에서 컴포넌트의 사이드 이펙트란 컴포넌트가 어떤 동작을 했을때 발생하게 되는 파생적인 효과를 말한다. 예를 들어서컴포넌트의 어떤 값이 변경되었을 때 콘솔레 변경된 값을 출력하거나,컴포넌트가 마운트 되었을 때 콘솔에 Mount라고 출력하거나, 컴포넌트가 리렌더링(업데이트) 되었을 때 콘솔에 Update라고 출력하거나,컴포넌트가 언마운트 되었을 때 콘솔에 Ummount라고 출력하는 상황을 말한다. 이렇게 라이프 사이클을 제어하는 것도 컴포넌트의 사이드 이펙트라고 할 수 있다. 이번에 알아볼 useEffect를 이용하면 이러한 사이드 이펙트들을 제어할 수 있다. 내가 만약.. 2024. 7. 26. 이전 1 2 3 4 5 다음 반응형
