seungineer

결론Nullable field에 NULL 값이 하나라도 포함되는 경우, WHERE 'A' NOT IN (nullable field)의 경우 항상 false로 평가된다. 이에 Nullable field에서 'A'가 존재하지 않는 경우에 대해 조건을 걸고자 하는 경우 WHERE NOT EXISTS (nullable field에 NULL을 제외한 'A'인 경우의 서브 쿼리)의 형태로 구현해야 한다. 서브쿼리에는 'A'가 존재하지 않을 시 아무 것도 존재하지 않게 되고, NOT EXISTS()는 true가 된다. 3중 논리MySQL의 3중 논리에 의해서 'True', 'False', 'Unknown' 중 하나로 논리가 결정된다. 가령 WHERE 'A' IN ('A', NULL, 'B') 라고 하면, 서브쿼리에 ..

오늘 백준 17298 '오큰수' 문제를 풀면서 드디어(..!) 스택 자료 구조를 사용해야 하는 상황임을 알 수 있는 직관을 얻을 수 있었다. 재귀, dynamic programming에서 이런 직관을 얻고, PS 역량이 약간 올라갔다고 체감했던 터라 기분 좋은 깨달음이었다.스택 자료 구조는 양파 껍질 같은 상황에서 쓰인다.정글 과정 중 코치님께서 하신 말씀이다. 그때 당시에는 백준 9012 '괄호'와 같은 문제를 풀면서 어렴풋이 '문제가 양파 같긴 하다' 정도로 생각하고 끝났다. 그런데 사실은 더 큰 뜻이 있었다.양파 '껍질'이라, 양파 안은 관심이 없다!9012 '괄호' 문제와 같이 올바르게 괄호가 닫혔는지 확인할 때를 가정한다. (()(())) 이 case의 경우 가장 마지막에 빨간색 ')'으로 닫히..

2024.08.06 - [🛠️ Tool/FE] - [LeetCode-JS 30 days] #2. Array Transformation - 1(#순회) [LeetCode-JS 30 days] #2. Array Transformation - 1(#순회)2024.08.03 - [🛠️ Tool/FE] - [LeetCode-JS 30 days] #1. Closures 개념 - 1(#은닉 #보존) [LeetCode-JS 30 days] #1. Closures 개념 - 1(#은닉 #보존)알기 쉽게 쓰였고 많은 사람들에게 검증된 설명이 LeetCode Discuss에 올라오seungineer.tistory.com알기 쉽게 쓰였고 많은 사람들에게 검증된 설명이 LeetCode Discuss에 올라오는 것을 확인하고,..

2024.08.03 - [🛠️ Tool/FE] - [LeetCode-JS 30 days] #1. Closures 개념 - 1(#은닉 #보존) [LeetCode-JS 30 days] #1. Closures 개념 - 1(#은닉 #보존)알기 쉽게 쓰였고 많은 사람들에게 검증된 설명이 LeetCode Discuss에 올라오는 것을 확인하고, JS Basic 공부에 이를 활용해보고자 하였다. LeetCode PS처럼 문제를 해결하며 JS의 basic skill을 익힐 수 있도seungineer.tistory.com 알기 쉽게 쓰였고 많은 사람들에게 검증된 설명이 LeetCode Discuss에 올라오는 것을 확인하고, JS Basic 공부에 이를 활용해보고자 하였다. LeetCode PS처럼 문제를 해결하며 J..

알기 쉽게 쓰였고 많은 사람들에게 검증된 설명이 LeetCode Discuss에 올라오는 것을 확인하고, JS Basic 공부에 이를 활용해보고자 하였다. LeetCode PS처럼 문제를 해결하며 JS의 basic skill을 익힐 수 있도록 구성되어 있다.ClosuresBasic Array TransformationsFunction TransformationsPromises and TimeJSONClasses총 6개의 Part로 구성되며 본 포스트에서는 Closures(클로져)에 대해 다룬다.Create Hello World Function문제를 푸는 것보다 해당 문제의 Discuss를 보는 게 더 중요하다!요약Lexical environment는 closure가 생성될 당시 scope 내의 모든 변수..

어떤 웹사이트에서 form을 입력할 때 입력이 모두 완료되면 자동으로 다음 입력해야 하는 빈칸으로 넘어가도록 구현된 웹사이트가 많다. id와 pw를 입력받을 때 id를 10자 이상 입력하면 pw 입력 칸으로 바로 넘어가는 기능을 구현하던 중 React의 배치 업데이트 특성을 잘 살려서 구현되었는지 의문이 들었다.구현 App.js의 App() 컴포넌트에서 return 하는 input tag를 다음과 같이 구현할 수 있다.function App() { ... useEffect(() => { if (id.length >= 10) { pwRef.current.focus(); } }, [id]); return ( 아이디 : ..

구현을 위한 MEMOindex.html에 라이브러리 스크립트로 이미 포함되어 있기에 전역 객체로 추가되어 있음- 따로 import 하지 않아도 사용 가능// ex)const randomNumber = Random.pickNumberInRange(1, 9);import모듈에서 여러 멤버를 가져올 수 있다. 아래의 import로 현재 범위 내에 foo, bar 멤버를 포함시킬 수 있다.import { foo, bar } from "my-module.js";commit message convention(Angular JS)- 커밋 전에 확인하기!!더보기Subject lineSubject line contains succinct description of the change.Allowed feat (featur..

2.1 const, let을 이용한 변수 선언var를 이용한 변수 선언의 문제점- 덮어쓰기 가능 : 한 번 정의한 변수에 다른 값을 대입할 수 있음(의도하지 않게 덮어써질 수 있기에 무조건 덮어쓰는 것은 좋지 않음)- 재선언 가능 : 프로그램 실행 순서에 따라 어느 변수가 사용되는지 해석하기 어려움(var가 '변수'라는 뜻이기에 둘 다 변동 가능하다고 생각, var는 자주 사용하지 않음) let을 이용한 변수 선언- 덮어 쓰기 가능- 재선언 불가능(let이 'OO이라 하자~'라는 뜻이기에 선언은 한 번 했고, 덮어쓰기는 가능한 var가 선언되었다고 생각)let v1 = 3;console.log(v1) // 3v1 = "문자열로 덮어써버리기~~";console.log(v1) // 문자열로 덮어써버리기~~t..

1.5 모듈 핸들러, 트랜스파일러리액트의 'create-react-app'을 사용하면 모듈 핸들러, 트랜스파일러 의식하지 않고도 개발할 수 있다. 하지만 복잡한 프로젝트인 경우 설정 파일을 조작할 필요가 있기에 내부 구조와 개념을 아는 것이 매우 중요하다.모듈핸들러자바스크립트는 기본적으로 '세세하게 나누어' 개발하는 것이 효율적이다. 이렇게 개발할 때 프로덕션 환경에서 로딩 횟수가 늘어나 성능이 저하되기도 한다. 그래서 개발할 때는 파일을 나누고, 프로덕션 용으로 빌드할 때는 파일 하나에 모으기 위해 js 파일이나 css 파일 등을 한데 합쳐주는 '모듈 핸들러'가 만들어졌다(세세하게 나뉘어 개발된 것을 '모듈', 이 모듈을 다뤄주는 게 '핸들러'라고 생각).트랜스파일러자바스크립트 표기법을 브라우저에서 실..

정글 동기들의 피드백을 받아서 블로그를 수정하고자 HTML 편집을 해보았다. 기존에는 사이드바 HTML 박스에 있던 github contribution graph를 블로그 상단으로 올리는 게 목적!사이드바의 요소를 단순히 블로그 상단의 Header Div에 위치시키면 되겠거니 간단하게 생각했는데, 제대로 되지 않았다.버그사이드바에 있던 를 그대로 가져와서 내 위치시켰으나 스크립트가 제대로 작동하지 않았다. 위 이미지처럼 요소에 기본 문구로 넣어둔 'Loading data...'만 표시되었고, script가 작동되어 요소를 알맞은 형태로 수정해줘야 하는데 그러지 못 하고 있었다.디버그이 문제의 원인은 스크립트 로딩 순서의 문제였다.HTML 문서는 브라우저에 의해서 파싱되어 DOM트리로 변환된다. HTML..