써니베어작업실

Create. Inspire. Share.

개발과 창작의 즐거움을 나누는 공간입니다.
작은 시도부터 큰 도전까지, 모든 순간을 기록하고 공유합니다.

최신 포스트 보기

전체 글 67

고양이가 기다리는 모험, 집 가는게 힘든 게임

고양이가 기다리는 모험, 집 가는게 힘든 게임

집으로 돌아가기, 런 점프 게임, 고양이 게임, 감성 게임, HTML5 게임 안녕하세요! 오늘은 고양이 집사라면 꼭 플레이해야 할, 따뜻하고 감성적인 런 점프 게임 '집으로 돌아가기'를 소개해 드립니다. 장애물을 피해 집까지 무사히 달려가서, 사랑하는 고양이와 재회하는 감동 스토리를 지금 바로 경험해 보세요! 🕹️ 지금 바로 플레이! (인게임 화면) 👉 새로운 창에서 게임 플레이하기 (클릭!) 👈 ⚠️ **팁**: 게임 화면을 **클릭**한 후 **스페이스바**를 눌러 점프해 주세요! ✨ 주요 특징: 시간의 흐름을 담은 감성 스토리 이 게임의 가장 큰 매력은 바로 **..

2025. 10. 29.
자바스크립트 배열 순회 마스터: for, for-of, forEach, map, filter, reduce 완전 비교 및 활용법

자바스크립트 배열 순회 마스터: for, for-of, forEach, map, filter, reduce 완전 비교 및 활용법

🌈 자바스크립트 배열 순회 완전 정리: for / for-of / forEach / map / filter / reduce 안녕하세요, 개발자 여러분! 오늘은 자바스크립트의 기본 중 기본이지만, 가장 자주 헷갈리는 ‘순회(loop)’ 메서드들을 총정리했어요. for, for...of, forEach(), map(), filter(), reduce()까지 — 이름은 비슷하지만 “의도와 제어권”이 전혀 다릅니다. 이 차이를 명확히 이해하면 코드가 훨씬 깔끔해져요! 🚗 1️⃣ for문 – 수동 운전의 왕 for (let i = 0; i 직접 인덱스 제어 가능 ..

2025. 10. 15.
자바스크립트 성긴 배열, 왜 map/forEach는 빈 칸을 건너뛸까? Array 3대장 생성 원리 파헤치기

자바스크립트 성긴 배열, 왜 map/forEach는 빈 칸을 건너뛸까? Array 3대장 생성 원리 파헤치기

[JS 딥다이브] 성긴 배열(Sparse Array) 완벽 해부: Array 3총사까지 마스터! 📝 안녕하세요! 자바스크립트를 공부하다 보면 한 번쯤 마주치지만, 은근히 헷갈리는 개념이 바로 성긴 배열(Sparse Array)이에요. 오늘은 이 녀석이 뭔지, 왜 생기는지, 그리고 이 성긴 배열을 다루는 데 핵심인 Array(), Array.of(), Array.from() 3대장 메서드까지 한 번에 정리해봤습니다! 1️⃣ 성긴 배열(Sparse Array)이란 무엇일까? 성긴 배열은 말 그대로 인덱스(번호)가 연속되지 않은 배열을 뜻해요. 배열 중간에 요소가 존재하지 않는 빈 칸(empty slot)이 있는 상태를 말합니다. const arr =..

2025. 10. 14.
🌈 자바스크립트의 깊은 세계 — typeof, 값 복사 vs 참조 복사 완전정리

🌈 자바스크립트의 깊은 세계 — typeof, 값 복사 vs 참조 복사 완전정리

🌈 자바스크립트의 깊은 세계 — typeof, 값 복사 vs 참조 복사 완전정리 “값은 그대로인데 왜 원본까지 바뀌지?” 한 번쯤 이런 경험, 있지 않았나요? 😅 이 모든 비밀은 바로 “값 복사 vs 참조 복사”, 그리고 typeof의 타입 체계 안에 숨어 있습니다. 오늘은 이 깊은 세계를 Sunnybear만의 방식으로 완벽 정리해볼게요! 🧭 1️⃣ typeof — 타입의 나침반 (Interactive Test!) 자바스크립트에서 typeof는 변수의 자료형(Type)을 알려주는 키워드예요. 하지만 이건 단순히 이름만 알려주는 게 아니라, **그 값이 “어떻게 복사될지”까지 간접적으로 알려줍니다.** 직접 typeof 결과 확인해보기 ..

2025. 10. 12.
🚀 자바스크립트 구구단 마스터 챌린지: For vs Map vs Reduce 비교 분석 (feat. 내가 공부한 내용)

🚀 자바스크립트 구구단 마스터 챌린지: For vs Map vs Reduce 비교 분석 (feat. 내가 공부한 내용)

🚀 자바스크립트 구구단 마스터 챌린지: For vs Map vs Reduce 비교 분석 (feat. 내가 공부한 내용)안녕하세요, 코딩하는 Sunnybear입니다! 👋오늘은 제가 자바스크립트 반복문을 공부하면서, 가장 헷갈리지만 핵심적인 세 가지 방법, for 문, map, reduce를 구구단 예제를 통해 직접 비교 정리해봤어요. 이 세 가지를 제대로 이해해야 깔끔한 함수형 코드를 짤 수 있더라고요!1. 🐻 For 문: 명령형의 왕! (가장 직관적)가장 기본이 되는 방식이죠. "어떻게(How)" 반복할지 하나하나 명령을 내리는 '명령형(Imperative)' 방식입니다. 중첩된 반복문이 필요할 때 가장 먼저 생각나는 친구입니다.💡 코드// 2단부터 4단, 최대 5까지 곱하는 예제const sta..

2025. 10. 12.
더 퍼스트 슬램덩크 – 나의 영광의 시대는 지금이다

더 퍼스트 슬램덩크 – 나의 영광의 시대는 지금이다

🏀 더 퍼스트 슬램덩크 – 나의 영광의 시대는 지금이다 추석 연휴 마지막 날, 인생을 돌아보게 한 한마디 놀 만큼 놀았는지, 이제는 뭐 볼 게 없었다. 넷플릭스를 뒤적이다가 〈더 퍼스트 슬램덩크〉가 눈에 들어왔다. “다시 리메이크인가?” 싶어 재생 버튼을 눌렀다. 그런데 익숙한 얼굴들이 낯설게 다가왔다. 이번엔 강백호가 아닌 송태섭의 시점이었다. 제목을 다시 보니 분명 ‘더 퍼스트 슬램덩크’. 그제야 알았다. 이건 예전 슬램덩크가 아니구나. 송태섭의 시선으로 보는 산왕전은 전혀 달랐다. 농구를 시작한 계기, 방황하던 시절, 초등학생 시절의 정대만과의 추억까지 — 그의 내면이 농구처럼 오르락내리락했다. 그리고 애니의..

2025. 10. 12.