Timeline

Q. strs은 단어가 담긴 배열입니다. 공통된 시작 단어(prefix)를 반환해주세요. 예를 들어 strs = ['start', 'stair', 'step'] return은 'st' strs = ['start', 'wework', 'today'] return은 '' A. function getPrefix(strs) { if (strs.length === 0) return ''; let prefix = strs[0]; for (let i = 1; i < strs.length; i++) { while (strs[i].indexOf(prefix) !== 0) { prefix = prefix.substring(0, prefix.length - 1); } } return prefix; } 문제 해결 과정 우선 ..

Q . 숫자인 num을 인자로 넘겨주면, 뒤집은 모양이 num과 똑같은지 여부를 반환해주세요. num: 숫자 return: true or false (뒤집은 모양이 num와 똑같은지 여부) 예를 들어, num = 123 return false => 뒤집은 모양이 321 이기 때문 num = 1221 return true => 뒤집은 모양이 1221 이기 때문 num = -121 return false => 뒤집은 모양이 121- 이기 때문 num = 10 return false => 뒤집은 모양이 01 이기 때문 A. const sameReverse = num => { const stringNum = num.toString(); return stringNum === stringNum.split('').r..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! 1. react가 많이 사용되는 이유? -react의 등장 배경 현재 웹 어플리케이션이 동적인 상호작용이 많아지고 다뤄야 할 데이터와 코드가 증가하게 됨 -> dom에 직접 접근해서 조작하는 방법으로는 유지보수하기 어려워짐 -> 생산성 향상과 유지보수의 편의를 위해 다양한 framework와 library가 등장 -react가 많이 사용되는 이유 1) 자바스크립트의 library로 자바스크립트의 문법을 그대로 활용함 2) 사용자가 많고 커뮤니티가 발달됨 3) react native를 통해 모바일 어플리케이션 개발도 가능함 -framework vs library framework : 틀 -> 정해진 틀 속에서만 그 흐름에 따라 수동적으로 작업 lib..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! MDN https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Template_literals 1. template literal이란 -ES6 이전에는 템플릿 문자열이라고 부르던 것을 ES6에서 템플릿 리터럴 이라고 부르게 되었음 -문자열 삽입, 표현식 삽입, 여러 줄 문자열 생성 등 다양한 기능을 제공함 2. 기본 사용법 -백틱(`)이라는 문자 사이에 문자열을 입력하고 ${variable}로 변수를 주입시켜 문자열을 작성함 ex. 3. 다양한 기능 설명 -문자열 삽입 -표현식 삽입 -여러 줄 문자열 생성 전체를 백틱(`)으로 감싸면 \ 기호를 사용하지 않고 여러 줄 문자열을 작성할 수 있음..

github에서 repository를 만들고 이 repository와 나의 local branch를 연결하는 방법을 정리해봅시다! [repository를 혼자 사용하는 경우] 1. github에서 repository를 만든다 저는 이름은 gitttest로 설정하고 README file이 존재하는 repository를 만들었습니다 2. github에서 관리하고 싶은 local 폴더에 branch를 만든다 저는 index.md 파일이 들어있는 upload 폴더를 github 저장소와 연결하겠습니다 우선 branch를 만들기 위해 terminal에서 upload 파일이 있는 곳에 위치합니다 git init을 입력하면 main branch가 만들어집니다 main branch에서 git add .와 git com..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! 1. 이벤트 버블링 event bubbling -특정 화면 요소에서 이벤트가 발생했을 때 해당 이벤트가 더 상위의 화면 요소들로 전달되는 이벤트 전파 방식 -가장 아래에 있는 태그에서 이벤트가 발생했을 때 최상위 요소 태그까지 이벤트가 전달됨 -브라우저는 특정 화면 요소에서 이벤트가 발생했을 때 그 이벤트를 최상위에 있는 화면 요소까지 이벤트를 전파시키기 때문에 하위 -> 상위 -> 최상위 순으로 클릭 이벤트가 진행됨 2. 이벤트 캡쳐 event capture -이벤트 버블링과 반대 방향으로 진행되는 이벤트 전파 방식 -특정 이벤트가 발생했을 때 최상위 요소에서 해당하는 태그를 찾아 내려감 -capture의 default값은 false이기 때문에 ..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! 1. querySelector -형식 : element = document.querySelector(selectors); -selector의 구체적인 그룹과 일치하는 document의 첫 번째 element를 반환하고 일치하는 게 없으면 null 반환 -getElementById보다 구체적으로 selector를 지정할 수 있음 -getElementBy~와 달리 값이 바뀌어도 처음 가져왔던 값 그대로 유지됨 예를 들어 아래와 같은 코드에서 로고 이미지를 선택하는 경우. querySelector -> document.querySelector(.nav-left#logo-img); getElementById -> document.getElementById..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! 1. input -type 속성 button checkbox date email password radio search submit text ... https://developer.mozilla.org/ko/docs/Web/HTML/Element/Input : 입력 요소 - HTML: Hypertext Markup Language | MDN HTML 요소는 웹 기반 양식에서 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성합니다. 사용자 에이전트에 따라서 다양한 종류의 입력 데이터 유형과 컨트롤 위젯이 존재합니다. 입 developer.mozilla.org -안에서 사용 -스스로 닫는 태그 라서 하위 태그를 추가할 수 없어 디자인 폭이 좁음 이..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! 1. 증감연산자 연산자 기능 예시 ++ 항의 값에 1을 더함 val = ++num => num 값에 1 더한 후 val에 대입 val = num++ => val에 기존 num 값 대입 후 num 값에 1 더함 -- 항의 값에 1을 뺌 val = --num => num 값에 1 뺀 후 val에 대입 val = num-- => val에 기존 num 값 대입 후 num 값에서 1 뺌 ex1. int val; int num1 = 10; int num2 = 10; val = ++num1; => num1이 11로 증가하여 val 변수에 11이 대입됨 val = num2++; => val 변수는 10이고 num2만 11로 증가함 ex2. Q. 1부터 10까지 ..

! 공식문서를 참고해서 개념을 다시 한번 확인해주세요 ! consr arr = [1, 2, 3, 4, 5]; 라는 배열에 각 함수를 적용해보자 1. push() -배열의 끝에 아이템을 추가 ex. arr.push(6); => [1, 2, 3, 4, 5, 6] 2. pop() -배열의 마지막 아이템을 제거 ex. arr.pop(); => [1, 2, 3, 4] 3. shift() -배열의 첫번째 아이템을 제거 ex. arr.shift(); => [2, 3, 4, 5] 4. unshift() -배열의 첫번째에 아이템을 추가 ex. arr.unshift(6); => [6, 1, 2, 3, 4, 5] 5. splice() -splice(pos, length) pos번째 index부터 length만큼 아이템을 제..