본문 바로가기

javascript13

[JS] sort 완벽 정리: 개념부터 예제까지 자바스크립트에서 배열을 다룰 때 꼭 알아야 할 메서드 중 하나가 바로 sort입니다. 이번 글에서는 sort가 뭔지, 언제 쓰이는지부터 시작해서 문법과 실전 예제까지 차근차근 알아보겠습니다. 초보자도 쉽게 이해하고 따라 할 수 있게끔 풀어놨어요. 그럼 시작해볼게요! 1. sort란...?sort는 배열에 담긴 요소들을 특정 순서대로 정렬해주는 자바스크립트 내장 메서드예요. 이름 그대로 '정렬'을 뜻하죠. 숫자를 크기 순으로 나열하거나, 문자열을 알파벳 순으로 정리할 때 딱이에요.예를 들어, 온라인 쇼핑몰에서 "가격 낮은 순"으로 상품을 보여주거나, 친구 목록을 이름순으로 정렬할 때처럼 실생활에서도 자주 접할 수 있습니다. 중요한 점은 sort가 배열 자체를 수정한다는 거예요. 원본 데이터가 바뀌니까 조심.. 2025. 2. 27.
[JS] some 메서드에 대해 알아보자 안녕하세요! 오늘은 JavaScript 배열 메서드 중 하나인 some에 대해 이야기해보려고 합니다. 배열을 다룰 때 유용하게 사용할 수 있는 some 메서드는 특정 조건을 만족하는 요소가 있는지 확인할 때 딱이에요. 그럼 이제부터 some을 언제 쓰는지, 기본 문법은 어떻게 되는지, 그리고 간단한 예제까지 차근차근 살펴볼게요!   1. some은 언제 사용할까?some 메서드는 배열 안에 적어도 하나 이상의 요소가 내가 원하는 조건을 만족하는지 확인하고 싶을 때 사용합니다. 예를 들어, "학생들 점수 배열에서 90점 이상인 학생이 한 명이라도 있는지 알고 싶다"거나 "장바구니에 특정 상품이含まれ있는지 체크하고 싶다" 같은 상황에서 유용하죠.쉽게 말해, 배열을 쭉 훑으면서 조건에 맞는 요소가 단 하나라도.. 2025. 2. 26.
[JS] 문자열 배열을 숫자 배열로 변환하는 방법 JavaScript에서 ["2", "1", "3", "4"] 같은 문자열 배열을 [2, 1, 3, 4]와 같은 숫자 배열로 변환하는 방법을 정리해보겠습니다.✅ 1. map(Number)를 사용한 변환 (가장 간단한 방법)문자열을 숫자로 변환할 때는 Array.prototype.map()을 활용하여 Number 함수를 적용하면 됩니다.const strArray = ["2", "1", "3", "4"]; const numArray = strArray.map(Number);console.log(numArray); // [2, 1, 3, 4] 📌 설명:map(Number)는 배열의 각 요소에 Number() 함수를 적용하여 문자열을 숫자로 변환합니다.Number("2") → 2, Number("1") → 1 .. 2025. 2. 4.
[JS] 배열을 비우는 5가지 방법 (feat. 성능 비교) 배열을 비우는 건 간단해 보이지만, 자바스크립트에선 다양한 방법이 존재합니다. 어떤 방법을 선택하느냐에 따라 메모리 관리와 성능이 달라질 수 있어요. 오늘은 각 방법의 특징과 차이점을 코드와 함께 정리해봤습니다. 1. 길이를 0으로 설정하기가장 직관적이고 효율적인 방법입니다.let arr = [1, 2, 3];arr.length = 0; // arr → []장점: 원본 배열을 직접 수정하므로 다른 참조도 함께 초기화됨단점: ES6 이상에서만 100% 안전2. 새 배열로 재할당하기let arr = [1, 2, 3]; arr = []; // 새로운 배열 할당장점: 깔끔한 문법단점: 기존 배열을 참조하는 변수가 있다면 영향 없음let original = [1, 2, 3]; let copy = original;.. 2025. 1. 27.
[JS] Spread Syntax에 대해서 알아보자 JavaScript 문법에서 ...(점 세 개)는 자주 보이지만, 쓰임새가 하나만 있는 것은 아닙니다.함수의 파라미터 자리에 쓰이면 “나머지 파라미터(Rest Parameter)”로 작동하고,배열, 객체, 함수 호출 등에 쓰이면 “전개 구문(Spread Syntax)” 역할을 합니다.두 개념은 모두 ... 기호를 사용하기에 같은 듯 보이지만, 동작 방식을 잘 이해해야 좀 더 효율적으로 코드를 작성할 수 있습니다.아래에서 순서대로 살펴보겠습니다.1. 나머지 파라미터(Rest Parameter)1-1. 정의나머지 파라미터는 함수 정의부에서 하나의 매개변수에 나머지 인수들을 배열 형태로 모아주는 문법입니다.쉽게 말해, 함수에 전달되는 “나머지” 인자들을 한꺼번에 받아올 때 사용합니다.사용법function su.. 2025. 1. 26.
[JS] Set 도대체 어떻게 사용하는 건데? JavaScript에서 Set 객체는 고유한 값들의 집합을 저장할 수 있는 데이터 구조입니다. 이 글에서는 Set의 특징, 사용법, 그리고 실무에서 유용한 활용 예제까지 자세히 다룰 것입니다.1. Set 객체란?Set은 JavaScript에서 중복을 허용하지 않는 값들의 집합을 표현하는 데 사용됩니다. 기본 배열과는 다르게 동일한 값을 중복으로 추가할 수 없다는 점이 큰 특징입니다.주요 특징:중복 불허: 동일한 값은 한 번만 저장됩니다.순서 보장: 삽입 순서를 유지합니다.값의 타입 제한 없음: 문자열, 숫자, 객체 등 모든 데이터 타입 저장 가능.const mySet = new Set();mySet.add(1);mySet.add(2);mySet.add(2); // 중복 값 추가 시 무시됨console.l.. 2025. 1. 24.
[JS] reduce 메서드 완벽 가이드 1. 들어가며JavaScript의 reduce() 메서드는 배열의 모든 요소를 순회하며 단일 값으로 축약하는 강력한 기능을 제공합니다. map()이나 filter()와 함께 가장 많이 사용되는 고차 함수 중 하나로, 데이터를 누적 처리하거나 변환할 때 유용합니다. 이 글에서는 reduce() 메서드의 동작 원리, 다양한 사용 사례, 그리고 실무에서의 활용 방법까지 상세히 다뤄보겠습니다.2. reduce 메서드란?2.1 정의reduce()는 배열의 각 요소에 대해 주어진 콜백 함수를 실행하며, 그 결과를 누적(accumulate)하여 단일 값으로 반환합니다.문법:array.reduce(callback(accumulator, currentValue, index, array), initialValue);2.2.. 2025. 1. 23.
[JS] 점 표기식과 대괄호 표기식의 차이점 1. 점 표기식 (Dot Notation)1.1 개념점 표기식은 **.(점)**을 사용하여 객체의 속성에 접근하거나 값을 설정하는 방식입니다. 속성 이름이 간단한 식별자일 때 주로 사용됩니다.1.2 사용법const obj = { name: "John", age: 30 };// 속성 값 읽기console.log(obj.name); // "John"// 속성 값 수정obj.age = 31;console.log(obj.age); // 311.3 특징가독성: 코드가 간결하고 읽기 쉬움.제한사항: 속성 이름에 공백, 특수 문자, 숫자로 시작하는 경우 사용 불가.2. 대괄호 표기식 (Bracket Notation)2.1 개념대괄호 표기식은 **[](대괄호)**를 사용하여 객체의 속성에 접근하거나 값을 설정하는 방식.. 2025. 1. 21.
[JS] 형변환 완벽 가이드: 명시적 & 암시적 변환의 모든 것 JavaScript 형변환 완벽 가이드: 명시적 & 암시적 변환의 모든 것1. 들어가며JavaScript는 동적 타입 언어로, 변수의 데이터 타입이 유연하게 변경될 수 있습니다. 이러한 특성 덕분에 편리하지만, 형변환(Type Conversion)으로 인해 예상치 못한 오류가 발생할 수도 있습니다. 이 글에서는 명시적 형변환과 암시적 형변환의 차이를 명확히 이해하고, 실무에서 안전하게 형변환을 사용하는 방법을 소개합니다.2. 형변환의 종류2.1 명시적 형변환 (Explicit Type Conversion)개념: 개발자가 의도적으로 데이터 타입을 변환하는 방법입니다.주요 메서드: String(), Number(), Boolean()장점: 코드가 명확하고 예측 가능함.2.2 암시적 형변환 (Implicit .. 2025. 1. 21.
[JS] filter() 완벽 가이드: 배열 필터링의 모든 것" filter() 메서드처음에 js로 코딩테스트 문제를 풀다 다른 사람들의 코드를 보면 filter라는 메서드를 상당히 자주 쓰는 것을 볼 수 있다.그래서 오늘은 filter 메서드가 어떻게 작동하고 활용되는지에 대해서 알아보려고 한다.     기본 개념filter()는 JavaScript 배열 메서드로, 배열의 각 요소를 순회하며 조건에 맞는 요소들만 추출하여 새로운 배열을 반환합니다.원본 배열은 변경되지 않으며, 조건에 부합하는 요소들만 포함된 새로운 배열이 반환됩니다.데이터를 정제하거나 특정 조건을 만족하는 데이터를 선택할 때 유용합니다. array.filter(callback(element, index, array), thisArg); element: 현재 처리 중인 요소.index: 현재 요소의 .. 2025. 1. 20.

티스토리툴바