본문 바로가기

javascript26

[javascript] 프로그래머스 - 부족한 금액 계산하기 문제 새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이용료가 100이었다면 2번째에는 200, 3번째에는 300으로 요금이 인상됩니다. 놀이기구를 count번 타게 되면 현재 자신이 가지고 있는 금액에서 얼마가 모자라는지를 return 하도록 solution 함수를 완성하세요. 단, 금액이 부족하지 않으면 0을 return 하세요. function solution(price, money, count) { let answer = 0; let total = 0 for(let i = 1; i < count+1; i++){ total += price*i; } ans.. 2021. 8. 8.
[Canvas 공부 2일차] 이미지 업로드 이미지 불러오기 코드 void ctx.drawImage(image, dx, dy); void ctx.drawImage(image, dx, dy, dWidth, dHeight); void ctx.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight); // sx, sy는 소스의 x,y 이미지 불러오기 예제 기본적으로 이미지를 불러오는 방법은 다음과 같다. const canvas = document.getElementById("board_canvas"); const context = canvas.getContext("2d"); const imageElem = new Image(); imageElem.src = "src/img/medb.jpg";.. 2020. 12. 7.
[javascript]자바스크립트 리스트 reverse / 기존 array에 영향을 미치지 않게 하려면? 자바스크립트의 reverse() 기능을 알아봅시다. const arrayOne = ['a', 'b', 'c'] const arrayTwo = arrayOne.reverse() console.log(arrayTwo) //['c', 'b', 'a'] 다른 언어와 마찬가지로, 자바스크립트도 아주 쉽게 reverse() 를 통해 리스트를 역으로 만드는 게 가능합니다. 그런데, 여기서 주의할 점이 있습니다. 요 Array.prototype.reverse() 는 기존 리스트에게 영향을 줍니다. 즉, arrayTwo를 만들어도 arrayOne도 리버스 되어 있다는 소리입니다. 기존 리스트에 영향을 주지 않고 reverse하는 몇가지 방법 slice 사용하기 const arrayOne = ['a', 'b', 'c'];.. 2020. 7. 28.
[JS] MVC 패턴과 MVVM 패턴 MVC 패턴 (이 패턴은 자바스크립트 고유의 것이 아닙니다.) MVC는 Model, View, Controller의 약자입니다. 응용 프로그램을 세가지 구성 요소로 나눈 것입니다. 이렇게 나누는 이유는 영역간 코드의 결합도를 최소화 시키기 위해서 입니다. 위 이미지 처럼 Model, View, Controller가 상호작용을 하며 사용자가 어플리케이션과 상호작용 할 수 있도록 만들어 줍니다. Model 모델은 데이터베이스에 있는 데이터를 가져와 다른 객체에 전달해 줍니다. 또는 외부 객체로부터 데이터를 받아서 DB에 넣어줍니다. View 모델에서 받아온 데이터로 화면을 관리합니다. 사용자가 입력한 데이터를 처리하고, 유저가 생성한 입력 이벤트 데이터를 다른 객체에 전달하는 역할을 합니다. (html, c.. 2020. 4. 26.
[CSS/JS] 테이블 행열(가로세로) 위치 바꾸기 API에서 데이터를 어떻게 주느냐에 따라 테이블 요소의 행과 열을 바꿔야 할 순간이 올지도 모른다. 테이블 행/열을 바꾸는 방법은 다음과 같다. col col col col row Dolor Dolor Dolor row Dolor Dolor Dolor row Dolor Dolor Dolor table{ display:flex; display: -webkit-box; display: -ms-flexbox; overflow-x: auto; overflow-y: hidden; } tbody {display:flex} th,td{display:block} thead와 tbody를 포기한다면 css를 요렇게만 사용하면 된다. col col col col row Dolor Dolor Dolor row Dolor D.. 2020. 4. 19.
[javascript] 자바스크립트 es6 map es6에서 우리는 key-value쌍을 저장하는 Maps라는 데이터 구조체를 사용할 수 있게 되었다. 우리는 어떤 객체든 key 또는 value로 저장할 수 있다. Maps를 사용하기 이전에는 키 값은 string만 사용 가능하지만 value는 무엇이든 들어갈 수 있었다. Maps를 사용하는 것은 간단하다. Maps는 아래 코드와 같이 정의할 수 있다. const superHero = new Map(); superHero.set('Superman', 'Clark Kent'); superHero.set('Batman', 'Bruce Wayne'); 하지만 set을 사용하여 키와 벨류 값을 넣는 대신에 nested array를 사용하여 각 배열의 첫번째 값을 key에 두번째 값을 value에 매칭시킬 수 있.. 2020. 2. 2.
[javascript] 프로그래머스 완주하지 못한 선수 코딩테스트 연습 - 완주하지 못한 선수 | 프로그래머스 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 partic programmers.co.kr 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 par.. 2020. 2. 1.
[javascript] 바나나 문제 / 0.1+0.2 === 0.3이 틀린 이유 자바스크립트 :: 바나나 자바스크립트를 헷갈리게 하는 몇가지 문제들을 소개해본다. console.log('b' + 'a' ++ 'a' + 'a').toLowerCase(); //banana 첫 글자 b 와 a 는 문자열이므로 쉽게 ba 로 변환된다. 그러나 그 다음 ++ 'a' 에서 첫번째 + 기호는 이전 문자열 더하기와 같은 기능을 수행하지만 뒤에 있는 +는 문자열을 숫자로 바꾸는 unary operator로의 역할을 한다. 그러나 뒤에 따라 붙는 a는 숫자로 변환할 수 없으므로 NaN 이 반환되게 되는데 이것이 toLowerCase() 에 의해 소문자로 변해 최종적으로 banana 가 출력된다. 배열 더하기 console.log([1, 2, 3]+[4, 5, 6]); //1, 2, 34, 5, 6 이.. 2020. 1. 29.
[javascript] merge sort (병합정렬 자바스크립트 알고리즘) 📊 병합 정렬하나의 리스트를 두 개의 균등한 크기로 분할하고 분할된 부분 리스트를 정렬한 다음, 두 개의 정렬된 부분 리스트를 합하여 전체 정렬을 하는 방법 병합 정렬은 다음 세가지 과정을 통해 이루어진다. 분할(Divide): 배열을 같은 크기의 2개의 배열로 분할한다.정복(Conquer): 분할된 배열을 정렬.결합(Combine): 정렬된 부분 배열을 다시 합침 const mergeSort = function(array) { if (array.length < 2) return array; let pivot = Math.floor(array.length / 2); //쪼개기 let left = array.slice(0, pivot); let right = array.slice(pivot, array.len.. 2020. 1. 24.

티스토리툴바