Dev Diary 💻

Intro 안녕하세요. 이번시간에는 JavaScript array에서 배열의 마지막 값을 가져오는 방법에 대해 알아보겠습니다. How to solve the problem 아래의 number 가 들어있는 배열이 있다고 가정해봅시다. const arr = [1, 2, 3, 4, 5]; 배열의 총 길이에서 -1을 뺀 인덱스를 활용할 경우 배열의 마지막 값을 가져올 수 있습니다. arr[arr.length - 1];

Intro 안녕하세요. 이번 시간에는 DOM 접근을 통해 CSS Module의 classname을 가져오는 방법에 대해 알아보겠습니다 . How to solve the problem 저는 next.js 에서 특정 className 을 가져와서 제거해줘야 했습니다. CSS Module을 사용했기 때문에 파일 컴포넌트마다 아래의 형식으로 styles을 가져와서 스타일을 적용해줬습니다. import styles from './styles.module.css' 참고로 css module 내부 프로세스는 css 클래스나 css 파일을 통해 그 클래스의 이름을 고유하게 바꿔주는 역할을 합니다. 따라서 import하는 모든 css 파일을 고유하게 만들어 줍니다. 더 자세한 내용이 궁금하신 분들은 이 글 [React ..

Intro 안녕하세요. 이번 시간에는 JavaScript 에서 Object array 를 정렬하는 방법에 대해 알아보겠습니다. How to do 아래의 오브젝트 어레이가 있다고 가정해봅시다. const objectArray = [ { name: 'aa', year: 2008 }, { name: 'bb', year: 2004 }, { name: 'cc', year: 2003 }, { name: 'dd', year: 1996 }, { name: 'ee', year: 1995 }, { name: 'ff', year: 2015 } ]; javascript의 sort() 메서드를 통해서 year 필드 기준으로 오름차순 정렬을 해보겠습니다. objectArray.sort((x, y) => x.year - y.yea..

Intro 안녕하세요. 이번 시간에는 자바스크립트에서 특정 문자열을 제거하는 방법에 대해 알아보도록 하겠습니다. How to solve the problem 자바스크립트에서 특정 문자열을 제거하는 방법은 다양한데요, 그 중에서 저는 replace() 함수를 사용하여 특정 문자열을 제거해보겠습니다. replace()함수는 특정 문자열이 존재하거나 정규식에 만족할 경우, 원하는 문자열로 대체해 줍니다. const str = 'APPLE'; console.log(str.replace('A', '')); // 문자열 'A'를 빈 값으로 대체, result: PPLE console.log(str.slice('L', '')); // 문자열 L'를 빈 값으로 대체, result: APPE

Intro moment.js 라이브러리를 사용하여 날짜 객체를 다루던 도중 다음과 같은 오류가 발생했습니다. Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non RFC2822/ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to http://momentjs.com/guides/#/warnings/js-da..

Intro JavaScript의 Math.floor() 메소드에 대해 알아보도록 하겠습니다. Math.floor()? Math.floor() 함수는 항상 내림하여 주어진 숫자보다 작거나 같은 가장 큰 정수를 반환합니다. Syntax Math.floor(x) Parameters x : A number 숫자 Example Math.floor(-Infinity); // -Infinity Math.floor(-45.95); // -46 Math.floor(-45.05); // -46 Math.floor(-0); // -0 Math.floor(0); // 0 Math.floor(4); // 4 Math.floor(45.05); // 45 Math.floor(45.95); // 45 Math.floor(Infini..

Intro JavaScript의 parseInt() 메소드에 대해 알아보도록 하겠습니다. parseInt()란? parseInt() 함수는 문자열 인자를 파싱하여 특정 진수(수의 진법 체계에서 기준이 되는 값)의 정수를 반환합니다. Syntax parseInt(string) parseInt(string, radix) Parmaters string : 파싱할 값입니다. 문자열이 아닐 경우 ToString 추상 연산을 사용해 문자열로 변환합니다. 문자열의 선행 공백은 무시합니다. radix (optional) : string의 진수를 나타내는 2부터 36까지의 정수입니다. Example parseInt('0xF', 16) parseInt('F', 16) parseInt('17', 8) parseInt(021..

Intro javascript의 익명함수에 대해 알아보도록 하겠습니다. Anonymous function 익명 함수는 연결된 이름이 없는 함수입니다. 일반적으로 JavaScript에서 함수를 정의하기 위해 함수 이름 앞에 function 키워드를 사용하지만 JavaScript의 익명 함수에서는 함수 이름 없이 function 키워드만 사용합니다. 익명 함수는 처음 생성된 후에는 접근할 수 없으며 값으로 함수로 저장된 변수로만 접근할 수 있습니다. 익명 함수는 여러 인수를 가질 수도 있지만 하나의 표현식만 가질 수 있습니다. Syntax function() { // Function Body } → function 키워드를 사용하여 선언하였습니다. ( () => { // Function Body... } )..

Intro Axios의 catch() 문에서 Status Code 를 받아오는 방법에 대해 알아보도록 하겠습니다. 예를 들어 다음의 axios 요청이 있다고 가정해 봅시다. axios .get('foo.example') .then((response) => {}) .catch((error) => { console.log(error); //Logs a string: Error: Request failed with status code 404 }); 다음의 방법으로 console.log 로 찍어볼 경우 단순 string 만 반환하게 됩니다. return 된 object를 받고 싶을 경우 어떻게 해야 할까요? How to solve the problem axios.get('/foo') .catch(functio..

Intro JavaScript 에서 현재 시간을 기준으로 한달 전/후 날짜를 구하는 방법에 대해 알아보도록 하겠습니다. How to solve the problem let now = new Date();// 현재 날짜 및 시간 console.log("현재 : ", now); // 현재 : Fri Sep 30 2022 11:05:32 GMT+0900 (한국 표준시) let oneMonthAgo = new Date(now.setMonth(now.getMonth() - 1));// 한달 전 console.log("한달 전 : ", oneMonthAgo); // 한달 전 : Tue Aug 30 2022 11:05:32 GMT+0900 (한국 표준시) let now = new Date();// 현재 날짜 및 시간..