티스토리

NH_3521099031483

검색하기

블로그 홈

NH_3521099031483

nh-3521099031483.tistory.com/m

nh_3521099031483 님의 블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

TypeScript #7 제네릭 Generics // Generic// 제너릭을 이용하면 클래스나 함수, 인터페이스를 다양한 타입으로 재사용할 수 있다.function getSize(arr: number[]):number { return arr.length;}const arr1 = [1, 2, 3];getSize(arr1); // 3const arr2 = ["a", "b", "c"];getSize(arr2) // 이렇게 매개변수의 타입이 바뀌었는데 동일한 함수를 재사용 하고싶다면 // 함수 오버로드를 사용하던가 유니온 타입을 사용할 수 있다.// 사용예제function getSize2(arr: T[]):number { // 꺽쇠에 대문자 T를 적어준다, 이를 타입파라미터라고 한다. X나 A이런것을 적어도 상관없다. retur.. 공감수 0 댓글수 0 2024. 5. 29.
TypeScript #6 클래스 Class class Car { constructor(color) { this.color = color; // color프로퍼티가 없다고 에러가 나온다 } start() { console.log('start') }}const bmw = new Car('red'); // 자바스크립트에서는 문제가 없다고 나오지만 타입스크립트는 에러가 나온다.// 해결 예제class Car { color: string; // 타입스크립트에서 클래스를 작성할 때 멤버변수는 미리 선언해줘야 한다. constructor(color: string) { this.color = color; } start() { console.log('start') }}const bmw = new Car('red'); // .. 공감수 0 댓글수 0 2024. 5. 29.
[프로그래머스] Level 2 - 모음 사전 JavaScript 문제 설명사전에 알파벳 모음 'A', 'E', 'I', 'O', 'U'만을 사용하여 만들 수 있는, 길이 5 이하의 모든 단어가 수록되어 있습니다. 사전에서 첫 번째 단어는 "A"이고, 그다음은 "AA"이며, 마지막 단어는 "UUUUU"입니다.단어 하나 word가 매개변수로 주어질 때, 이 단어가 사전에서 몇 번째 단어인지 return 하도록 solution 함수를 완성해주세요.제한사항word의 길이는 1 이상 5 이하입니다.word는 알파벳 대문자 'A', 'E', 'I', 'O', 'U'로만 이루어져 있습니다.입출력 예word .. 공감수 0 댓글수 0 2024. 5. 29.
[프로그래머스] 옹알이 (2) Javascript 문제 설명머쓱이는 태어난 지 11개월 된 조카를 돌보고 있습니다. 조카는 아직 "aya", "ye", "woo", "ma" 네 가지 발음과 네 가지 발음을 조합해서 만들 수 있는 발음밖에 하지 못하고 연속해서 같은 발음을 하는 것을 어려워합니다. 문자열 배열 babbling이 매개변수로 주어질 때, 머쓱이의 조카가 발음할 수 있는 단어의 개수를 return하도록 solution 함수를 완성해주세요.제한사항-1 ≤ babbling의 길이 ≤ 1001 ≤ babbling[i]의 길이 ≤ 30문자열은 알파벳 소문자로만 이루어져 있습니다.입출력 예 설명입출력 예 #1["aya", "yee", "u", "maa"]에서 발음할 수 있는 것은 "aya"뿐입니다. 따라서 1을 return합니다.입출력 예 #2["aya.. 공감수 0 댓글수 0 2024. 5. 24.
[프로그래머스] 영어 끝말잇기 JavaScript 문제1부터 n까지 번호가 붙어있는 n명의 사람이 영어 끝말잇기를 하고 있습니다. 영어 끝말잇기는 다음과 같은 규칙으로 진행됩니다.1번부터 번호 순서대로 한 사람씩 차례대로 단어를 말합니다.마지막 사람이 단어를 말한 다음에는 다시 1번부터 시작합니다.앞사람이 말한 단어의 마지막 문자로 시작하는 단어를 말해야 합니다.이전에 등장했던 단어는 사용할 수 없습니다.한 글자인 단어는 인정되지 않습니다.다음은 3명이 끝말잇기를 하는 상황을 나타냅니다.tank → kick → know → wheel → land → dream → mother → robot → tank위 끝말잇기는 다음과 같이 진행됩니다.1번 사람이 자신의 첫 번째 차례에 tank를 말합니다.2번 사람이 자신의 첫 번째 차례에 kick을 말합니다.3번 .. 공감수 0 댓글수 0 2024. 5. 24.
[프로그래머스] 뉴스 클러스터링 JavaScript 문제 설명여러 언론사에서 쏟아지는 뉴스, 특히 속보성 뉴스를 보면 비슷비슷한 제목의 기사가 많아 정작 필요한 기사를 찾기가 어렵다. Daum 뉴스의 개발 업무를 맡게 된 신입사원 튜브는 사용자들이 편리하게 다양한 뉴스를 찾아볼 수 있도록 문제점을 개선하는 업무를 맡게 되었다.개발의 방향을 잡기 위해 튜브는 우선 최근 화제가 되고 있는 "카카오 신입 개발자 공채" 관련 기사를 검색해보았다.카카오 첫 공채..'블라인드' 방식 채용카카오, 합병 후 첫 공채.. 블라인드 전형으로 개발자 채용카카오, 블라인드 전형으로 신입 개발자 공채카카오 공채, 신입 개발자 코딩 능력만 본다카카오, 신입 공채.. "코딩 실력만 본다"카카오 "코딩 능력만으로 2018 신입 개발자 뽑는다"기사의 제목을 기준으로 "블라인드 전형"에.. 공감수 0 댓글수 0 2024. 5. 17.
TypeScript #5 리터럴, 유니온/교차 타입 // Literal Typesconst userName1 = "Bob" // userName1에 마우스를 올려보면 "Bob"이라고 나온다. 변화할 수 없으니 Bob이외의 값은 넣을 수 없다.// userName1처럼 정해진 string값을 가진 것을 문자열 리터럴 타입이라고 한다.let userName2 = "Tom" // 반면 userName2는 언제든 변화할 수 있으니 넓은 개념의 string타입으로 정의된다.userName2 = 3 // string타입이므로 에러가 난다let userName3: string | number = "Andy"userName3 = 3 // 숫자도 넣을 수 있게 해주려면 명시적으로 작성해 주어야 한다.type Job = "police" | "developer" | "tea.. 공감수 0 댓글수 0 2024. 5. 16.
npm과 yarn의 차이 NPM vs Yarn - npm : Node module을 관리하기 위해서 만들어진 근본 툴이라고 생각하면 된다.node를 설치하면 자동적으로 설치가 되서 node -v로 체크가 가능하다.npm이라는 툴이 굉장히 좋은 툴이지만 좀 느린 편이다.느린 이유는 지금은 해결이 되었을지 모르지만 npm은 순차적 처리가 기본이다.설치해야 될 모듈이 100개면 100개를 하나씩 다 설치하는 구조이다. - yarn : 페이스북에서 만든 오픈소스, 훨씬 빨리 모듈들을 설치하는 방식으로 구현되어 있다.패키지 인스톨 속도도 빠르고, 관리할 때 에러가 나오는 경우도 좀 적다.(명령어도 짧아서 편하다 ㅋㅋ) 둘 다 좋은 툴이고 어떤걸 사용해도 상관은 없다.다만 나 같은 초보개발자들이 주의해야 할 점은 하나를 사용하면 그거를 계.. 공감수 0 댓글수 0 2024. 5. 16.
[프로그래머스] 햄버거 만들기 JavaScript 문제 설명햄버거 가게에서 일을 하는 상수는 햄버거를 포장하는 일을 합니다. 함께 일을 하는 다른 직원들이 햄버거에 들어갈 재료를 조리해 주면 조리된 순서대로 상수의 앞에 아래서부터 위로 쌓이게 되고, 상수는 순서에 맞게 쌓여서 완성된 햄버거를 따로 옮겨 포장을 하게 됩니다. 상수가 일하는 가게는 정해진 순서(아래서부터, 빵 – 야채 – 고기 - 빵)로 쌓인 햄버거만 포장을 합니다. 상수는 손이 굉장히 빠르기 때문에 상수가 포장하는 동안 속 재료가 추가적으로 들어오는 일은 없으며, 재료의 높이는 무시하여 재료가 높이 쌓여서 일이 힘들어지는 경우는 없습니다.예를 들어, 상수의 앞에 쌓이는 재료의 순서가 [야채, 빵, 빵, 야채, 고기, 빵, 야채, 고기, 빵]일 때, 상수는 여섯 번째 재료가 쌓였을 때, 세.. 공감수 0 댓글수 0 2024. 5. 14.
[프로그래머스]괄호 회전하기 Javascript 1. 문제 설명[](){} 이러한 형태의 문자열이 주어진다. 그리고 문자열을 왼쪽으로 x만큼 회전시킨다.0번만큼 회전시키면 그대로, 1번만큼 회전시키면 ](){}[ 이 된다.이런식으로 문자열의 길이-1 까지 계속 회전시킨다.각각 회전시킨 문자열에 대해 올바른 문자열인지 확인한다.올바른 문자열의 조건은 문제에서 다음과 같다.(), [], {} 는 모두 올바른 괄호 문자열입니다.만약 A가 올바른 괄호 문자열이라면, (A), [A], {A} 도 올바른 괄호 문자열입니다. 예를 들어, [] 가 올바른 괄호 문자열이므로, ([]) 도 올바른 괄호 문자열입니다.만약 A, B가 올바른 괄호 문자열이라면, AB 도 올바른 괄호 문자열입니다. 예를 들어, {} 와 ([]) 가 올바른 괄호 문자열이므로, {}([]) 도 .. 공감수 0 댓글수 0 2024. 5. 14.
Typescript #4 함수 타입스크립트 함수에 대해 알아보자.// 함수가 반환하는 타입을 적어주면 된다function add(num1:number, num2:number): number{ return num1 + num2;}// 아무것도 리턴해주지 않으면 void라고 적어주면 된다function add2(num1:number, num2:number): void{ // return num1 + num2; console.log(num1+num2)}// 원하는 리턴 타입을 넣어준다function isAdult(age: number): boolean { return age > 19;}// 인터페이스처럼 함수의 매개변수도 옵셔널(?)로 지정할 수 있다.function hello(name: string) { return `Hello.. 공감수 0 댓글수 0 2024. 5. 3.
Typescript #3 인터페이스(interface) 타입스크립트 인터페이스에 대해 알아보자.let user:object;user = { name: 'xx', age: 30}console.log(user.name) // user의 name을 찍어보면 에러가 발생한다. 오브젝트에는 특정 속성값의 정보가 없기 때문이다.// 이렇게 프로퍼티를 정의해서 객체로 표현하고자 할 때는 인터페이스를 사용한다.// 1. 인터페이스 사용 예제type Score = 'A'|'B'|'C'|'F'; // 타입을 만들어서 지정할 수 있다.interface User { name : string; age : number; gender? : string; // 있어도 되고 없어도 되는 옵셔널한 프로퍼티이다. ? 사용 readonly birthYear : number; [gr.. 공감수 0 댓글수 0 2024. 5. 3.
Typescript #2 기본 타입 타입스크립트 기본 타입에 대해 알아보자let car:string = 'bmw'; // car 안에 있는 내용이 문자열이므로 stringcar = 3; // 이렇게 car를 string이 아닌 다른 타입으로 재선언 하면 에러가 발생// 그냥 let car = 'bmw'라고 선언해도 car변수는 string으로 초기화 된다. 이것을 타입 추론이라고 한다.let age:number = 30;let isAdult:boolean = true;let a:number[] = [1, 2, 3];let a2:Array = [1,2,3]; // 위 아래의 배열은 똑같은 거다.let week1:string[] = ['mon', 'tue', 'wed'];let week2:Array = ['mon', 'tue', 'wed'];.. 공감수 0 댓글수 0 2024. 5. 3.
Typescript #1 타입스크립트를 쓰는 이유 우리가 사용하는 브라우저들은 타입스크립트를 이해하지 못한다.결국 자바스크립트로 변환해서 로드해야 사용할 수 있다.굉장히 번거로울 것 같은데 어떤 장점이 있길래 타입스크립트를 사용하는 걸까? function add(num1, num2) { console.log(num1 + num2);}add() // NaN, 당연히 원하는 결과가 나오지 않는다.undefined와 undefined를 더했으니 NaN이 나왔다.당연히 원하는 결과가 아니다. function add(num1, num2) { console.log(num1 + num2);}add(1) // NaN, 당연히 원하는 결과가 나오지 않는다.1과 undefined를 더해서 NaN이 나왔다. function add(num1, num2) { consol.. 공감수 0 댓글수 0 2024. 5. 3.
[프로그래머스] 1차 캐시 (javaScript) 문제 설명 캐시지도개발팀에서 근무하는 제이지는 지도에서 도시 이름을 검색하면 해당 도시와 관련된 맛집 게시물들을 데이터베이스에서 읽어 보여주는 서비스를 개발하고 있다.이 프로그램의 테스팅 업무를 담당하고 있는 어피치는 서비스를 오픈하기 전 각 로직에 대한 성능 측정을 수행하였는데, 제이지가 작성한 부분 중 데이터베이스에서 게시물을 가져오는 부분의 실행시간이 너무 오래 걸린다는 것을 알게 되었다.어피치는 제이지에게 해당 로직을 개선하라고 닦달하기 시작하였고, 제이지는 DB 캐시를 적용하여 성능 개선을 시도하고 있지만 캐시 크기를 얼마로 해야 효율적인지 몰라 난감한 상황이다.어피치에게 시달리는 제이지를 도와, DB 캐시를 적용할 때 캐시 크기에 따른 실행시간 측정 프로그램을 작성하시오.입력 형식캐시 크기(c.. 공감수 0 댓글수 0 2024. 5. 2.
[프로그래머스 Level 1] 대충 만든 자판 Javascript 문제 설명휴대폰의 자판은 컴퓨터 키보드 자판과는 다르게 하나의 키에 여러 개의 문자가 할당될 수 있습니다. 키 하나에 여러 문자가 할당된 경우, 동일한 키를 연속해서 빠르게 누르면 할당된 순서대로 문자가 바뀝니다.예를 들어, 1번 키에 "A", "B", "C" 순서대로 문자가 할당되어 있다면 1번 키를 한 번 누르면 "A", 두 번 누르면 "B", 세 번 누르면 "C"가 되는 식입니다.같은 규칙을 적용해 아무렇게나 만든 휴대폰 자판이 있습니다. 이 휴대폰 자판은 키의 개수가 1개부터 최대 100개까지 있을 수 있으며, 특정 키를 눌렀을 때 입력되는 문자들도 무작위로 배열되어 있습니다. 또, 같은 문자가 자판 전체에 여러 번 할당된 경우도 있고, 키 하나에 같은 문자가 여러 번 할당된 경우도 있습니다. 심.. 공감수 0 댓글수 0 2024. 4. 30.
[프로그래머스 level 2] 튜플 - 64065 Javascript 문제 설명 셀수있는 수량의 순서있는 열거 또는 어떤 순서를 따르는 요소들의 모음을 튜플(tuple)이라고 합니다. n개의 요소를 가진 튜플을 n-튜플(n-tuple)이라고 하며, 다음과 같이 표현할 수 있습니다. (a1, a2, a3, ..., an) 튜플은 다음과 같은 성질을 가지고 있습니다. 중복된 원소가 있을 수 있습니다. ex : (2, 3, 1, 2) 원소에 정해진 순서가 있으며, 원소의 순서가 다르면 서로 다른 튜플입니다. ex : (1, 2, 3) ≠ (1, 3, 2) 튜플의 원소 개수는 유한합니다. 원소의 개수가 n개이고, 중복되는 원소가 없는 튜플 (a1, a2, a3, ..., an)이 주어질 때(단, a1, a2, ..., an은 자연수), 이는 다음과 같이 집합 기호 '{', '}'.. 공감수 0 댓글수 0 2024. 4. 22.
[프로그래머스] 키패드 누르기 Javascript 문제 설명 스마트폰 전화 키패드의 각 칸에 다음과 같이 숫자들이 적혀 있습니다. 프로그래머스 - 키패드 누르기 이 전화 키패드에서 왼손과 오른손의 엄지손가락만을 이용해서 숫자만을 입력하려고 합니다. 맨 처음 왼손 엄지손가락은 *, 키패드에 오른손 엄지손가락은 # 키패드 위치에서 시작하며, 엄지손가락을 사용하는 규칙은 다음과 같습니다. 엄지손가락은 상하좌우 4가지 방향으로만 이동할 수 있으며 키패드 이동 한 칸은 거리로 1에 해당합니다. 왼쪽 열의 3개의 숫자 1, 4, 7을 입력할 때는 왼손 엄지손가락을 사용합니다. 오른쪽 열의 3개의 숫자 3, 6, 9를 입력할 때는 오른손 엄지손가락을 사용합니다. 가운데 열의 4개의 숫자 2, 5, 8, 0을 입력할 때는 두 엄지손가락의 현재 키패드의 위치에서 더 가.. 공감수 0 댓글수 0 2024. 4. 16.
[프로그래머스] 피로도 Javascript 문제 설명 XX게임에는 피로도 시스템(0 이상의 정수로 표현합니다)이 있으며, 일정 피로도를 사용해서 던전을 탐험할 수 있습니다. 이때, 각 던전마다 탐험을 시작하기 위해 필요한 "최소 필요 피로도"와 던전 탐험을 마쳤을 때 소모되는 "소모 피로도"가 있습니다. "최소 필요 피로도"는 해당 던전을 탐험하기 위해 가지고 있어야 하는 최소한의 피로도를 나타내며, "소모 피로도"는 던전을 탐험한 후 소모되는 피로도를 나타냅니다. 예를 들어 "최소 필요 피로도"가 80, "소모 피로도"가 20인 던전을 탐험하기 위해서는 유저의 현재 남은 피로도는 80 이상 이어야 하며, 던전을 탐험한 후에는 피로도 20이 소모됩니다. 이 게임에는 하루에 한 번씩 탐험할 수 있는 던전이 여러개 있는데, 한 유저가 오늘 이 던전들.. 공감수 0 댓글수 0 2024. 4. 11.
[프로그래머스] 둘만의 암호 Javascript 문제 설명 두 문자열 s와 skip, 그리고 자연수 index가 주어질 때, 다음 규칙에 따라 문자열을 만들려 합니다. 암호의 규칙은 다음과 같습니다. 문자열 s의 각 알파벳을 index만큼 뒤의 알파벳으로 바꿔줍니다. index만큼의 뒤의 알파벳이 z를 넘어갈 경우 다시 a로 돌아갑니다. skip에 있는 알파벳은 제외하고 건너뜁니다. 예를 들어 s = "aukks", skip = "wbqd", index = 5일 때, a에서 5만큼 뒤에 있는 알파벳은 f지만 [b, c, d, e, f]에서 'b'와 'd'는 skip에 포함되므로 세지 않습니다. 따라서 'b', 'd'를 제외하고 'a'에서 5만큼 뒤에 있는 알파벳은 [c, e, f, g, h] 순서에 의해 'h'가 됩니다. 나머지 "ukks" 또한 위 .. 공감수 0 댓글수 0 2024. 4. 11.
[프로그래머스 level 1] 숫자 짝꿍 - 131128 문제 설명 두 정수 X, Y의 임의의 자리에서 공통으로 나타나는 정수 k(0 ≤ k ≤ 9)들을 이용하여 만들 수 있는 가장 큰 정수를 두 수의 짝꿍이라 합니다(단, 공통으로 나타나는 정수 중 서로 짝지을 수 있는 숫자만 사용합니다). X, Y의 짝꿍이 존재하지 않으면, 짝꿍은 -1입니다. X, Y의 짝꿍이 0으로만 구성되어 있다면, 짝꿍은 0입니다. 예를 들어, X = 3403이고 Y = 13203이라면, X와 Y의 짝꿍은 X와 Y에서 공통으로 나타나는 3, 0, 3으로 만들 수 있는 가장 큰 정수인 330입니다. 다른 예시로 X = 5525이고 Y = 1255이면 X와 Y의 짝꿍은 X와 Y에서 공통으로 나타나는 2, 5, 5로 만들 수 있는 가장 큰 정수인 552입니다(X에는 5가 3개, Y에는 5가.. 공감수 0 댓글수 0 2024. 4. 4.
[Vue.js] 날씨 웹앱 만들기 기상청 API를 이용한 날씨 웹앱 만들기 단기예보 데이터를 이용해서 시간대별 날씨정보 구현하기 시간대별로 나누어 진게 아닌 카테고리별로 나누어져 있다. 모든 카테고리의 항목들이 필요하지는 않기 때문에 원하는 카테고리만 추출할 것이다 getters: { // arrayTemps가 원본데이터이다 filteredTempData(state) { // 기온 return state.arrayTemps.filter(temp => temp.category === 'TMP') }, filteredPopData(state) { // 강수량 return state.arrayTemps.filter(temp => temp.category === 'POP') }, filteredSkyData(state) { // 하늘상태 ret.. 공감수 0 댓글수 0 2024. 4. 4.
[프로그래머스 level 1] 실패율 - 42889 성능 요약 메모리: 10.4 MB, 시간: 0.02 ms 구분 코딩테스트 연습 > 2019 KAKAO BLIND RECRUITMENT 채점결과 정확성: 100.0 합계: 100.0 / 100.0 제출 일자 2024년 03월 26일 17:29:40 문제 설명 실패율 슈퍼 게임 개발자 오렐리는 큰 고민에 빠졌다. 그녀가 만든 프랜즈 오천성이 대성공을 거뒀지만, 요즘 신규 사용자의 수가 급감한 것이다. 원인은 신규 사용자와 기존 사용자 사이에 스테이지 차이가 너무 큰 것이 문제였다. 이 문제를 어떻게 할까 고민 한 그녀는 동적으로 게임 시간을 늘려서 난이도를 조절하기로 했다. 역시 슈퍼 개발자라 대부분의 로직은 쉽게 구현했지만, 실패율을 구하는 부분에서 위기에 빠지고 말았다. 오렐리를 위해 실패율을 구하는 코.. 공감수 0 댓글수 0 2024. 3. 30.
[프로그래머스] 최솟값 만들기 Javascript 문제 설명 길이가 같은 배열 A, B 두개가 있습니다. 각 배열은 자연수로 이루어져 있습니다. 배열 A, B에서 각각 한 개의 숫자를 뽑아 두 수를 곱합니다. 이러한 과정을 배열의 길이만큼 반복하며, 두 수를 곱한 값을 누적하여 더합니다. 이때 최종적으로 누적된 값이 최소가 되도록 만드는 것이 목표입니다. (단, 각 배열에서 k번째 숫자를 뽑았다면 다음에 k번째 숫자는 다시 뽑을 수 없습니다.) 예를 들어 A = [1, 4, 2] , B = [5, 4, 4] 라면 A에서 첫번째 숫자인 1, B에서 첫번째 숫자인 5를 뽑아 곱하여 더합니다. (누적된 값 : 0 + 5(1x5) = 5) A에서 두번째 숫자인 4, B에서 세번째 숫자인 4를 뽑아 곱하여 더합니다. (누적된 값 : 5 + 16(4x4) = 21.. 공감수 0 댓글수 1 2024. 3. 30.
VUEX의 속성과 개념 1. state Vue.js의 data속성과 유사한 기능을 가지고 있다. Vuex Store안에서 필요한 데이터를 만들 때 State라는 속성을 선언하고 그 아래에 데이터를 선언해주면 된다. 호출 방법은 script부분에서 호출할 때나 template부분에서 호출할 때 크게 다르지 않다. 왼쪽은 모듈로 따로 빼낸 경우와 그렇지 않은 경우 두 가지이다 모듈이라는 것은 store의 저장소 이름을 정해준다고 생각하면 된다. 모듈로 따로 분리시켰을 때는 호출할 때 모듈이름을 꼭 같이 붙여줘야 한다. 오른쪽은 Vuex Store 안에서 저장된 State를 직접 호출할 수도 있다 this키워드를 붙여도 되고 안해도 된다. 2. Getters Vue.js의 computed 속성과 굉장히 유사한 기능을 가지고 있다. .. 공감수 0 댓글수 0 2024. 3. 27.
자바스크립트 for-of 문법 let initialCurrentWeatherData = res.data.response.body.items; let T1H = initialCurrentWeatherData.item.find(temp => temp.category === 'T1H').obsrValue // 기온 데이터 let RN1 = initialCurrentWeatherData.item.find(temp => temp.category === 'RN1').obsrValue // let REH = initialCurrentWeatherData.item.find(temp => temp.category === 'REH').obsrValue // let PTY = initialCurrentWeatherData.item.find(temp =>.. 공감수 0 댓글수 0 2024. 3. 27.
[프로그래머스] 2018 KAKAO BLIND RECRUITMENT 1차 다트게임 문제 설명 다트 게임 카카오톡에 뜬 네 번째 별! 심심할 땐? 카카오톡 게임별~ 카카오톡 게임별의 하반기 신규 서비스로 다트 게임을 출시하기로 했다. 다트 게임은 다트판에 다트를 세 차례 던져 그 점수의 합계로 실력을 겨루는 게임으로, 모두가 간단히 즐길 수 있다. 갓 입사한 무지는 코딩 실력을 인정받아 게임의 핵심 부분인 점수 계산 로직을 맡게 되었다. 다트 게임의 점수 계산 로직은 아래와 같다. 다트 게임은 총 3번의 기회로 구성된다. 각 기회마다 얻을 수 있는 점수는 0점에서 10점까지이다. 점수와 함께 Single(S), Double(D), Triple(T) 영역이 존재하고 각 영역 당첨 시 점수에서 1제곱, 2제곱, 3제곱 (점수1 , 점수2 , 점수3 )으로 계산된다. 옵션으로 스타상(*) ,.. 공감수 0 댓글수 0 2024. 3. 18.
[프로그래머스] 기사단원의 무기 JavaScript 문제 설명 숫자나라 기사단의 각 기사에게는 1번부터 number까지 번호가 지정되어 있습니다. 기사들은 무기점에서 무기를 구매하려고 합니다. 각 기사는 자신의 기사 번호의 약수 개수에 해당하는 공격력을 가진 무기를 구매하려 합니다. 단, 이웃나라와의 협약에 의해 공격력의 제한수치를 정하고, 제한수치보다 큰 공격력을 가진 무기를 구매해야 하는 기사는 협약기관에서 정한 공격력을 가지는 무기를 구매해야 합니다. 예를 들어, 15번으로 지정된 기사단원은 15의 약수가 1, 3, 5, 15로 4개 이므로, 공격력이 4인 무기를 구매합니다. 만약, 이웃나라와의 협약으로 정해진 공격력의 제한수치가 3이고 제한수치를 초과한 기사가 사용할 무기의 공격력이 2라면, 15번으로 지정된 기사단원은 무기점에서 공격력이 2인 무.. 공감수 0 댓글수 0 2024. 3. 18.
Vue.js 기초(3) 핵심문법 - Data 인라인 핸들러 : 이벤트가 트리거될 때, 실행되는 인라인 javaScript 기능 인라인 핸들러는 말 그래도 어떤 기능을 동작하는 코드가 HTML Element 내에 직접 할당되는 것을 의미한다. 메서드 핸들러 : 컴포넌트 script 부분에 정의된 메서드(함수)를 이벤트 핸들러에 할당해주는 방식 computed : 함수처럼 코드를 작성하지만. return 시키는 데이터를 사용하기 때문에 데이터 취급을 하는 공통적으로 사용ㅇ되는 로직 혹은 복잡한 로직을 미리 처리하여 반복된 로직처리를 방지하는 계산된 형태의 데이터를 만드는 속성. 너무 많은 연산을 스크립트나 템플릿 HTML 안에서 처리하면 코드가 비대해지고 유지보수가 어렵기 때문에 사용한다. Watch : 어떤 데이터를 감시하고 있.. 공감수 0 댓글수 1 2024. 3. 14.
Vue.js 기초(2) 핵심문법 1 - UserInterface 선언적 렌더링 : 가장 기본적인 형태는 이중 중괄호 {{ }} 문법을 사용한 텍스트 보간법, 데이터바인딩을 템플릿 부분에서 사용할 때 가장 많이 사용된다. 클래스 바인딩 : 임의의 데이터 값이 true 혹은 false일 때 클래스가 추가 및 제거 되어 새로운 속성을 부여했다 제거했다 할 수 있게 끔 활용할 수 있도록 도와주는 기능이다. 스타일 바인딩 : v-bind 디렉티브를 활용하여 클래스 바인딩과 동일하게 그리고 객체로 바인딩한다 대신 스타일 바인딩에선 해당 프로퍼티 속성은 카멜케이스로 작성한다는 점을 유의 조건부 렌더링 : 특정 조건에 따라 다른 결과물을 렌더링 하는 것을 의미, v-if는 전환비용이 더 높고, v-show는 초기 렌더링 비용이 높다. 그래서.. 공감수 0 댓글수 0 2024. 3. 13.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.