console.log(0.1+0.2)의 답은 0.3이 아닙니다. 여러분 혹시 console.log(0.1 + 0.2);의 답에 대해서 0.3일 거라고 생각하신다면 아쉽게도 아닙니다.답은 0.30000000000000004입니다.뭔가 싶지요.제가 그랬거든요.결론부터 말씀드리면 이는 부동소수점(floating-point) 연산의 정밀도 한계 때문입니다.이 현상은 JS뿐만 아니라 대부분의 프로그래밍 언어에서 나타나며, 컴퓨터가 숫자를 이진법으로 표현하기 때문에 발생하는 문제입니다.부동소수점 연산의 특징이진 부동소수점 표기법 0.1과 0.2는 이진법에서 무한소수로 표현됩니다. 0.1은 0.000110011001100... (무한 반복) 0.2는 0.00110011001100... (무한 반복) 컴퓨터는 무한 반복 소수를 저장할 수 없으므로, 유한한 비트로 근사치를 저장합니다.. 2024. 11. 26. [CSS] reset.css란? reset.css 공유 처음 사이트 제작 시 주의 깊게 보시면 내가 설정하지 않은 CSS 속성들이 적용되어 있는 것을 확인하실 수 있습니다.이는 사이트에서 자체적으로 제공하는 기본 스타일(Default Styles) 때문입니다. 브라우저는 사용자 경험을 위해 HTML 요소에 기본적인 스타일(CSS)을 제공합니다.예를 들어, a 태그는 파란색 텍스트와 밑줄 효과가 있으며, h1, h2 같은 헤딩 태그는 크기와 굵기가 다르게 설정됩니다. 또한, 문단 간의 기본적인 margin이나 padding 역시 기본 스타일입니다.이러한 기본 스타일은 사이트 제작 시 대단히 불편하기 때문에 처음에 reset.css로 CSS를 초기화한 후 개발을 진행하게 됩니다.reset.css는 개발자마다 소소하게 다르며 아래 코드는 제가 사용하는 reset... 2024. 11. 25. [JQuery] 새 탭으로 구글, 네이버 검색(네이버 뉴스 포함) 아주 간혹 가다 내 사이트에서 네이버나 구글 검색이 필요할 때가 있습니다.그때 아래 코드를 사용해 보세요.새 탭을 통해 구글이나 네이버로 바로 검색을 하실 수 있습니다!새 탭으로 네이버 검색: See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.">See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen. 새 탭으로 네이버 뉴스 검색: See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.">See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.새 탭으로 구글 검색: .. 2024. 11. 24. [JQuery] 커스텀 select 만들기 wiht 깔끔한 코드 기본 select가 범용성 면에서는 더 좋습니다.특히 모바일에서 자동으로 select를 인식하고 선택하기 쉽게 처리해주기도 합니다.그러나 디자인이 이쁘지 않고 커스텀에 한계가 있다 보니 보통 select는 만들어서 쓰는 경향이 있습니다.필요할 때마다 만들기도 귀찮고, 한 번 탬플릿으로 만들어두면 두고두고 편하게 사용할 수 있습니다.그러기 위한 기초 화장만 입힌 커스텀 select를 만들어 봤습니다.다들 자주 보는 곳에 저장한 후 필요할 때마다 꺼내 쓰시면 좋을 것 같습니다.필요할 때마다 제 블로그를 방문하시는 것도 좋은 선택일 것입니다.기본 select: See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.">See the Pen Unt.. 2024. 11. 23. [CSS] animation에 대해 알아봅시다 CSS의 animation은 단어 그대로 html에 애니메이션을 입힐 수 있는 속성입니다.animation의 활용법은 무궁무진합니다. 가끔 코드팬을 둘러보면 무척 재밌고 유쾌한 코드들이 많이 있습니다시간이 있으실 경우 구글에 “codepen animation”이라고 검색해 보시면 다양한 개성의 코드들을 만나 보실 수 있을 겁니다.실 사용법:marquee 효과: See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.">See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen. 파도 애니메이션: See the Pen Untitled by 이종원 (@orugpbqu-the-solid) o.. 2024. 11. 22. [CSS] transition에 대해 알아봅시다 transition은 요소의 상태 변화에 따라 부드러운 애니메이션 효과를 제공하는 CSS 속성입니다. animation과 달리, transition은 요소의 상태 변경(예: hover, focus, active 등)에 반응하여 특정 방향으로만 애니메이션을 적용할 수 있다는 특징이 있습니다.실 사용법:바쁘신 분들은 아래 코드팬 코드를 우선적으로 보셔도 됩니다. See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.">See the Pen Untitled by 이종원 (@orugpbqu-the-solid) on CodePen.hover 이벤트에 transition을 주고 싶을 경우 주체가 되는 요소에 transitinon을 주어야 합니다.여기서.. 2024. 11. 21.
