본문 바로가기

전체 글

 (117)
PS. FenwickTree 그전에 SegmentTree 오랜만에 세그먼트 트리 문제를 풀게 되었는데, 예전에 한창 풀다가 오랜만에 풀라고 하니까 기억이 안 나서 다시 정리를 하려고 한다. 보통 세그먼트 트리 문제들은 펜윅트리. 그래서 나도 펜윅트리를 알고 나서는 세그 트리 문제들 펜윅트리로 많이 풀었다. 근데 또 특정 값을 구하거나 그런 문제들에는 안되서 좀 변형하면 되긴한다. 근데 펜윅트리 같진 않다. 아무튼 펜윅트리를 알기 전에 당연히 세그 트리를 알면 좋고 세그 트리는 응용해서 다 풀 수 있다. 그래서 간단하게 세그먼트 트리 특징 정리하고 코드 보고 펜윅트리 비교하고 끝내겠다. 먼저 예제로는 백준 2042번 구간 합 구하기라는 문제를 풀 거다. 간단하게 정리하겠지만 전체 개념은 밑에 블로그를 참고하면 될 거 같다. 정말 디테일하게 정리해주셨다. http..
React. UseMemo, useCallback, React.Memo 오랜만에 리액트 정리하다가 프로젝트를 보는데 급하게 썼던 Hook들이 있어서 간단하게 글로만 정리를 하려 한다. 예시는 및에 참고글을 보면 좋을 거 같다. 일단 3개다 최적화를 위해서 사용된다. useMemo같은 경우 값을 저장했다가 다시 연산하지 않고 저장한 값을 쓰는 건데, 흔히 자주 듣는 memoized 개념이랑 같다. useMemo의 첫번째 파라미터에는 기존에 연산할 함수를 넣어주면 되고 두 번째는 deps배열을 넣어주면 되는데, 여기 있는 값이 바뀌면 함수를 호출해서 값을 새로 계산하고 아니면 기존에 저장한 값을 쓰는 거다. useEffect랑 비슷한 거 같다. 보통 렌더링이 될때마다 상관없는 함수들이 굳이 계속 호출되는데 이럴 때 useMemo를 써서 값이 바뀌지 않으면 위에서 말한 거처럼 호..
TS. 덕타이핑 타입스크립트를 공부하면서 Duck typing 이라는 개념이 나와 정리해 보려한다. 간단히 덕 타이핑의 정의를 보자. 위키피디아에서 덕 타이핑을 다음과 같이 정의한다. 컴퓨터 프로그래밍 분야에서 덕 타이핑(duck typing)은 동적 타이핑의 한 종류로, 객체의 변수 및 메소드의 집합이 객체의 타입을 결정하는 것을 말한다. 클래스 상속이나 인터페이스 구현으로 타입을 구분하는 대신, 덕 타이핑은 객체가 어떤 타입에 걸맞은 변수와 메소드를 지니면 객체를 해당 타입에 속하는 것으로 간주한다. “덕 타이핑”이라는 용어는 다음과 같이 표현될 수 있는 덕 테스트에서 유래했다. 만약 어떤 새가 오리처럼 걷고, 헤엄치고, 꽥꽥거리는 소리를 낸다면 나는 그 새를 오리라고 부를 것이다. 다음은 '오브젝트' 책에서 기능적..
TS. Type alias과 interface차이 오늘 간단하게 타입스크립트 개념을 공부하다가 비슷한 둘을 만나서 이펙티브 자바스크립트에서 찾아보니 관련 글이 있어서 정리하려 한다. 그전에 간단하게 오늘 공부한 타입스크립트 타입들에 대해 정리하고 가야겠다. 그중 기억에 남는 건 인덱싱이랑 딕셔너리 패턴인데 다음과 같다. //인덱싱 interface StringArray{ [index:number]:string; } var arr: StringArray = ['a','b','c']; arr[0]="new" interface originArray{ [index:number]:number } var arr2:originArray=[] //딕셔너리 패턴 interface StringRegesDictionary{ [key:string] : RegExp } var..
TS. 타입스크립트 시작전에 그 유명한 이펙티브 시리즈의 타입스크립트를 보려고 한다. 예전에 자바 공부를 할 때 자바 하면 이펙티브 자바라고 들었어서 이 책도 같은 이펙티브 시리즈여서 신나서 산거 같다. 아무튼 새 친구를 만났으니 시간 좀 보내야겠다. 사실 이 책이 완전 개념 책은 아닌 걸로 알아서 개념적인 부분은 따로 좀 보면서 재밌었던 파트 있으면 정리하는 식으로 해야겠다. 일단 타입스크립트는 이름처럼 타입을 사용하는 자바스크립트다. 찾아보면 자바스크립트의 슈퍼셋 언어라고 나오는데 왜 써야 하는지 알아보자. 몇 가지가 있는데 간단히 얘기하면 에러를 방지하고 생산성을 향상시킨 다고 한다. 에러를 방지하는 건 자바스크립트의 경우 일단 결과를 콘솔에 찍어봐야 에러를 발견하는 경우가 많아서 타입 스크립트를 쓰면 작성 과정에서 바로 찾을..
DOM. 관련 개념 정리 DOM 관련 강의를 듣고 있는데 어제 쓴 글이랑 관련 있는 게 나와서 생각나는 부분만 정리해 보려고 한다. 강의는 인프런에 'DOM 기본' 이란 강의다. 오늘은 설명할 부분은 ECMAscript Overview부분을 설명한다. 밑에 참고하면 된다. https://tc39.es/ecma262/#sec-ecmascript-overview ECMAScript® 2022 Language Specification The first and subsequent editions of ECMAScript have provided, for certain operators, implicit numeric conversions that could lose precision or truncate. These legacy imp..
JS. this this에 대해 공부하다가 헷갈리는 부분들이 있어서 간단하게 정리하려고 한다. 자바스크립트 this는 다른 객체지향 언어들의 this와 좀 다르게 this에 바인딩되는 객체가 한 가지가 아니라 해당 함수 호출 방식에 따라 this에 바인딩되는 객체가 달라진다. 이게 왜 이런 식으로 설계되었는지는 저번에 프로토타입 글에서 공유한 '자바스크립트는 왜 프로토타입을 선택했을까? '글을 보면 자바스크립트의 철학을 통해 조금은 알 수 있다. 자바스크립트의 경우 함수 호출 방식에 의해 this에 바인딩할 어떤 객체가 동적으로 결정된다. 함수를 선언할 때 this에 바인딩할 객체가 정적으로 결정되는 것이 아니라 함수를 호출할 때 함수가 어떻게 호출되었는지에 따라 this에 바인딩할 객체가 동적으로 결정된다. 여기서 저..
JS. Closure 그렇다 클로저다. 언제 한번 정리를 해야겠다고 생각했는데, 어디서 보기만 했지 내가 진정 이해하고 있는지 모르겠어서 다시 정리해보려 한다. MDN에서 클로저 검색해 보면 렉시컬 스코프부터 알고 가야된다고 한다. 그래서 간단하게 Lexical Scope에 대해 정리하고 가자. 다음은 MDN에 있는 코드다 var name = "gozilla" function init() { var name = "Mozilla"; // name은 init에 의해 생성된 지역 변수이다. function displayName() { // displayName() 은 내부 함수이며, 클로저다. alert(name); // 부모 함수에서 선언된 변수를 사용한다. } displayName(); } init(); 결과는 Mozilla라..

티스토리툴바