본문 바로가기
반응형

분류 전체보기706

[JavaScript] Array.from() - 유사 배열을 가지고 새로운 배열 만들기 Array.from() 메서드는 제목 그대로 유사 배열 객체(array-like object)나 반복 가능한 객체(iterable object)를 얕게 복사해 새로운 Array 객체를 만들어주는 메서드이다. ▷ 구문Array.from(arrayLike[, mapFn[, thisArg]])arrayLike: 배열로 변환하고자 하는 유사 배열 객체나 반복 가능한 객체.mapFn: 배열의 모든 요소에 대해 호출할 맵핑 함수 (배열의 map 메서드와 동일하다 생각하면 된다.)thisArg: mapFn 실행 시에 this로 사용할 값유사 배열이란 length 속성과 인덱싱 된 요소를 가진 객체를 의미하며, 반복 가능한 객체는 Map, Set 등 객체의 요소를 얻을 수 있는 객체를 의미한다. (Set을 Array... 2022. 7. 26.
[ReactJS] snippet을 사용한 템플릿 자동 완성 기능 사용하기 ReactJS 코드 템플릿을 자동 완성하는 방법에 대해 알아보자. 1. 우선 당연히 확장 프로그램부터 설치를 진행해야 한다. Reactjs code snippets Reactjs code snippets - Visual Studio Marketplace Extension for Visual Studio Code - Code snippets for Reactjs development in ES6 syntax marketplace.visualstudio.com Reactjs code snippets라는 확장 프로그램을 설치해주자. (vscode에서 설치해주면 된다.) 2. 설치가 완료되었다면 파일에서 특정 코드를 입력해주면 된다. 지원하는 파일 확장자는 .js / .ts / .jsx / .tsx 이다. 아래.. 2022. 7. 26.
[백준] 2206번 : 벽 부수고 이동하기 (골드 Ⅳ) by node.js ▷ 문제 : 2206번 - 벽 부수고 이동하기 2206번: 벽 부수고 이동하기 N×M의 행렬로 표현되는 맵이 있다. 맵에서 0은 이동할 수 있는 곳을 나타내고, 1은 이동할 수 없는 벽이 있는 곳을 나타낸다. 당신은 (1, 1)에서 (N, M)의 위치까지 이동하려 하는데, 이때 최단 경로 www.acmicpc.net ▷ 해결 날짜 : 2022.07.22 ▷ 소요 시간 : 3시간 ▷ 풀이 과정 : 이 문제는 내가 현재 풀 수 없는 문제이다. 타 회사의 코테 문제로 나왔던 비슷한 유형의 문제인데, 최단거리를 구하는 문제이며 벽을 "한 번" 부술 수 있다. BFS의 응용인 것은 알겠는데, 도저히 접근하는 방법이 떠오르지 않아 혼자서는 풀 수 없었다. 일단 구글링의 도움을 받아 해결을 하였는데, 기본 틀은 일반.. 2022. 7. 22.
[백준] 2468번 : 안전 영역 (실버Ⅰ) by node.js ▷ 문제 : 2468번 - 안전 영역 2468번: 안전 영역 재난방재청에서는 많은 비가 내리는 장마철에 대비해서 다음과 같은 일을 계획하고 있다. 먼저 어떤 지역의 높이 정보를 파악한다. 그 다음에 그 지역에 많은 비가 내렸을 때 물에 잠기지 않는 www.acmicpc.net ▷ 해결 날짜 : 2022.07.14 ▷ 소요 시간 : 1시간 ▷ 풀이 과정 : 문제를 요약하자면 장마철에 물에 잠기지 않는 안전한 영역의 최대 개수를 출력하는 문제이다. 여기서 장마철의 강수량은 알 수 없고, 그저 강수량에 따라서 물에 잠기지 않는 안전한 영역의 개수가 다르게 되는데, 그중에서 최대 값을 출력해야 한다. 우선 각 지점의 높이가 주어지니 거기서 최댓값을 따로 저장해 두고, 강수량을 1부터 최댓값까지 계속해서 높여가며.. 2022. 7. 14.
[VueJS] (Vue 3) - Vuex 타입 추론 설정하기 본문을 시작하기에 앞 서 아래 링크를 통해 우선 Vuex에서 Typesciprt를 사용하는 방법에 대해 알아온 다음에 이 게시글을 보도록 하자 (아래 게시글을 토대로 작성하였다.) * [VueJS] (Vue 3) - Vuex를 Typescript로 사용하기 [VueJS] (Vue 3) - Vuex를 Typescript로 사용하기 본 글은 vue-cli로 생성한 vue 프로젝트 기준으로 작성하였으며, vuex를 잘 모르겠다면 아래 글을 참고하자. * [VueJS] Vuex 사용하기 (1) - 설치, 세팅 및 기본 사용법 (ft. Composition API) * [Vue.. mine-it-record.tistory.com 일단 서론부터 시작하자면 Vuex에서 Typescript를 사용하게 된다면 별다른 설.. 2022. 7. 14.
[JavaScript] Array.isArray() - 배열(Array)이 맞는지 판별/확인하기 Array.isArray() 메서드는 제목 그대로 배열인지 확인하기 위한 메서드이다. 배열인지를 확인할 때 instanceof나 typeof 대신에 Array.isArray()를 사용하는 것이 더 정확한 결과를 얻을 수 있다. ▷ 구문 Array.isArray(obj) obj: 검사할 객체 ▷ 예제 1) Array.isArray() true/false 판별 // 모두 true 반환 Array.isArray([]); Array.isArray([1]); Array.isArray(new Array()); Array.isArray(new Array('a', 'b', 'c', 'd')); Array.isArray(new Array(3)); // Array.prototype은 스스로도 배열입니다 Array.isAr.. 2022. 7. 13.
[JavaScript] at() - 문자열/배열의 특정 인덱스 위치에 있는 값 가져오기 (ft. 음수) 배열 또는 문자열에서 특정 인덱스에 위치한 값을 가져오는 방법은 매우 간단한데, 좀 더 복잡하게 뒤에서부터 몇 번째 같은 경우처럼 처리하기 난감한 상황들이 간혹 존재한다. (대체적으로 "전체 길이 - 1"로 처리를 해왔었던 것 같다.) 하지만 드디어 스크립트에서도 양수와, 음수를 가지고 특정 인덱스에 접근하는 걸 도와주는 메서드가 생겼다.각각 String.prototype.at() 와 Array.prototype.at()이며, 한번 알아가 보도록 하자. ▷ 구문.at(index)index: 반환할 배열 요소의 인덱스(위치)이다. 음수 인덱스를 전달할 때 배열 끝에서 상대 인덱싱을 지원한다. (즉, 음수를 사용하는 경우에는 배열의 끝에서부터 역으로 위치를 계산해서 가져온다.) 예제를 통해 알아보자.▷ 예제.. 2022. 7. 13.
[백준] 5014번 : 스타트링크 (골드Ⅴ) by node.js ▷ 문제 : 5014번 - 스타트링크 5014번: 스타트링크 첫째 줄에 F, S, G, U, D가 주어진다. (1 ≤ S, G ≤ F ≤ 1000000, 0 ≤ U, D ≤ 1000000) 건물은 1층부터 시작하고, 가장 높은 층은 F층이다. www.acmicpc.net ▷ 해결 날짜 : 2022.07.06 ▷ 소요 시간 : 25분 ▷ 풀이 과정 : 문제를 요약하면 아래와 같다. F, S, G, U, D 이렇게 다섯 개가 주어지고 범위는 (1 ≤ S, G ≤ F ≤ 1000000, 0 ≤ U, D ≤ 1000000) 건물은 1층부터 시작하고, 가장 높은 층은 F층이다. 현재 위치는 S이며, U버튼을 눌러서 위로, D 버튼을 눌러 아래로 갈 수 있다. 그렇게 해서 G층에 도달할 때 버튼을 몇 번 눌러서 도.. 2022. 7. 6.
[백준] 1697번 : 숨바꼭질 (실버Ⅰ) by node.js ▷ 문제 : 1697번 - 숨바꼭질 1697번: 숨바꼭질 수빈이는 동생과 숨바꼭질을 하고 있다. 수빈이는 현재 점 N(0 ≤ N ≤ 100,000)에 있고, 동생은 점 K(0 ≤ K ≤ 100,000)에 있다. 수빈이는 걷거나 순간이동을 할 수 있다. 만약, 수빈이의 위치가 X일 www.acmicpc.net ▷ 해결 날짜 : 2022.07.03 ▷ 소요 시간 : 1시간 ▷ 풀이 과정 : 숨바꼭질을 할 때 술래는 걸어서 (X - 1, X + 1) 만큼 이동할 수 있고 순간이동을 하여 (X * 2) 만큼 이동할 수 있다고 한다. 여기서 술래(수빈이) 와 동생이 숨바꼭질을 하는데, 수빈이가 동생을 찾을 수 있는 가장 빠른 시간이 몇 초 후인지 구하는 문제이다. 문제만 보면 사실 어떻게 풀어야 하는지 막막하기만.. 2022. 7. 3.
반응형
TOP