Dev36 ReactNative: 5/3 공부일지 작성 - map() 공부 중 map()에 대한 내용 작성 const fcstValues = forecasts.map((item) => item.fcstValue); JSON으로 받은 응답을 처리하는 과정에서 map()을 사용해 보았다 그냥 처리하려고 했지만 Object들로 감싸져 있는 바람에 하나하나 처리하기 힘들고 오류가 발생하여 map에 대하여 알아보고 이를 대체하는 과정으로 이를 해결했던 것 같다 map() JavaScript의 map() 함수는 배열 요소를 순회하며 각 요소를 인자로 전달받은 함수를 실행하여 새로운 배열을 생성합니다. 이 때, 새로운 배열은 이전 배열과 같은 길이를 가지며 각 요소는 전달받은 함수를 실행한 결과로 채워집니다. map() 함수의 구문은 다음과 같습니다. arr.map(callback(c.. Dev/React Native 2023. 5. 3. ReactNative: 5/3 공부일지 작성 - useEffect() 배경 프로젝트 진행 중, useEffect()를 남용했다가 콘솔에서 너무 많은 요청을 한다는 이유로 오류메시지가 표시되었다 이에 useEffect()에 대하여 조금 알아보았고, 알아본 내용을 바탕으로 정리하여 작성한다 ! useEffect() 는 React의 훅(Hook) 중 하나로, 컴포넌트의 렌더링이 완료된 후에 특정 작업을 수행하거나, 컴포넌트가 사라지기 전에 필요한 정리 작업을 수행할 수 있도록 해줍니다. useEffect() 는 두 개의 인자를 받습니다. 첫 번째 인자는 함수이며, 렌더링이 완료된 후에 실행될 작업을 정의합니다. 두 번째 인자는 배열이며, 해당 배열에 포함된 값들이 변경되었을 때만 첫 번째 인자로 전달된 함수를 실행하도록 하는 역할을 합니다. 예를 들어, 다음 코드는 useEff.. Dev/React Native 2023. 5. 3. ReactNative: 5/2 공부일지 작성 - await await에 관한 설명 React Native은 JavaScript의 비동기 처리 방식인 Promise와 async/await를 지원합니다. await은 Promise 객체가 처리되는 동안 코드 실행을 일시 중지하고, 해당 Promise 객체가 처리될 때까지 기다린 다음 결과 값을 반환합니다. 이를 통해 비동기 처리를 보다 간편하게 처리할 수 있습니다. await는 항상 async 함수 내부에서 사용되어야 하며, Promise 객체를 반환하는 함수 앞에 위치합니다. 이 때, Promise 객체의 처리 결과를 변수에 저장하거나, 해당 결과를 다른 함수로 전달하거나, 그 결과를 출력하는 등의 작업을 수행할 수 있습니다. async function fetchUserData(userId) { try { cons.. Dev/React Native 2023. 5. 2. ReactNative: 4/30 공부일지 작성 - flex flex에 대한 설명 React Native에서는 컴포넌트의 크기를 절대적인 값으로 지정하는 것이 아니라, 상대적인 값으로 지정하여 반응형 레이아웃을 구성하는 것이 권장됩니다. 이를 위해서는 flex 속성을 이용할 수 있습니다. Flex 속성은 해당 뷰의 크기를 지정할 수 있는데, 부모 뷰가 flex로 지정되어 있어야 합니다. 부모 뷰가 flex로 지정되면 자식 뷰들은 부모 뷰 내에서 유연하게 크기와 위치를 조정할 수 있습니다. 예를 들어, 부모 뷰가 다음과 같이 flex 속성을 가지고 있다면: 자식 뷰들은 다음과 같이 flex 속성을 이용하여 크기와 위치를 조정할 수 있습니다. {/* 이 뷰는 부모 뷰의 1/2 크기를 가지고 있음 */} {/* 이 뷰는 부모 뷰의 1/3 크기를 가지고 있음 */} {/.. Dev/React Native 2023. 5. 2. ReactNative: 5/2 공부일지 - Date() React Native에서 Date()는 JavaScript에서 기본적으로 제공되는 Date 객체를 사용하여 날짜와 시간에 관련된 작업을 수행하는 데 사용됩니다. Date 객체는 현재 날짜와 시간을 반환하는 메서드와 특정 날짜와 시간을 나타내는 데 사용되는 다양한 속성을 제공합니다. React Native에서 Date()를 사용할 때, 일반적으로 다음과 같은 작업을 수행합니다. 1. Date 객체 생성 const currentDate = new Date(); 2. 특정 날짜와 시간을 사용하여 Date 객체 생성 const someDate = new Date('May 2, 2023 10:30:00'); 3. 날짜와 시간의 특정 부분 추출 const year = currentDate.getFullYear().. Dev/React Native 2023. 5. 2. 이전 1 ··· 4 5 6 7 8 다음