슬롱주리 Selon Julie

MDN | Element: click event MDN | Element: mousedown event 이벤트 실행 순서 mousedown -> mouseup -> click click mousedown 발현되는 시점 포인터가 요소 내부에 있을 때, 포인팅 장치의 버튼이 눌리고, 떼일 때 만약 버튼이 한 요소에서 눌리고, 다른 요소에서 떼진다면 두 요소가 포함된 상위 요소에서 이벤트가 발현됨 포인터가 요소 내부에 있을 때, 포인팅 장치의 버튼이 눌릴 때 (떼기 전) 포인팅 장치 마우스의 왼쪽 클릭 마우스의 아무 버튼 사용처 간단한 상호 작용 -링크 열기, form 제출 복잡한 상호작용 -드래그 앤 드롭, 텍스트 선택, 선 그리기 등

JavaScript에서 some과 every는 주어진 조건에 대해 배열의 요소를 테스트하는데 사용되는 배열 메서드입니다. some()메서드는 배열의 요소 중 하나 이상이 조건을 충족하는지 확인하고 불리언 값을 반환합니다. 조건을 만족하는 요소가 하나 이상 있으면 true를 반환합니다. 그렇지 않으면 false를 반환합니다. syntax // 화살표 함수 some((element) => { /* … */ }) some((element, index) => { /* … */ }) some((element, index, array) => { /* … */ }) // 콜백 함수 some(callbackFn) some(callbackFn, thisArg) // 인라인 콜백 함수 some(function (eleme..

부트캠프가 끝나고 적극적으로 취업 준비를 하면서, 첫 단계인 서류 통과를 해야겠지만 서류 통과를 하더라도 면접이 기다리고 있다. 2022년 10월~11월 동안 다섯 곳 정도 면접을 보았는데 나와 같은 취업 준비생들이 도움이 되길 바라며 그 때 받은 기술 질문들은 모아봤다. 면접을 본 기업은 Javascript, React를 기술스택으로 쓰는 50인 이하 스타트업들이었다. 프론트엔드 채용을 위한 기술면접 질문들이다. 특히나 Redux를 사용한 경험과, Typescript를 사용한 경험은 모든 회사에서 물어보았다. 답변이 부족했던 질문에 대해서는 다시 찾아보고 공부하는 과정을 반복하였다. 모든 질문에 완벽하게 답하기란 어렵지만, 분명 미리 대비하고 면접을 임한다면 후회없이 면접을 볼 수 있을것이다. [일반]..

오늘 알고리즘의 재귀 문제를 풀면서 배열을 다룰 일이 있었다. 배열에서 한 요소씩 잘라내는 것이 핵심이였는데, 익숙하게 사용하던 slice메서드가 생각나지 않아 shift를 썼다. 두 메서드 다 배열의 요소를 줄인다는 공통점이 있지만 어떤 것이 다른지 궁금해졌다. shift() 배열에서 첫 번째 요소를 제거하고, 제거된 요소를 반환합니다. 이 메서드는 배열의 길이를 변하게 합니다. arr.shift() slice() 어떤 배열의 begin부터 end까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환합니다. 원본 배열은 바뀌지 않습니다. arr.slice([begin[, end]]) 차이점 무엇을 반환하나? shift: 제거된 (첫 번째) 요소 slice: 추출한 요소를 포함한 새로운 배열..

MDN | Logical AND && 단축 평가 Short-circuit evaluation 논리 AND 표현식은 단축 평가 연산자입니다. 각 피연산자가 불리언 값으로로 변환될 때 한 변환의 결과가 거짓으로 판명되면 AND 연산자가 중지되고 해당 거짓 피연산자의 원래 값을 반환합니다. 나머지 피연산자는 평가하지 않습니다. => 표현식을 평가하는 도중에 평가 결과가 확정된 경우 나머지 평가 과정을 생략하는 것 (some falsy expression) && expr 첫 번째 피연산자(일부 거짓 표현식)가 거짓으로 평가되기 때문에 expr 부분은 평가되지 않습니다. expr이 함수이면 함수가 호출되지 않습니다. 논리곱&&연산자는 두 개의 피연산자가 모두 true로 평가될 때 true를 반환한다. 논리곱 연사..

Javascript Info | 옵셔널 체이닝 MDN | 옵셔널 체이닝 옵셔널 체이닝 연산자란? ?.은 ?.'앞’의 평가 대상이 undefined나 null이면, 평가를 멈추고 undefined를 반환. 그렇지 않으면 뒤의 프로퍼티 참조를 이어감 let user = {}; // 주소 정보가 없는 사용자 alert( user?.address?.street ); // undefined, 에러가 발생하지 않습니다. 옵셔널 체이닝이 필요한 이유 사례1 사용자가 여러 명 있는데 그중 몇 명은 주소 정보를 가지고 있지 않다고 가정해봅시다. 이럴 때 user.address.street를 사용해 주소 정보에 접근하면 에러가 발생할 수 있습니다. let user = {}; // 주소 정보가 없는 사용자 alert(use..

출처 노마드 코더 | Export Default 과연 제대로 알고계십니까? 모듈 덕분에 import, export가 가능 모듈 module 어플리케이션을 구성하는 개별적 요소. 재사용 가능한 코드조각. Dynamic modules를 이용하면 앱을 더 빠르게 구동할 수 있음 코드를 import, export를 하는데는 다양한 방법이 존재 Named exports 파일내부의 많은 코드를 import, export할 때 사용 import하려는 함수의 이름과 export 함수의 이름이 동일해야함. 아니면 작동하지 않음 중괄호{} 내부에 동일한 이름으로 import export const plus = (a, b) => a+b; export const minus = (a, b) => a-b; export const..

1. 오타 2. for반복문의 조건에 세미콜론;대신 쉼표,쓰기 for (1.초기화; 2.반복조건; 3.반복갱신) for문 뒤에오는 3가지 요소를 구분할때는 쉼표가 아닌 세미콜론;을 사용하여 구분 let str = ''; for (let i = 0; i < 9; i++) { str = str + i; } console.log(str); // expected output: "012345678" 3. 일치연산자(===)대신 대입연산자(=) 사용 변수에 값을 대입 할때는 대입연산자(=), 비교를 통해 true, false를 나눌때는 일치연산자(===) 4. DB를 연결할 때 .env폴더에 있는 내용은 '' 및 ;를 모두 제거

//각각의 원소를 보여주는 콜백함수 만들기 const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; function callback(element){ console.log(element) } words.filter(callback); 콜백함수란? 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수 함수를 합성하여 변하지 않는 공통로직은 미리 정의해두고, 변경되는 로직은 추상화해서 함수 외부에서 함수 내부로 전달 자바스크립트는 함수의 일급 객체이므로 함수의 매개변수를 통해 함수를 전달 할 수 있음 용도 : 순차적으로 실행하고 싶을 때 특징 DB에서 데이터를 가져올 때 많이 사용 다른데서 만든 함수도 콜백함수로 ..

strs은 단어가 담긴 배열입니다. 공통된 시작 단어(prefix)를 반환해주세요. 예를 들어 strs = ['start', 'stair', 'step'] return은 'st' strs = ['start', 'wework', 'today'] return은 '' 마지막 줄은 문제가 덜 쓰인건 줄 알았는데, 그게아니라 공통된 시작 단어가 없는 경우에는 '', 즉 빈 문자열을 반환하라는 이야기였다. 함께 리뷰해준 팀원분의 코드를 보면, const getPrefix = strs => { let answer=[]; if (strs[0]===undefined){ return "" } for (i=0; i< strs.length; i++){ for (j=1; j { let answer=[]; if (strs[0]=..