전체 글

피어나는 프론트엔드 개발자 이도이입니다. 방문해주셔서 감사합니다🌱
배열에 값을 추가하는 함수배열.push(변수) : 배열의 맨 끝에 값을 추가한다.배열.unshift(변수) : 배열의 맨 앞에 값을 추가한다.  배열에 값을 제거하는 함수배열.pop(변수) : 배열의 맨 끝에 값을 제거한다.배열.shift(변수) : 배열의 맨 앞에 값을 제거한다. 문자열.substring() : 특정 문자열을 잘라내여 반환string.substring(start, end) substr() 함수와 다른 점은 매개변수로 잘라내고 싶은 문자열의 start index와 last index를 전달한다는 것let str = "안녕하세요?"let first_char = str.substring(0, 1); //안let second_char = str.substring(1, 2); //녕let las..
✅Sort()함수란? sort 메서드는 배열의 요소를 정렬하는데 사용하는 함수이다. sort() 함수를 활용해서 문자와 숫자 모두 잘 정렬되는 것을 볼 수 있다. 하지만, Sort()는 기본적으로 유니코드값으로 정렬하기 때문에 예상과 다르게 출력될 수 있다. 그러므로 숫자를 정렬하려면 compareFunction 필요하다 ✅compareFunction compareFuction은 정렬 순서를 정의하는 함수로, 반환 값은 복사본이 만들어지지 않고 원 배열이 정렬됩니다. sort를 빼고 쓰면 다시 정렬되지 않은 상태로 돌아간다. Digit.sort((a, b) => a-b); //오름차순 Digit.sort((a, b) => b-a); //내림차순 위의 숫자를 정렬하기 위해 사용한 것이 compareFunc..
React Lifecycle mounting -> 태어나는 것 , component가 화면에 표시될 때  render 후 componentDidMount실행 updating -> update의 원인, state를 변경하는 것이 update 이다.  (setstate)unmounting - > 페이지를 바꿀 때 component 가 죽는 것   React에서 window나 document에 addEventListener를 통해 이벤트를 추가할 때, 그냥 사용하게 되면 렌더링 시점이 구분이 되지 않기 때문에 에러가 난다. useEffect를 이용해서 최초 로드 시에 이벤트를 추가해주면 이벤트 감지가 시작되어 에러를 일으키지 않는다. 마우스에 움직임을 감지하는 js코드를 react에 집어넣으려고 했더니 그냥 ..
✅문제설명 명함 지갑을 만드는 회사에서 지갑의 크기를 정하려고 합니다. 다양한 모양과 크기의 명함들을 모두 수납할 수 있으면서, 작아서 들고 다니기 편한 지갑을 만들어야 합니다. 이러한 요건을 만족하는 지갑을 만들기 위해 디자인팀은 모든 명함의 가로 길이와 세로 길이를 조사했습니다. 아래 표는 4가지 명함의 가로 길이와 세로 길이를 나타냅니다. 명함 번호가로 길이세로 길이 가장 긴 가로 길이와 세로 길이가 각각 80, 70이기 때문에 80(가로) x 70(세로) 크기의 지갑을 만들면 모든 명함들을 수납할 수 있습니다. 하지만 2번 명함을 가로로 눕혀 수납한다면 80(가로) x 50(세로) 크기의 지갑으로 모든 명함들을 수납할 수 있습니다. 이때의 지갑 크기는 4000(=80 x 50)입니다. 모든 명함의..
✅문제설명 새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이용료가 100이었다면 2번째에는 200, 3번째에는 300으로 요금이 인상됩니다. 놀이기구를 count번 타게 되면 현재 자신이 가지고 있는 금액에서 얼마가 모자라는지를 return 하도록 solution 함수를 완성하세요. 단, 금액이 부족하지 않으면 0을 return 하세요. ✅입출력 예 💡내가 작성한 코드 function solution(price, money, count) { let Pcount = []; for( let i = 1; i {return acc+x},0) if(Sum_count ..
📌next.js - favicon 기본 설정 npm run dev로 실행시키면 위의 title과 아이콘이 저렇게 기본설정 되어있다. 나는 저것을 이렇게 바꿔주었다. 아주아주 간단하다. 📌next.js - favicon 수정 export const metadata = { title: "도이 포트폴리오", description: "Generated by 도이", icons: { icon: "/tree.png", }, }; public파일 아래 사진을 추가한뒤 layout.js 에서 파일에서 metadata 객체에 icons 속성을 추가해주면 된다. 이 사진은 지워줘야 적용이 된다. 📌13버전 이후 바뀐 메타 태그 방식 라우팅 규칙이 변경됨에 따라 SEO에서 필수적인 메타태그 적용 방법도 달라졌다. 기존 Pa..
✅문제설명 정수가 담긴 리스트 num_list가 주어질 때, 모든 원소들의 곱이 모든 원소들의 합의 제곱보다 작으면 1을 크면 0을 return하도록 solution 함수를 완성해주세요. ✅입출력 예 💡내가 작성한 코드 function solution(num_list) { let Sum_multiply = num_list.reduce( (acc, x, idx)=>{ return acc + x} ,0 ) let multiply = num_list.reduce( (acc, x, idx)=> { return acc*x} ,1 ) if(Sum_multiply*Sum_multiply > multiply ){ return 1 }else{ return 0 } } 비교적 빠르게 해결할 수 있었던 문제 변수 이름 짓는 ..
✅문제설명 ✅입출력 예 💡내가 작성한 코드 function solution(a, b, c) { let one = a+b+c let two = Math.pow(a,2) + Math.pow(b,2) + Math.pow(c,2) let three = Math.pow(a,3) + Math.pow(b,3) + Math.pow(c,3) if(a == b && a == c){ return one*two*three }else if( a !== b && b !== c && a !== c){ return one }else if(a == b !== c || a !== b == c || a == c !== b ){ return one*two} } 내가 작성한 코드 처음에는 if(a == b== c)로 했다가 변수 3가지를 비..
2-doooo-2
doyI-T