Small Grey Outline Pointer 'TIL' 태그의 글 목록 (6 Page)
본문 바로가기

TIL196

[노마드코더] 바닐라JS로 그림앱 만들기 #01 캔버스 기본 동작 const canvas = document.querySelector('canvas'); //컨버스에 그림 그릴 때 사용 context //컨버스의 좌표 시스템을 이용해서 그림을 그린다 const ctx = canvas.getContext('2d'); canvas.width = 800; canvas.height = 800; //좌표의 0,0 부터 시작한다 //한 경로로 연결되어 있기 때문에 컬러 변경 시 모든 사각형이 변경 됨 => 새 경로 만들어줘야 함 /* ctx.rect(50, 50, 100, 200); ctx.rect(150, 150, 100, 100); // ctx.stroke(); ctx.fill(); ctx.beginPath(); //새 경로 만들기 ctx.rect(350, .. 2023. 7. 1.
[프로그래머스] -js 짝수의 합 정수 n이 주어질 때, n이하의 짝수를 모두 더한 값을 return 하도록 solution 함수를 작성해주세요. 제한사항 0 v % 2 === 0) //배열에서 짝수에 해당하는 값만 뽑기 .reduce((acc, cur) => acc + cur, 0); //짝수들 누적 합산 } return Array(n).fill().map((_, index) => index + 1).filter(v => v % 2 === 0).reduce((a , c) => a + c, 0); 02. function solution(n) { var half = Math.floor(n/2); return half*(half+1); } 접근을 다양하게 하는 사람들이 많구나 난 너무 단순하게 생각하는듯 공부 열심히 해야지 2023. 6. 27.
[프로그래머스] - js 각도기 각에서 0도 초과 90도 미만은 예각, 90도는 직각, 90도 초과 180도 미만은 둔각 180도는 평각으로 분류합니다. 각 angle이 매개변수로 주어질 때 예각일 때 1, 직각일 때 2, 둔각일 때 3, 평각일 때 4를 return하도록 solution 함수를 완성해주세요. 예각 : 0 word.length > 6); console.log(result); // Expected output: Array ["exuberant", "destruction", "present"] 작은 값 걸러내기 function isBigEnough(value) { return value >= 10; } var filtered = [12, 5, 8, 130, 44].filter(isBigEnough); // filtered .. 2023. 6. 27.
[프로그래머스] js 자연수 뒤집어 배열로 만들기 자연수 n을 뒤집어 각 자리 숫자를 원소로 가지는 배열 형태로 리턴해주세요. 예를들어 n이 12345이면 [5,4,3,2,1]을 리턴합니다.제한 조건 n은 10,000,000,000이하인 자연수입니다. 입출력 예 nreturn 12345 [5,4,3,2,1] 나의풀이 function solution(n) { //12345 var answer = []; var numStr = (n.toString()).split(''); var arr = numStr.map(ele => Number(ele)); answer = arr.reverse(); return answer; } 1. 숫자 n을 문자열로 바꿔준 후, split 구분자로 자른다 2. 문자열을 다시 숫자로 바꿔주고 배열을 뒤집는다 다른사람의 풀이 func.. 2023. 6. 25.
[프로그래머스] js - 문자열 내 p와 y의 개수 대문자와 소문자가 섞여있는 문자열 s가 주어집니다. s에 'p'의 개수와 'y'의 개수를 비교해 같으면 True, 다르면 False를 return 하는 solution를 완성하세요. 'p', 'y' 모두 하나도 없는 경우는 항상 True를 리턴합니다. 단, 개수를 비교할 때 대문자와 소문자는 구별하지 않습니다. 예를 들어 s가 "pPoooyY"면 true를 return하고 "Pyy"라면 false를 return합니다. 제한사항 문자열 s의 길이 : 50 이하의 자연수 문자열 s는 알파벳으로만 이루어져 있습니다. 입출력 예 sanswer "pPoooyY" true "Pyy" false 입출력 예 설명 입출력 예 #1 'p'의 개수 2개, 'y'의 개수 2개로 같으므로 true를 return 합니다. 입출력.. 2023. 5. 14.
[프로그래머스] js - x만큼 간격이 있는 n개의 숫자 함수 solution은 정수 x와 자연수 n을 입력 받아, x부터 시작해 x씩 증가하는 숫자를 n개 지니는 리스트를 리턴해야 합니다. 다음 제한 조건을 보고, 조건을 만족하는 함수, solution을 완성해주세요. 제한 조건 x는 -10000000 이상, 10000000 이하인 정수입니다. n은 1000 이하인 자연수입니다. 입출력 예 xnanswer 2 5 [2,4,6,8,10] 4 3 [4,8,12] -4 2 [-4, -8] 나의풀이 function solution(x, n) { var answer = []; for(var i=1; i (i + 1) * v) } Array.fill() Array.fill(value, start, end) fill() 함수는 배열의 첫 인덱스부터 끝 인덱스-1 까지 같.. 2023. 5. 14.
[레츠기릿] 숫자야구 게임 만들기 (반복문 사용하기) 숫자야구 룰 https://thebook.io/080270/0265/ Let's Get IT 자바스크립트 프로그래밍: 5장 반복문 사용하기_숫자야구 게임 더북(TheBook): (주)도서출판 길벗에서 제공하는 IT 도서 열람 서비스입니다. thebook.io 무작위 숫자를 뽑는 과정 Math.random()을 사용하여 랜덤으로 4개의 숫자를 추출한다 • Math.floor 내림 • Math.ceil 올림 • Math.round 반올림 Math.random()// 0 2023. 5. 14.
[레츠기릿JS] 중첩if문 제거하기 / 계산기 만들기 if문 중첩 제거하기 1. if 문 다음에 나오는 공통된 절차를 각 분기점 내부에 넣는다. 2. 분기점에서 짧은 절차부터 실행하게 if 문을 작성한다. 3. 짧은 절차가 끝나면 return(함수 내부의 경우)이나 break(for 문 내부의 경우)로 중단한다. 4. else를 제거한다(이때 중첩 하나가 제거된다). 5. 다음 중첩된 분기점이 나오면 1~4의 과정을 반복한다. const onClickNumber = (event) => { if(operator){ //연산자 비어 있지 않을 때 if(!numTwo){ $result.value=''; //numTwo에 값 저장하기 전 화면 비우기 } numTwo += event.target.textContent; }else { //연산자 비어 있을 때 numO.. 2023. 5. 1.
[레츠기릿JS] 계산기 만들기 / event 객체로 중복 제거하기 const onClickNumber = (number) => (event) => { if(operator){ //연산자 비어 있지 않을 때 numTwo += number; }else { //연산자 비어 있을 때 numOne += number; }$result.value += number; } event 객체는 event.target.value 화면상에서 입력 받은 값을 가져오기 위해 사용하는데 여기서 event는 어디서 나온 것인가 => 브라우저가 넣어주는 것이다 const a = () => {} document.querySelector('#plus').addEventListener('click', a); 함수 자리에 a라는 함수를 넣었기 때문에 문제 없다 const a = (event) => { con.. 2023. 4. 23.
[레츠기릿JS] 계산기 만들기 / 고차함수로 중복 제거하기 함수가 함수를 반환하는 경우 const func = () => { return () => { console.log('hello'); }; }; func함수를 호출하면 함수를 반환한다 반환된 함수는 다른 변수에 저장될 수 있고 변수에 저장된 함수를 다시 호출할 수 있다 const innerFunc = func(); innerFunc(); // hello func() 부분을 반환값(retunr문) 으로 대체해보면 이해하기 쉽다 const innerFunc = () => { console.log('hello'); }; innerFunc(); // hello 반환하는 값을 바꾸고 싶을 때는 매개변수를 사용한다 바꾸고 싶은 자리를 매개변수로 만들어 주면 된다 const func = (msg) => { return.. 2023. 4. 23.