본문 바로가기

Develop30

자바스크립트[JS] - 💯 문자열 치환 함수 replaceAll() 알아보기 replaceAll() 함수의 개요 replaceAll() 함수는 문자열에서 특정 문자나 문자열을 찾아 다른 문자나 문자열로 치환하는 함수입니다. 이 함수는 정규표현식을 지원하기 때문에, 복잡한 패턴의 문자열도 치환할 수 있습니다. replaceAll() 함수의 리턴값 replaceAll() 함수는 치환된 문자열을 반환합니다. 만약 찾는 문자나 문자열이 존재하지 않는 경우에는 원래의 문자열을 그대로 반환합니다. function replaceAllReturnExample() { const str = "I love programming"; const regex = /love/; const replacedStr = str.replaceAll(regex, "hate"); console.log(replacedSt.. 2024. 3. 23.
자바스크립트[JS] - 💯 하나만 만족해도 좋은 SOME() 함수 알아보기 some() 함수의 개요 자바스크립트의 some() 함수는 배열의 요소 중 하나라도 참이면 true를 반환하고, 모든 요소가 거짓이면 false를 반환하는 함수입니다. 주로 배열의 요소 중에 특정 조건을 만족하는 요소가 있는지 확인할 때 사용됩니다. some() 함수의 사용 목적 및 장점 배열의 모든 요소를 확인하는 것은 시간이 많이 소요될 수 있습니다. 하지만 some() 함수는 배열의 모든 요소를 확인하지 않고, 하나라도 조건을 만족하는 요소가 있으면 바로 true를 반환하기 때문에 시간을 절약할 수 있습니다. 또, some() 함수는 조건을 만족하는 요소가 있는지 여부를 간단하게 확인할 수 있기 때문에 코드를 간결하게 작성할 수 있습니다. some() 함수와 관련된 용어 및 개념 배열: 여러 개의 .. 2024. 3. 22.
자바스크립트[JS] - 💯 깊은 복사, 얕은 복사 알아보기 깊은 복사와 얕은 복사의 개요 자바스크립트에서 객체를 복사할 때, 깊은 복사와 얕은 복사는 중요한 개념입니다. 이 둘의 차이를 이해하면 객체를 다룰 때 발생할 수 있는 문제를 미연에 방지할 수 있습니다. 관련 용어 및 개념 정의 깊은 복사: 객체의 모든 내용을 복사하여 완전히 새로운 객체를 생성하는 방식 얕은 복사: 객체의 주소를 복사하여 새로운 객체를 생성하는 방식 깊은 복사와 얕은 복사의 원본 데이터와 복사 데이터 비교 깊은 복사의 리턴값 깊은 복사를 사용하면 원본 객체와 완전히 독립적인 새로운 객체가 반환됩니다. const original = { a: 1, b: { c: 2 } }; const deepCopy = JSON.parse(JSON.stringify(original)); // 원본 데이터 .. 2024. 3. 21.
자바스크립트[JS] - 💯 join() 알아보기 / 배열을 문자열로 join() 메소드의 개요 join() 메소드는 배열의 모든 요소를 문자열로 변환하고, 이를 하나의 문자열로 연결하여 반환하는 메소드입니다. 예를 들어, ["apple", "banana", "orange"]라는 배열이 있을 때, join() 메소드를 사용하면 "apple,banana,orange"라는 문자열을 반환합니다. join() 메소드의 사용 목적 join() 메소드는 주로 다음과 같은 상황에서 사용됩니다. 배열의 모든 요소를 하나의 문자열로 만들어야 할 때 배열의 요소를 쉼표나 공백 등으로 구분하여 출력해야 할 때 자바스크립트 join() 메소드의 장점 join() 메소드의 장점은 다음과 같습니다. 배열의 요소를 하나의 문자열로 쉽게 만들 수 있습니다. 배열의 요소를 구분하는 구분자를 자유롭게 지.. 2024. 3. 19.
자바스크립트[JS] - 💯 match() 알아보기 / 정규식 필수⭐ JavaScript의 match() 함수는 문자열에서 특정 패턴과 일치하는 부분을 찾아 배열로 반환하는 함수입니다. 정규 표현식(Regular Expression)을 사용하여 패턴을 지정할 수 있습니다. match() 함수의 개요 및 작동 방식 설명 match() 함수는 문자열에서 정규 표현식과 일치하는 부분을 찾아 배열로 반환합니다. 일치하는 부분이 없으면 null을 반환합니다. 사용 목적 및 장점 설명 주로 문자열에서 특정 패턴과 일치하는 부분을 찾거나, 문자열을 검증하는 데 사용됩니다. 정규 표현식을 사용하기 때문에 다양한 패턴을 지정할 수 있습니다. 관련 용어 및 개념 정의 정규 표현식(Regular Expression): 문자열에서 특정 패턴을 찾기 위해 사용되는 형식 언어입니다. 해당 문법의 .. 2024. 3. 19.
자바스크립트[JS] - 💯 sort() 함수 총정리 1️⃣ sort() 함수의 개요 sort() 함수는 배열의 요소를 정렬하는 함수로, 배열의 요소를 오름차순 또는 내림차순으로 정렬할 수 있습니다. sort() 함수는 원본 배열을 변경하며, 정렬된 배열을 반환하지 않습니다. 2️⃣ sort() 함수의 사용법 // arr 배열의 요소를 오름차순으로 정렬 const arr = [5, 2, 8, 1, 3]; arr.sort(); console.log(arr); // [1, 2, 3, 5, 8] // arr 배열의 요소를 오름차순으로 정렬 const arr = [10, 3, 1, 5, 2]; arr.sort((a, b) => b - a); // [10, 5, 3, 2, 1] // a는 현재 비교 중인 요소입니다. // b는 다음 요소입니다. // b - a가 음.. 2024. 3. 15.
플러터[FLUTTER] - 💯 스크롤 가능한 레이아웃 구성하기, ListView 1. ListView 정의: 스크롤 가능한 목록을 만드는 위젯 특징: 다양한 데이터를 표시하는 데 유용 여러 개의 아이템을 효율적으로 관리 동적 또는 고정 길이의 목록 생성 가능 스크롤 성능 최적화 다양한 스크롤 효과 적용 가능 (예: ListView.separated) 사용법: ListView 생성자에 children 속성을 사용하여 아이템 목록 지정 itemBuilder 속성을 사용하여 아이템을 동적으로 생성 itemCount 속성을 사용하여 아이템 개수 지정 scrollDirection 속성을 사용하여 스크롤 방향 지정 (수평, 수직) shrinkWrap 속성을 사용하여 리스트 크기 자동 조절 padding 속성을 사용하여 리스트 여백 설정 separatorBuilder 속성을 사용하여 아이템 사이.. 2024. 3. 15.
자바스크립트[JS] - 💯 map() 알아보기 (feat. Python) 1️⃣ map() 함수의 개요 자바스크립트의 map() 함수는 배열의 모든 요소에 함수를 적용하고, 그 결과를 새로운 배열로 반환하는 함수입니다. map() 함수는 다음과 같은 구문을 가집니다. const newArray = array.map(function(element, index, array) { // 함수를 적용할 코드 return result; }); 사용 목적 및 장점 설명 map() 함수는 배열의 각 요소에 함수를 적용해야 할 때 유용합니다. 예를 들어, 배열의 모든 요소를 제곱해야 할 때 map() 함수를 사용할 수 있습니다. 관련 용어 및 개념 정의 array : map() 함수를 적용할 대상이 되는 배열 function(element, index, array): map() 함수가 각 요.. 2024. 3. 14.
플러터[FLUTTER] - 💯 위젯 수평, 수직 나열(정렬) feat.mainAxisAlignment, crossAxisAlignment Row와 Column Row와 Column은 Flutter에서 가장 기본적인 위젯 레이아웃을 구성하는 위젯 Row: 자식 위젯들을 수평으로 나열 Column: 자식 위젯들을 수직으로 나열 사용 예시 // 두 개의 텍스트를 좌우로 나열 Row( children: [ Text('Hello'), Text('World'), ], ), // 두 개의 텍스트를 상하로 나열 Column( children: [ Text('Hello'), Text('World'), ], ), mainAxisAlignment Row 또는 Column 위젯의 주 축 방향으로 자식 위젯들을 정렬하는 방법을 지정 MainAxisAlignment.start: 자식 위젯들을 주 축의 시작 부분에 정렬 MainAxisAlignment.center:.. 2024. 3. 13.

티스토리툴바