전체 글 179

JavaScript - startsWith(), endsWith(), includes()

📚 startsWith()- startsWith() 함수는 문자열 객체의 메서드 중 하나로 해당 문자열이 지정된 접두사로 시작하는지 여부 확인- boolean 값을 반환string.startsWith(searchString[, position])- searchString : 검색할 접두사로 사용할 문자열- position(선택) : 검색을 시작할 인덱스를 나타내는 정수, 기본값은 0이고 생략하면 전체 문자열을 대상📚 endsWith()- endsWith() 함수는 문자열 객체의 메서드 중 하나로 해당 문장려이 지정된 접미사로 끝나는지 여부 확인- boolean 값을 반환string.endsWidth(searchString[, position])📚 includes()- 하나의 문자열이 다른 문장려에 ..

공부/JavaScript 2024.09.02

Q. 이차원으로 만들기

정수 배열 num_list와 정수 n이 매개변수로 주어집니다. num_list를 다음 설명과 같이 2차원 배열로 바꿔 return하도록 solution 함수를 완성해주세요. num_list가 [1, 2, 3, 4, 5, 6, 7, 8] 로 길이가 8이고 n이 2이므로 num_list를 2 * 4 배열로 다음과 같이 변경합니다. 2차원으로 바꿀 때에는 num_list의 원소들을 앞에서부터 n개씩 나눠 2차원 배열로 변경합니다. 🚫제한 사항 1 ≤ my_string ≤ 110 my_string은 대문자, 소문자, 공백으로 구성되어 있습니다. 대문자와 소문자를 구분합니다. 공백(" ")도 하나의 문자로 구분합니다. 중복된 문자 중 가장 앞에 있는 문자를 남깁니다. ❗입출력 예 num_list n result ..

Q. 중복된 문자 제거

문자열 my_string이 매개변수로 주어집니다. my_string에서 중복된 문자를 제거하고 하나의 문자만 남긴 문자열을 return하도록 solution 함수를 완성해주세요. 🚫제한 사항 1 ≤ my_string ≤ 110 my_string은 대문자, 소문자, 공백으로 구성되어 있습니다. 대문자와 소문자를 구분합니다. 공백(" ")도 하나의 문자로 구분합니다. 중복된 문자 중 가장 앞에 있는 문자를 남깁니다. ❗입출력 예 my_string result "people" "peol" "We are the world" "We arthwold" 😀 내가 푼 답 const solution = (my_string) => { return [...new Set(my_string)].join("") } Set 중복되..

MVC Pattern

ⅰ) Model !!→ 데이터(data)가공을 책입지는 컴포넌트(component) - 모델은 어플리케이션의 정보, 데이터를 나타냄 - 데이터베이스, 초기화 된 상수나 값, 변수 등을 뜻함 - 비지니스 로직을 처리한 후 모델의 변경 사항을 컨트롤러와 뷰에 전달함 - Model의 규칙 - 사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 함 - 뷰나 컨트롤러에 대해서 어떤 정보도 알지 말아야 함 - 변경이 일어나면, 변경 통지에 대한 처리 방법을 구현해야만함 ⅱ) View !! → 사용자에게 보여지는 부분, 즉 유저 인터페이스(User interface)를 의미함 - MVC 패턴은 여러 개의 뷰가 존재할 수 있으며, 모델에게 질의하여 데이터를 전달받음 - 뷰는 받은 데이터를 화면에 표시해주는 역할을 가..

공부/CS 2024.03.04

Q. 최대값 만들기(2)

정수 배열 numbers가 매개변수로 주어집니다. numbers의 원소 중 두 개를 곱해 만들 수 있는 최댓값을 return하도록 solution 함수를 완성해주세요. 🚫제한 사항 -10,000 ≤ numbers의 원소 ≤ 10,000 2 ≤ numbers 의 길이 ≤ 100 ❗입출력 예 numbers result [1, 2, -3, 4, -5] 15 [0, -31, 24, 10, 1, 9] 240 [10, 20, 30, 5, 5, 20, 5] 600 😀 내가 푼 답 const solution = (numbers) => { let arr = [] for(let i = 0; i < numbers.length; i++){ for(let j = 0; j a - b); return Math.max(numbers..

Q. 주사위의 개수

머쓱이는 직육면체 모양의 상자를 하나 가지고 있는데 이 상자에 정육면체 모양의 주사위를 최대한 많이 채우고 싶습니다. 상자의 가로, 세로, 높이가 저장되어있는 배열 box와 주사위 모서리의 길이 정수 n이 매개변수로 주어졌을 때, 상자에 들어갈 수 있는 주사위의 최대 개수를 return 하도록 solution 함수를 완성해주세요. 🚫제한 사항 box의 길이는 3입니다. box[0] = 상자의 가로 길이 box[1] = 상자의 세로 길이 box[2] = 상자의 높이 길이 1 ≤ box의 원소 ≤ 100 1 ≤ n ≤ 50 n ≤ box의 원소 주사위는 상자와 평행하게 넣습니다. ❗입출력 예 box n result [1, 1, 1] 1 1 [10, 8, 6] 3 12 😀 내가 푼 답 const solutio..

Q. 가장 큰 수 찾기

정수 배열 array가 매개변수로 주어질 때, 가장 큰 수와 그 수의 인덱스를 담은 배열을 return 하도록 solution 함수를 완성해보세요. 🚫제한 사항 1 ≤ array의 길이 ≤ 100 0 ≤ array 원소 ≤ 1,000 array에 중복된 숫자는 없습니다. ❗입출력 예 array result [1, 8, 3] [8, 1] [9, 10, 11, 8] [11, 2] 😀 내가 푼 답 const solution = (array) => { return [Math.max(...array), array.indexOf(Math.max(...array))] } 😊 문제풀이 답안 OR 다른사람들 답안 // 1 function solution(array) { let max = Math.max(...array)..

Q. 인덱스 바꾸기

문자열 my_string과 정수 num1, num2가 매개변수로 주어질 때, my_string에서 인덱스 num1과 인덱스 num2에 해당하는 문자를 바꾼 문자열을 return 하도록 solution 함수를 완성해보세요. 🚫제한 사항 1 { const arr = [...my_string] arr.splice(num1, 1, my_string[num2]) arr.splice(num2, 1, my_string[num1]) return arr.join("") } 😊 문제풀이 답안 OR 다른사람들 답안 function solution(my_string, num1, num2) { my_string = my_string.split(''); [my_string[num1], my_string[num2]] = [my_s..

Design System이란?

❓ Design System 이란? 재사용 가능한 UI 구성 요소의 모음 버튼과 같은 UI 요소와 텍스트 요소 및 디자인 파일에서 재사용될 요소를 정의할 수 있음 미리 만들어놓고 하나씩 꺼내서 쓰는 시스템으로 이해하면 됨 ex. apple 디자인 시스템 ❗️❗️ Design System을 사용하는 이유 디자인 시스템의 주요 이점 중 하나는 일관성!! 색상, 타이포그래피, 간격 및 기타 많은 항목이 명확하게 정의된 디자인 시스템이 있다면 디자인 파일 전체에 일관성이 보장되게 됨 → 일관성이 보장된다는 것은 브랜드를 가지게 된다는 뜻! 구축된 시스템은 디자인 & 개발의 워크플로우를 매우 쉽게 만듦 → 디자이너가 모듈(컴포넌트) 형태로 작업물을 만들면 이를 가지고 개발자가 컴포넌트 중심의 개발을 할 수 있게 ..

SCSS 기본 정리 - SCSS, CSS, Sass 1

📌 SCSS SCSS는 Sass3 버전부터 새롭게 등장 SCSS는 Sass의 모든 기능을 지원하는 Superset SCSS는 CSS와 거의 비슷한 문법으로 Sass의 기능을 사용할 수 있어서 편리함 📚 CSS의 단점 CSS는 복잡한 언어는 아니지만 작업이 커지거나 코드가 많아지면 불편함이 생김 -> 유지보수가 어려워진다는 단점이 있음 선택자(Selector)를 만들때 매번 불필요한 부모요소 선택자를 적어야 함 funtion같은게 없으니, 규모가 큰 프로젝트의 경우 자동화하기 어렵고 모든 것을 수동으로 변경해야 함 결국에는 중복되는 코드가 많아 코드 줄수가 길어져 유지보수에 마이너스적인 요소가 됨 📚 SASS(Synthetically Awesome StyleSheets) Sass는 코드의 재활용성을 올리고..

IT/CSS 2024.02.14