문제 > String 형인 str 인자에서 중복되지 않은 알파벳으로 이루어진 제일 긴 단어의 길이를 반환해주세요. str: 텍스트 return: 중복되지 않은 알파벳 길이 (숫자 반환) 예를 들어, str = "abcabcabc" return 은 3 => 'abc' 가 제일 길기 때문 str = "aaaaa" return 은 1 => 'a' 가 제일 길기 때문 str = "sttrg" return 은 3 => 'trg' 가 제일 길기 때문 모범 문제 풀이1 ```js const getLengthOfStr = str => { let countMax = 0; let countString = ''; for(let i=0; i 오늘 문제는 접근 방법조차 제대로 생각해내지 못했다. 독서를 통해 컴퓨터적 사고력을 ..
🍣 props - Component 속성을 설정할 때 사용하는 요소 - 해당 컴포넌트를 불러와 사용하는 부모 컴포넌트에서 사용가능 1️⃣ 컴포넌트를 사용할 때 pros 값 지정하기 부모 컴포넌트인 App 컴포넌트에서 MyComponent의 props 값을 지정, MyComponenet에서 props 사용 2️⃣ 비구조화 할당 문법을 통해 props 내부 값 추출하기 객체에서 값을 추출하는 문법 === 비구조화 할당(destructuring assignment) === 구조 분해 문법 함수의 파라미터가 객체라면 그 값을 바로 비구조화해서 사용할 수 있다. # 객체에서 값을 추출하는 비구조화 할당 const MyComponent = (props) => { const { name, title } = props..
SPA (Single Page Application) Westagram-fontend: longin.html, main.html 등 - 페이지 수 만큼 html 파일이 존재한다. 리액트 프로젝트에서 .html 파일의 개수는? 1개 ==> SPA 한 개의 웹페이지(html) 안에서 여러개의 페이지를 보여주는 방법? => Routing Routing 어떤 특정한 경로가 들어왔을 때 그 경로에 맞는 화면을 보여주는 것. 다시 말해 각각의 경로(url 주소)에 따라 다른 View(화면)을 보여주는 것이다. 리액트 자치에는 이러한 기능이 내장되어 있지 않다. ==> React Router : 리액트에서 라우팅 기능을 구현하기 위한 third-party 라이브러리 `npm install react-router-do..
문제 twoSum함수에 숫자배열과 '특정 수'를 인자로 넘기면, 더해서 '특정 수'가 나오는 index를 배열에 담아 return해 주세요. nums: 숫자 배열 target: 두 수를 더해서 나올 수 있는 합계 return: 두 수의 index를 가진 숫자 배열 예를 들어,nums은 [4, 9, 11, 14] target은 13 nums[0] + nums[1] = 4 + 9 = 13 이죠? 그러면 [0, 1]이 return 되어야 합니다. # 가정 target으로 보내는 합계의 조합은 배열 전체 중에 2개 밖에 없다고 가정하겠습니다.문제풀이 const nums = [4, 9, 11, 14]; const target = 14; const twoSum = (nums, targe..
댓글 좋아요/삭제 기능 구현 인스타 클론 코딩 중 각 게시글의 댓글에 좋아요 추가/삭제 기능을 구현하였다. 화면 구조는 아래와 같고 각 댓글의 DOM 구조는 아래 코드와 같다. john.johnson what the heck 채우기 색이 없는 하트와 채우기 색이 빨간색인 2가지 svg 파일이 각각의 .likeBtn에 들어있고, 각각 하얀 하트는 display="inline-block", 빨간 하트는 display="none" 값을 주어 하얀 하트만 버튼에서 나오게 되어있다. 첫번째 방법 const likeBtn = document.querySelector('button'); const svgs = likeBtn.getElementsByTagName('svg'); likeBtn.addEventListene..
예약어와 약속어 예약어 keyword 예약어(keyword)는 프로그래밍 언어에서 문법의 일종으로 미리 지정된 단어들이다. const a = `hello`;여기서 const 는 a rk 상수(const)임을 나타내는 예약어이다. 예약어는 식별자(identifier)의 이름으로 쓰일 수 없다. * await * break * case * catch * const * continue * debugger * default * delete * do * else * enum * export * extends * false * finally * for * function * if * implements * in * instanceof * interface * let * new * null * package * pr..