전체 글

문제 설명 정수 n이 매개변수로 주어질 때 n의 각 자리 숫자의 합을 return하도록 solution 함수를 완성해주세요 제한사항 0 ≤ n ≤ 1,000,000 입출력 예 n result 1234 10 930211 16 입출력 예 설명 입출력 예 #1 1 + 2 + 3 + 4 = 10을 return합니다. 입출력 예 #2 9 + 3 + 0 + 2 + 1 + 1 = 16을 return합니다. function solution(n) { var number = String(n).split(''); var answer = 0; for (i=0; i

문제 설명 각에서 0도 초과 90도 미만은 예각, 90도는 직각, 90도 초과 180도 미만은 둔각 180도는 평각으로 분류합니다. 각 angle이 매개변수로 주어질 때 예각일 때 1, 직각일 때 2, 둔각일 때 3, 평각일 때 4를 return하도록 solution 함수를 완성해주세요. 예각 : 0

문제 설명 정수가 담긴 배열 array와 정수 n이 매개변수로 주어질 때, array에 n이 몇 개 있는 지를 return 하도록 solution 함수를 완성해보세요. 제한사항 1 ≤ array의 길이 ≤ 100 0 ≤ array의 원소 ≤ 1,000 0 ≤ n ≤ 1,000 입출력 예 array n result [1, 1, 2, 3, 4, 5] 1 2 [0, 2, 3, 4] 1 0 입출력 예 설명 입출력 예 #1 [1, 1, 2, 3, 4, 5] 에는 1이 2개 있습니다. 입출력 예 #2 [0, 2, 3, 4] 에는 1이 0개 있습니다. function solution(array, n) { var count = 0; for (i=0; i

벨로퍼트 리액트 - 24. 클래스형 컴포넌트 클래스형 컴포넌트 : 지금은 잘 상용하지 않으나 유지보수와 지원이 되지 않는 경우를 대비해 알아둘 필요 있음 클래스형 컴포넌트 사용방법 import React, { Component } from 'react'; class Hello extends Component { render() { const { color, name, isSpecial } = this.props; return ( {isSpecial && *} 안녕하세요 { name } ); } } Hello.defaultProps = { name: '이름없음' } export default Hello; render() : 필수! 이 메서드에서 렌더링하고싶은 JSX를 반환하면 된다. this.props :..

문제 설명 정수 배열 numbers가 매개변수로 주어집니다. numbers의 각 원소에 두배한 원소를 가진 배열을 return하도록 solution 함수를 완성해주세요. 제한사항 -10,000 ≤ numbers의 원소 ≤ 10,000 1 ≤ numbers의 길이 ≤ 1,000 입출력 예 numbers result [1, 2, 3, 4, 5] [2, 4, 6, 8, 10] [1, 2, 100, -99, 1, 2, 3] [2, 4, 200, -198, 2, 4, 6] 입출력 예 설명 입출력 예 #1 [1, 2, 3, 4, 5]의 각 원소에 두배를 한 배열 [2, 4, 6, 8, 10]을 return합니다. 입출력 예 #2 [1, 2, 100, -99, 1, 2, 3]의 각 원소에 두배를 한 배열 [2, 4,..

문제 설명 문자열 my_string이 매개변수로 주어집니다. my_string을 거꾸로 뒤집은 문자열을 return하도록 solution 함수를 완성해주세요. 제한사항 1 ≤ my_string의 길이 ≤ 1,000 입출력 예 my_string return "jaron" "noraj" "bread" "daerb" 입출력 예 설명 입출력 예 #1 my_string이 "jaron"이므로 거꾸로 뒤집은 "noraj"를 return합니다. 입출력 예 #2 my_string이 "bread"이므로 거꾸로 뒤집은 "daerb"를 return합니다. function solution(my_string) { return my_string.split('').reverse().join(''); } // .split(separa..

벨로퍼트 리액트 - 23. Immer를 사용한 더 쉬운 불변성 관리 불변성 관리 리액트에서 배열, 객체를 업데이트 할때는 직접 수정하는것이 아니라 불변성을 지켜주면서 업데이트를 해야한다. push, splice등의 함수를 사용하거나 n번째 항목을 직접 수정하는 것이 아니라 concat, filter , map 등 동작 후 새로운 배열을 만들어주는 함수를 사용해야 한다. // 잘못된 예 const object = { a: 1, b: 2 }; object.b = 3; // 바른 예 const object = { a: 1, b: 2 }; const nextObject = { ...object, b: 3 }; 대부분의 경우 …(스프레드 연산자)또는 배열 내장함수를 사용하면 되지만 데이터의 구조가 복잡해질경우 불..

Vanilla JS로 댓글 기능이 있는 게시판 만들기_3일차 🧱 3일차 구현 내용 3일차에 목표로 했던 부분이다! 그리고 드디어 성공했다😎 list li에 클릭이벤트 걸기 1-1. li를 클릭시 댓글 영역이 slideDown 효과와 함께 나타나고 다시 클릭하면 slideUp 효과와 함께 사라진다. 삽질 n시간만에 드디어 해결! 그래서 오늘은 어떤 문제가 있어서 어떻게 해결했는지를 간략하게 써보려고 한다. 문제1 listLis.forEach(function(listLi){ listLi.addEventListener('click', function(event){ // .contains() : class의 유무를 확인 if (event.target.replyBox.classList.contains('show'..

Vanilla JS로 댓글 기능이 있는 게시판 만들기_2일차 🧱 2일차 구현 내용 2일차에 목표로 했던 부분은 아래와 같다. list li에 클릭이벤트 걸기 1-1. li를 클릭시 댓글 영역이 slideDown 효과와 함께 나타나고 다시 클릭하면 slideUp 효과와 함께 사라진다. 댓글작성버튼 클릭시 유효성 검사(댓글 작성자, 댓글 내용) 2-1. 댓글 작성자 또는 댓글 내용이 비어있다면 alert과 함께 해당 부분에 포커스 주기 목표를 세우긴 했는데 뭔가 좀 막혀서 엄청 삽질만 했다. 그래서 오늘은 구현 내용이라고 하긴 했지만 그냥 삽질 기록이다 🙄 list li 클릭이벤트 const btnAddReply = document.getElementsByName('btnAddReply'); const li..

Vanilla JS로 댓글 기능이 있는 게시판 만들기_1일차 📚 프로젝트 주제와 목표 Vanilla JS만 사용하여 댓글 기능이 있는 게시판을 만드는 과제를 하게 되었다. 솔직히 걱정은 좀 됐지만 안될때 조금씩 참고해보라고 원본 소스파일을 주시기도 했고 구글링도 있으니까 일단 해보기나 하자는 생각이다. 목표는 최대한 원본 소스를 참고하지 않고 기능을 똑같이 구현해보는 것이다. 💻 필요한 기능 이 프로젝트(라기엔 많이 사소하지만 어쨌든)에 필요한 기능은 아래와 같다. 순수 자바스크립트(Vanilla JS)로 작업할것 글쓰기 버튼을 누르면 상단의 글 목록에 작성한 게시글이 등록된다. 2-1. 작성자, 제목, 내용 중 하나라도 빈 값이 있다면 게시글을 등록하지 않고 오류 메시지를 띄운다.(유효성 체크) 2-2..