진행하던 프로젝트에서 가격 범위를 설정하는 기능을 구현하여야 했습니다. 이 경우 흔히 양방향 슬라이더를 이용하여 구현합니다. 일반적인 양방향 슬라이더는 구글링으로 쉽게 구현할 수 있습니다. 하지만 추가적인 기능 요청이 들어옵니다. 슬라이더의 핸들이 오른쪽으로 갈수록 값이 변하는 속도가 빨라지게 하는 것이었습니다. 즉, 슬라이더의 핸들이 왼쪽에 있으면 값을 세밀하게 조절할 수 있도록 하고, 오른쪽에 있으면 큰 단위로 조절할 수 있도록 하는 것이었습니다. 구글링을 통해 쉽게 찾을 수 있으므로, 이 글에서는 양방향 슬라이더를 구현하는 방법에 대해서는 자세히 다루지 않겠습니다. 대신 핸들의 위치에 따라 값의 변화 속도를 달리하는 방법에 대해서 주로 다루어 보도록 하겠습니다. 이차함수의 그래프 저는 처음 이 기능..
[1] * 5 # [1, 1, 1, 1, 1] 파이썬에는 리스트 반복 (list repetition)이라는 기능이 있습니다. 위 코드처럼 리스트에 정수를 곱해 리스트 내의 원소를 반복시킬 수 있는 기능입니다. [1, 2] * 2 # [1, 2, 1, 2] 리스트 내의 원소가 두 개 이상일 때에도 마찬가지입니다. 모든 원소가 반복된 리스트를 반환합니다. 위 두 예시에서는 리스트의 원소가 숫자인 경우만 보였지만, 어떤 타입의 원소이건 모두 잘 동작합니다. 원소가 리스트(list), 집합(set), 딕셔너리(dict)인 경우에도 동작한다는 겁니다. 이 세 타입의 공통점이 무엇일까요? 바로 mutable, 즉 수정 가능한 타입이라는 겁니다. 이 타입들에 대해 리스트 반복을 사용할 때 주의할 점이 있습니다. 리스..
프론트 개발을 하다가 이벤트 리스너가 걸려있는 요소를 제거해야 할 일이 생겼다. 요소를 제거하기 전에 그 요소에 등록된 이벤트 리스너를 제거해야 할까? 결론부터 말하자면, "제거하면 좋지만 굳이 제거할 필요는 없다."이다. 제거하면 좋지만 굳이 제거할 필요가 없다니, 이게 무슨 말인가? 이를 이해하기 위해 이벤트 리스너를 등록하게 되면 어떤 일이 일어나는지 살펴보도록 하자. 자바스크립트에서 어떤 요소에 대한 이벤트에 맞추어 적절한 행동을 하게 하고 싶을 때, addEventListener() 함수를 이용하여 이벤트에 함수를 연결시켜 줄 수 있다. 이 함수를 이벤트 핸들러 (Event Handler)라고 부른다. 이처럼 이벤트와 이벤트 핸들러를 연결시켜 주는 것을 이벤트 리스너라고 한다. 이벤트가 발생했을..