선택 정렬은 배열에서 가장 작은 값을 찾아 앞쪽으로 하나씩 정렬해 나가는 단순한 방식의 정렬 알고리즘입니다. 구현이 쉽고 직관적이지만, 성능 면에서는 비효율적이기 때문에 실제 애플리케이션보다는 교육용으로 자주 사용됩니다.1. 동작 원리배열의 첫 번째 요소부터 시작남은 요소 중 가장 작은 값을 찾아 현재 위치와 교환인덱스를 한 칸 뒤로 옮기고 같은 작업 반복배열의 끝까지 반복하면 정렬 완료정리하면, "가장 작은 값을 선택해서 앞으로 보낸다"는 의미에서 선택 정렬이라 불립니다.2. JavaScript 예제 - 오름차순 정렬function selectionSort(arr) { const len = arr.length; for (let i = 0; i minIndex: 현재 가장 작은 값의 인덱스를 저장ES..

버블 정렬은 가장 간단하고 직관적인 정렬 알고리즘 중 하나입니다. 인접한 두 요소를 비교하여 크기 순서가 맞지 않으면 자리를 바꾸는 방식으로 정렬을 수행합니다. 데이터가 거의 정렬되어 있을 경우에는 빠르게 동작하지만, 대부분의 경우 성능이 떨어져 실제 사용보다는 교육용으로 자주 활용됩니다.1. 동작 원리버블 정렬은 다음 과정을 반복합니다:배열의 처음부터 끝까지 인접한 두 요소를 비교앞의 값이 뒤의 값보다 크면 두 값을 교환위 과정을 배열의 끝까지 반복한 번 순회가 끝날 때마다 가장 큰 값이 맨 뒤로 '버블처럼' 올라감이를 전체 길이 - 1 만큼 반복하면 정렬이 완료됩니다.2. JavaScript 예제 - 오름차순 정렬function bubbleSort(arr) { const len = arr.lengt..

웹 애플리케이션에서 게시판, 상품 목록, 검색 결과 등 많은 데이터를 다룰 때는 한 페이지에 모든 항목을 출력하는 것보다, 일정 개수씩 나눠서 보여주는 페이징 처리가 필요합니다. 이 글에서는 PHP로 구현한 페이징 처리 예제를 기반으로, 각 부분의 동작 원리와 구현 포인트를 설명합니다. 전체 코드 샘플$v) { $ARR_SRCH_SQL[] = "board_subject like '%{$v}%'"; $ARR_SRCH_SQL[] = "strip_tags(board_content) like '%{$v}%'"; } $ARR_SRCH_SQL = implode(" or ", $ARR_SRCH_SQL); $SRCH_SQL .= " AND ({$ARR_SRCH_SQL})"..

JavaScript의 비교 연산자는 단순히 ==, ===를 넘어서서 다양한 상황에서 중요한 역할을 합니다. 이 글에서는 헷갈리기 쉬운 비교 연산자들의 차이와 실제 사용 시 주의할 점들을 상세히 정리합니다.1. 느슨한 비교 (==) vs 엄격한 비교 (===)console.log(1 == '1'); // trueconsole.log(1 === '1'); // false==는 타입을 자동 변환하여 값만 비교합니다 (type coercion)===는 타입과 값 모두를 비교하므로 더 안전하고 예측 가능합니다대부분의 경우 === 사용을 권장합니다.2. != vs !==console.log(null != undefined); // falseconsole.log(null !== undefined); // tr..

조건문은 프로그램의 흐름을 제어하는 핵심 요소입니다. JavaScript에서는 다양한 조건문과 표현식을 통해 유연하고 명확한 조건 처리를 할 수 있습니다. 이 글에서는 조건문의 심화 사용법과 실수하기 쉬운 부분들을 다룹니다.1. if / else if / else 기본 구조const score = 85;if (score >= 90) { console.log("A");} else if (score >= 80) { console.log("B");} else { console.log("C 이하");}조건은 위에서 아래로 평가되며, 가장 먼저 true가 되는 블록이 실행됩니다.2. 삼항 연산자 (조건 ? 참 : 거짓)const age = 18;const status = age >= 18 ? "성인" : "..

JavaScript에서 반복문은 배열 순회, 조건 반복, DOM 제어 등 다양한 곳에서 사용됩니다. 이 글에서는 기본적인 반복문 외에도, 잘 알려지지 않았지만 강력한 반복 방식들과 사용 시 주의할 점들을 함께 정리합니다.1. 기본 반복문 구조 복습for (let i = 0; i 2. for...of 문 - 이터러블 객체 순회const arr = [10, 20, 30];for (const value of arr) { console.log(value);}배열, 문자열, Map, Set 등 이터러블 객체를 순회할 수 있습니다.index가 필요 없는 경우 간결하고 읽기 쉬움3. for...in 문 - 객체의 속성 순회const obj = { a: 1, b: 2 };for (const key in obj) { ..

자바스크립트를 배우다 보면 함수를 정의하는 방식에 따라 동작이 다르다는 점을 접하게 됩니다. 그 중 대표적인 것이 함수 선언식과 함수 표현식입니다. 이 두 가지는 겉보기에는 유사해 보이지만, 호이스팅, 스코프, 실행 시점, 디버깅 편의성, 조건부 선언 등 다양한 면에서 중요한 차이를 지닙니다.이번 글에서는 이 두 방식의 차이를 정확히 이해하고, 실제 개발에 어떻게 적용하면 좋을지를 보다 심도 있게 다뤄보겠습니다.✅ 함수 선언식 (Function Declaration)function greet() { console.log("Hello!");}📌 개념 및 특징이름을 가진 함수 정의 방식전체 코드에서 참조 가능 (호이스팅에 의해)스코프는 함수 레벨 스코프를 따름strict mode에서도 안정적으로 동작전통..

12편에서는 스코프, 클로저, 변수 선언 시 발생하는 전형적인 혼동 사례를 정리합니다.✅ 1. var는 블록 스코프를 가지지 않는다if (true) { var x = 10;}console.log(x); // 10📌 설명var는 함수 스코프만 가지며, 블록({})을 스코프로 인식하지 않습니다.✅ 2. 클로저에서 반복문 변수 캡처 문제var funcs = [];for (var i = 0; i console.log(i));}funcs[0](); // 3funcs[1](); // 3funcs[2](); // 3📌 설명클로저는 동일한 i를 참조하므로 루프 종료 시점의 값이 모두 사용됩니다.📌 대처let을 사용하거나 즉시 실행 함수(IIFE)를 통해 캡처합니다.✅ 3. 중첩 함수의 this는 상위 컨텍스트..

이번 11편에서는 타입 관련 실수와 내장 객체의 오용으로 발생하는 자주 겪는 오류들을 다룹니다.✅ 1. typeof null은 왜 "object"일까?📌 설명자바스크립트 초기 설계 버그로 인해 typeof null은 "object"를 반환합니다. null은 원시 타입이지만 객체처럼 보이는 혼란을 줍니다.📌 대처null 체크는 반드시 value === null로 진행합니다.✅ 2. Math.max()와 Math.min()의 빈 인수 처리Math.max(); // -InfinityMath.min(); // Infinity📌 설명인수가 없는 경우 Math.max()는 최솟값, Math.min()은 최댓값을 반환함으로써 잘못된 비교 결과를 낼 수 있습니다.✅ 3. parseInt는 radix 생략 시 혼란..

이번 10편에서는 자바스크립트에서 데이터 구조와 참조 처리에서 실수할 수 있는 대표적인 사례들을 정리합니다.✅ 1. 객체를 비교하면 항상 false?📌 문제 상황const a = { x: 1 };const b = { x: 1 };console.log(a === b); // false📌 설명두 객체는 내용이 같더라도 메모리 주소가 다르기 때문에 참조 비교 결과는 false가 됩니다.📌 대처객체의 값을 비교하려면 JSON.stringify를 이용하거나 lodash의 isEqual 같은 유틸 함수를 사용합니다.✅ 2. 배열의 길이는 자동 조절된다📌 문제 상황const arr = [1, 2, 3];arr.length = 1;console.log(arr); // [1]📌 설명배열의 length 값을 변경..