JavaScript
-
2023 Series [ 2023 ] CheckPoint, 2023년 2023년 동안 작성했던 의미있다고 생각하는 포스팅들을 모아 둔 게시글입니다 이 글은 2023년이 끝날 때까지 계속해서 업데이트 해 나갈 예정입니다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBoo time-map-installer.tistory.com 진행 기간 : 23/05/11~23/05/14 ( 약 4일 ) 얼마 전 프로그래머스에서 새로 등장한 문제들과 캘린더가 있었습니다. 바로 프로그래머스 코딩 기초 트레이닝 캘린더 입니다. 124문제이긴 하지만 문제들이 간단하여 약 4일 만에 푼 것 같습니다 Day 별 어떤 문제들이 있는 지 궁금하신 분들은 이 이미지를 참고하시면 될 듯 합니다. 문제 정리 보러가..
[Programmers Basic Challenge2] 프로그래머스 코딩 기초 트레이닝 캘린더 완료2023 Series [ 2023 ] CheckPoint, 2023년 2023년 동안 작성했던 의미있다고 생각하는 포스팅들을 모아 둔 게시글입니다 이 글은 2023년이 끝날 때까지 계속해서 업데이트 해 나갈 예정입니다 [ January ] - 변화의 시작, 1월 더보기 [2022WinterBoo time-map-installer.tistory.com 진행 기간 : 23/05/11~23/05/14 ( 약 4일 ) 얼마 전 프로그래머스에서 새로 등장한 문제들과 캘린더가 있었습니다. 바로 프로그래머스 코딩 기초 트레이닝 캘린더 입니다. 124문제이긴 하지만 문제들이 간단하여 약 4일 만에 푼 것 같습니다 Day 별 어떤 문제들이 있는 지 궁금하신 분들은 이 이미지를 참고하시면 될 듯 합니다. 문제 정리 보러가..
2023.05.14 -
ESLint는 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 개발을 하고 ESLint를 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .eslintrc.js의 템플릿을 미리 만들어두었습니다. 개발환경 세팅을 할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 것이 굉장..
[Template] ESLint Template for FrontEnd DevelopersESLint는 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 개발을 하고 ESLint를 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .eslintrc.js의 템플릿을 미리 만들어두었습니다. 개발환경 세팅을 할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 것이 굉장..
2023.05.13 -
Prettier은 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 프론트엔드 개발을 하고 prettier을 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .prettierrc의 템플릿을 미리 만들어두었습니다. 개발 시작할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 ..
[Template] Prettier Template for FrontEnd DevelopersPrettier은 개발할 때 있어 매우 유용하게 쓰이는 코드 품질을 책임져주는 도구들 중 하나입니다. 그리고 여기에는 프론트엔드 개발을 하고 prettier을 사용할 때 미리 커스텀을 해둘 수 있는 파일인 .prettierrc의 템플릿을 미리 만들어두었습니다. 개발 시작할 때 이 글이 많은 도움이 되길 바랍니다. 아래에는 참고하면 좋을 관련 글과 작성하는데 참고했던 프리티어 공식 문서를 두었습니다. [ESLint, husky, Prettier] 당신의 코드 품질을 책임져주는 3가지 도구들 ESLint? Husky? Prettier? ESLint, Husky, Prettier는 프로그래밍을 할 때 코드 품질과 일관성을 유지하기 위한 도구입니다. 그리고 이제 개발의 세계에서는 코드 품질과 일관성을 유지하는 ..
2023.05.13 -
문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 - 로직 설명 주석 // 함수 solution은 세 개의 매개변수를 받습니다. // n: 전체 섹션의 개수 (정수) // m: 한 번에 처리할 수 있는 섹션의 범위 (정수) // section: 처리해야 할 섹션의 목록 (정수 배열) function solution(n, m, section) { // count는 처리된 섹션의 개수를 저장합니다. let count = 0; // location은 현재 처리 위치를 저장합니다. let location = 0; // section 배열의..
[JavaScript/프로그래머스] 연습문제 - 덧칠하기문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 - 로직 설명 주석 // 함수 solution은 세 개의 매개변수를 받습니다. // n: 전체 섹션의 개수 (정수) // m: 한 번에 처리할 수 있는 섹션의 범위 (정수) // section: 처리해야 할 섹션의 목록 (정수 배열) function solution(n, m, section) { // count는 처리된 섹션의 개수를 저장합니다. let count = 0; // location은 현재 처리 위치를 저장합니다. let location = 0; // section 배열의..
2023.05.09 -
문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 - 소인수분해 로직 사용 기존 우리가 알고 있던 약수를 구하는 가장 기본적인 for 문 로직으로는 시간 초과가 발생하였습니다. 그래서 소인수분해를 통해 얻은 각 인수들의 지수+1 을 더하는 로직을 사용하여 문제를 해결했습니다. function solution(number, limit, power) { let answer = 1; // 소인수 분해 함수 정의 function primeFactorization(num) { const factors = {}; let divisor = 2;..
[JavaScript/프로그래머스] 연습문제 - 기사단원의 무기문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 - 소인수분해 로직 사용 기존 우리가 알고 있던 약수를 구하는 가장 기본적인 for 문 로직으로는 시간 초과가 발생하였습니다. 그래서 소인수분해를 통해 얻은 각 인수들의 지수+1 을 더하는 로직을 사용하여 문제를 해결했습니다. function solution(number, limit, power) { let answer = 1; // 소인수 분해 함수 정의 function primeFactorization(num) { const factors = {}; let divisor = 2;..
2023.05.09 -
문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(cards1, cards2, goal) { let answer = "Yes"; // 여기에 이전 사용한 카드 뭉치 명 저장 let lastCards = "cards2"; // 여기에 만들어지는 문장 저장 let sentence = []; // 각각의 카드들에서 하나씩 빼가면서 0번째 자리에 들어갈 수 있는 지 확인하는 로직 goal.forEach((g) => { if (g === cards1[0] && cards1) { sentence.push(ca..
[JavaScript/프로그래머스] 연습문제 - 카드 뭉치문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(cards1, cards2, goal) { let answer = "Yes"; // 여기에 이전 사용한 카드 뭉치 명 저장 let lastCards = "cards2"; // 여기에 만들어지는 문장 저장 let sentence = []; // 각각의 카드들에서 하나씩 빼가면서 0번째 자리에 들어갈 수 있는 지 확인하는 로직 goal.forEach((g) => { if (g === cards1[0] && cards1) { sentence.push(ca..
2023.05.08 -
문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(s) { let answer = ''; s = s.split(" "); answer = `${Math.min(...s)} ${Math.max(...s)}`; return answer; } 로직 설명 주어진 숫자들이 들어있는 문자열 s를 공백을 기준으로 나눕니다. 템플릿 리터럴을 이용하여 간결하게 문자열 내에 최솟값과 최댓값을 배치합니다. 정답을 반환합니다. 1차 개선 - 한 줄 코드 만들기 불필요한 선언과 리턴을 줄여 한 줄 코드로 만든 결과물 입니다..
[JavaScript/프로그래머스] 연습문제 - 최댓값과 최솟값문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(s) { let answer = ''; s = s.split(" "); answer = `${Math.min(...s)} ${Math.max(...s)}`; return answer; } 로직 설명 주어진 숫자들이 들어있는 문자열 s를 공백을 기준으로 나눕니다. 템플릿 리터럴을 이용하여 간결하게 문자열 내에 최솟값과 최댓값을 배치합니다. 정답을 반환합니다. 1차 개선 - 한 줄 코드 만들기 불필요한 선언과 리턴을 줄여 한 줄 코드로 만든 결과물 입니다..
2023.05.08 -
문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(lottos, win_nums) { let answer = []; let sameNumCount = 0; let zeroCount = 0; // lottos와 win_nums를 크기순으로 정렬 // 우선 이 둘의 같은 숫자의 개수와 0의 개수를 따로 저장 // 같은 숫자의 개수는 최저 점수가 될 것이고, 같은 숫자 + 0의 개수를 더한 순위는 최고 점수가 될 것 lottos.forEach((l) => { if (win_nums.includes(l)) ..
[JavaScript/프로그래머스] Dev-Matching: 웹 백엔드 개발자(상반기) - 로또의 최고 순위와 최저 순위문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(lottos, win_nums) { let answer = []; let sameNumCount = 0; let zeroCount = 0; // lottos와 win_nums를 크기순으로 정렬 // 우선 이 둘의 같은 숫자의 개수와 0의 개수를 따로 저장 // 같은 숫자의 개수는 최저 점수가 될 것이고, 같은 숫자 + 0의 개수를 더한 순위는 최고 점수가 될 것 lottos.forEach((l) => { if (win_nums.includes(l)) ..
2023.05.08 -
문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(k, score) { let lowList = []; let nowList = []; for (let i = 0; i Math.min(a, b))); nowList.sort((a, b) => a - b); } else { if (score[i] > nowL..
[JavaScript/프로그래머스] 연습문제 - 명예의 전당 (1)문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 초기 정답 코드 function solution(k, score) { let lowList = []; let nowList = []; for (let i = 0; i Math.min(a, b))); nowList.sort((a, b) => a - b); } else { if (score[i] > nowL..
2023.05.04 -
DFS, Depth-First Search라고 불리는 이 깊이 우선 탐색은 대표적으로 많이 사용되는 알고리즘 중 하나 입니다. 이 글에서는 어떤 상황에서 BFS를 사용하며, 어떤 코드에서 사용되고 있는 지 알아보도록 하겠습니다. 깊이 우선 탐색(DFS)란 무엇일까? 깊이 우선 탐색(Depth-First Search)은 그래프나 트리와 같은 자료 구조에서 노드를 탐색하는 알고리즘 중 하나입니다. DFS는 시작 노드에서 출발하여 깊이를 우선으로 하여 노드들을 방문하는 방식으로, 한 경로의 최대 깊이까지 도달한 후 다시 이전 노드로 돌아와 미방문 인접 노드를 방문하는 방식으로 진행됩니다. DFS는 다음과 같은 순서로 실행됩니다 시작 노드를 방문합니다. 방문한 노드를 기준으로 인접한 미방문 노드가 있으면 그 노..
[JavaScript] 깊이 우선 탐색, DFS(Depth-First Search)DFS, Depth-First Search라고 불리는 이 깊이 우선 탐색은 대표적으로 많이 사용되는 알고리즘 중 하나 입니다. 이 글에서는 어떤 상황에서 BFS를 사용하며, 어떤 코드에서 사용되고 있는 지 알아보도록 하겠습니다. 깊이 우선 탐색(DFS)란 무엇일까? 깊이 우선 탐색(Depth-First Search)은 그래프나 트리와 같은 자료 구조에서 노드를 탐색하는 알고리즘 중 하나입니다. DFS는 시작 노드에서 출발하여 깊이를 우선으로 하여 노드들을 방문하는 방식으로, 한 경로의 최대 깊이까지 도달한 후 다시 이전 노드로 돌아와 미방문 인접 노드를 방문하는 방식으로 진행됩니다. DFS는 다음과 같은 순서로 실행됩니다 시작 노드를 방문합니다. 방문한 노드를 기준으로 인접한 미방문 노드가 있으면 그 노..
2023.05.04 -
BFS, Breadth-First Search라고 불리는 이 너비 우선 탐색은 대표적으로 많이 사용되는 알고리즘 중하나입니다. 이 글에서는 어떤 상황에서 BFS를 사용하며, 어떤 코드에서 사용되고 있는 지 알아보도록 하겠습니다. 너비 우선 탐색(BFS)란 무엇일까? 너비 우선 탐색(Breadth-First Search, BFS)은 그래프와 트리에서 사용되는 탐색 알고리즘 중 하나로, 루트 노드로부터 시작해서 인접한 노드를 먼저 방문하고, 그 다음에 인접한 노드들의 인접한 노드들을 방문하는 식으로 레벨 순서대로 진행하는 방식입니다. BFS는 주로 최단 경로를 찾거나, 두 노드 간의 경로가 있는지 여부를 확인하는 데 사용됩니다. BFS 알고리즘은 다음과 같은 순서로 수행됩니다. 시작 노드를 큐(Queue)에..
[JavaScript] 너비 우선 탐색, BFS(Breadth-First Search)BFS, Breadth-First Search라고 불리는 이 너비 우선 탐색은 대표적으로 많이 사용되는 알고리즘 중하나입니다. 이 글에서는 어떤 상황에서 BFS를 사용하며, 어떤 코드에서 사용되고 있는 지 알아보도록 하겠습니다. 너비 우선 탐색(BFS)란 무엇일까? 너비 우선 탐색(Breadth-First Search, BFS)은 그래프와 트리에서 사용되는 탐색 알고리즘 중 하나로, 루트 노드로부터 시작해서 인접한 노드를 먼저 방문하고, 그 다음에 인접한 노드들의 인접한 노드들을 방문하는 식으로 레벨 순서대로 진행하는 방식입니다. BFS는 주로 최단 경로를 찾거나, 두 노드 간의 경로가 있는지 여부를 확인하는 데 사용됩니다. BFS 알고리즘은 다음과 같은 순서로 수행됩니다. 시작 노드를 큐(Queue)에..
2023.05.04 -
영상으로 보기 [Techeer Talk] About JavaScript ES6 자료 JavaScript ES6를 소개합니다 JavaScript의 역사 JavaScript ES6 소개 주요 문법 소개 문법별 예제 코드 활용법 및 실전 적용 JavaScript의 역사 JavaScript는 웹 개발에서 가장 많이 사용되는 프로그래밍 언어 중 하나입니다 European Computer Manufactures Association + Script 유럽 컴퓨터 제조업체 협회를 뜻하며 ECMA의 표준화에 많은 역할을 담당했습니다 년도별로 살펴보기 넷스케이프 커뮤니케이션즈에서 브라우저 상에서 동작하는 스크립트 언어로 개발 초기 이름은 'LiveScript'이었으나, 자바의 인기에 편승하기 위해 'JavaScript'로..
[Techeer Talk] JavaScript ES6에는 어떤 변화가 있었을까?영상으로 보기 [Techeer Talk] About JavaScript ES6 자료 JavaScript ES6를 소개합니다 JavaScript의 역사 JavaScript ES6 소개 주요 문법 소개 문법별 예제 코드 활용법 및 실전 적용 JavaScript의 역사 JavaScript는 웹 개발에서 가장 많이 사용되는 프로그래밍 언어 중 하나입니다 European Computer Manufactures Association + Script 유럽 컴퓨터 제조업체 협회를 뜻하며 ECMA의 표준화에 많은 역할을 담당했습니다 년도별로 살펴보기 넷스케이프 커뮤니케이션즈에서 브라우저 상에서 동작하는 스크립트 언어로 개발 초기 이름은 'LiveScript'이었으나, 자바의 인기에 편승하기 위해 'JavaScript'로..
2023.04.16