목록~2022 작성 글 (113)
상권's
클로저 출처 MDN 클로저는 함수와 함수가 선언된 어휘적 환경의 조합이다. 클로저를 이해하려면 자바스크립트가 어떻게 변수의 유효범위를 지정하는지(Lexical scoping)를 먼저 이해해야 한다. 어휘적 범위 지정(Lexical scoping) 여기서 "lexical"이란, 어휘적 범위 지정(lexical scoping) 과정에서 변수가 어디에서 사용 가능한지 알기 위해 그 변수가 소스코드 내 어디에서 선언되었는지 고려한다는 것을 의미한다. 단어 "lexical"은 이런 사실을 나타낸다. 중첩된 함수는 외부 범위(scope)에서 선언한 변수에도 접근할 수 있다. 클로저는 자바스크립트의 강력한 기능 중 하나입니다. 자바스크립트는 함수의 중첩(함수 안에 함수를 정의하는것)을 허용하고, 내부함수가 외부 함수..
이번 한 주는 node server 구현에 이어서 노드js 미들웨어를 활용해서 statesAirline으로 비행기 조회, 예약, 변경, css 개발론, styled-component에 대해서 학습했습니다. 서버 개발은 흥미가 있어서 너무 즐겁게 학습을 했지만, css 관련 학습은 개인적으로 너무 힘들었습니다. 백엔드를 희망하고 있지만, css에 대해서도 학습을 해본만큼 어느정도 구현할 수 있도록 시간을 투자해서 학습을 해야겠다고 느꼈습니다. 그리고 토이 문제는 대게 수도 코드 작성이나 구현이 잘 되었습니다. 자바스크립 자료 구조와 알고리즘이라는 도서를 이용해서 알고리즘에 대해서 학습도 하고, 스터디를 통해서 토이나 자료구조에서 복습하니 큰 도움이 되었습니다. 토이 문제는 40분 정도 혼자 고민을 하고 이..
2021.10.29 오늘의 코플릿 문자열을 입력받아 문자열 내의 모든 괄호의 짝이 맞는지 여부를 리턴해야 합니다. 다음 단계에 맞춰 함수를 작성해 보세요 괄호의 종류를 단 한가지로 한정합니다. 괄호의 종류를 늘려 모든 종류의 괄호에도 작동하도록 합니다. 괄호를 제외한 문자열이 포함된 경우에도 작동하도록 합니다. // str.split('') 해서 배열로 만들어준다. // 앞에서 하나씩 빼면서 (, ) 가 맞다면 각각 다른 배열에 넣어준다. // 두 배열의 길이가 맞다면 true를 리턴한다. => )( 이렇게 입력되는 경우에도 true가 뜬다... // 절반으로 나눠서 진행하는 건 어렵다... => stack 처럼 진행을 한다. 첫 수도코드 => 처음에는 괄호들이 (, ) 이렇게 들어오든, ), ( 이렇게..
-2021.10.28 오늘의 코플릿- 정수를 요소로 갖는 배열을 입력받아 오름차순으로 정렬하여 리턴해야 합니다. 퀵 정렬을 구현해야 합니다. // 피벗을 정한다. bigger, smaller 빈배열을 만든다. // 피벗과 비교해서 작은 수는 smaller에 push하도록 하고 // 피벗보다 큰 수는 bigger에 push하도록 한다. // smaller와 bigger을 재귀하고 // smaller pivot bigger 순으로 배열을 합쳐서 리턴한다. 첫 수도코드 => 퀵 정렬이 pivot이라는 비교대상을 정한 후, 비교대상보다 큰 건 오른쪽, 작은 건 왼쪽으로 보내고, 왼쪽과 오른쪽도 재귀로 정렬을 하는 것이라고 구글링을 통해서 알았습니다. 새로운 배열을 만들지 않고 진행을 해보려고 했으나 그럴 경우에..
다음의 조건을 만족하면서 현재의 비밀번호('curPwd')를 새 비밀번호(newPwd)로 변경하는 데 필요한 최소 동작의 수를 리턴해야 합니다. 한 번에 한 개의 숫자만 변경가능하다.4자리의 소수(prime)인 비밀번호로만 변경가능하다. 정리하면, 비밀번호가 계속 소수를 유지하도록 숫자 한 개씩을 바꿔갈 때 현재 비밀번호에서 새 비밀번호로 바꾸는 데 최소 몇 개의 숫자를 변경해야 하는지를 리턴해야 합니다 인자 1 : curPwd number 타입의 1,000 이상 9,999 이하의 자연수 인자 2 : newPwd number 타입의 1,000 이상 9,999 이하의 자연수 // 소수(prime number)는 1보다 큰 자연수 중 1과 자기 자신만을 약수로 가지는 수 // 예를 들어, 5는 1×5 또는 ..
-2021.10.26 오늘의 코플릿- 부분적으로 오름차순 정렬*된 정수의 배열(rotated)과 정수(target)를 입력받아 target의 인덱스를 리턴해야 합니다. 부분적으로 정렬된 배열: 배열을 왼쪽 혹은 오른쪽으로 0칸 이상 순환 이동할 경우 완전히 정렬되는 배열 예시: [4, 5, 6, 0, 1, 2, 3]은 왼쪽으로 3칸 또는 오른쪽으로 4칸 순환 이동할 경우 완전히 정렬됩니다. // return rotated.indexOf(target) 시간복잡도 O(n) // 중간을 자른다. parseInt(rotated.length / 2) // 앞 서 학습했던 이진트리탐색을 이용해보자. 첫 수도코드 => 단순히 indexOf를 사용할 경우 시간 복잡도가 O(n)이 나오는데, 해당 문제에서는 O(logN..
고차 컴포넌트 출처 고차 컴포넌트(HOC, Higher Order Component)는 컴포넌트 로직을 재사용하기 위한 React의 고급 기술입니다. 고차 컴포넌트(HOC)는 React API의 일부가 아니며, React의 구성적 특성에서 나오는 패턴입니다. 구체적으로, 고차 컴포넌트는 컴포넌트를 가져와 새 컴포넌트를 반환하는 함수입니다. const EnhancedComponent = higherOrderComponent(WrappedComponent); 컴포넌트는 props를 UI로 변환하는 반면에, 고차 컴포넌트는 컴포넌트를 새로운 컴포넌트로 변환합니다. 고차 컴포넌트(HOC)는 Redux의 connect와 Relay의 createFragmentContainer와 같은 서드 파티 React 라이브러리..
오늘은 월, 화에 학습할 express에 대해서 예습을 진행했습니다. http 모듈을 express로 리팩토링했었는데, 요청에 따른 응답은 오지만, 콘솔도 확인이 안되어서(undefined) 예습하는 데 큰 어려움이 있었습니다. 학습했던 내용은 정규과정에 맞춰서 내일 TIL을 작성하도록 하겠습니다. 그리고 보일러플레이트도 다 완성이 되었는데 내일 아침에 한 번 더 검토 후 해당 과제는 마칠 예정입니다. express 때문에 생각보다 오랜 시간이 흘러 계획했던 걸 다 진행 못해서 아쉽지만, 어려움을 느꼈던 토이 문제를 검토하면서 유익한 시간을 보내서 다행입니다. 이번 한 주도 열심히 학습하고 복습하고 보내겠습니다. 정수를 요소로 갖는 배열을 입력받아 오름차순으로 정렬하여 리턴해야 합니다. 버블 정렬(bub..