본문 바로가기

Javascript28

JavaScript <문자열 배열 다루기> 문자열 배열 다루기 배열의 메소드 sort()를 마지막에 활용할 생각이 바로 떠오르지 않아서 반복문 안에서 변수를 한 개 더 만들어서 배열의 순서를 바꾸는 방식을 해봤는데 반복문이 배열 지정된 갯수를 넘어가서 undefined 오류가 발생해버렸다. --> sort()메소드 사용할 때는 알파벳일 때는 큰 고려 안해도 되지만 숫자일 때는 유니코드 순으로 정렬되므로 함수를 지정해줘야 원하는 결과 얻을 수 있음! 매번 출력할 때마다 for문을 반복하니 내용을 추가하려면 추가된 내용이 반복문 만큼 반복되서 복잡해진다. --> 차라리 출력하는 함수를 한 개 만들어 두면 편할 듯 예를 들면 아래와 같이 미리 생각했으면 더 쉽게 작성가능! function printArray(array) { for(let i=0; i 2023. 3. 5.
JavaScript 난수 생성 후 크기 비교 후에 출력하기 난수 10개 생성 위의 큰 수 찾는 부분이 첫번째 keypoint라고 생각하는데 반복문 안에서 큰 수를 배열에서 찾는다면 big으로 지정해주고 그렇지 않다면 밀어내기 방식으로 작은 수가 배열 앞쪽에 오도록 순서를 바꿔줘야 한다. 그렇지 않으면 반복문 안에서 인접한 숫자끼리만 비교하다가 큰 수를 찾는 게 아니라 마지막 2개에서 출력값이 결정되기 때문이다. 두번째 주의할 부분은 배열 정렬 메소드 sort()에는 기본적으로 매개변수를 주지 않으면 오름차순으로 정렬하는데 자릿수가 한자리이면 상관없지만 자릿수가 2개 이상일 때는 상황이 달라지는데 간단히 예를 들자면 숫자 정렬에서는 2가 10보다 앞에 오지만 숫자는 문자열로 변환되기 때문에 "10"은 유니 코드 순서에서 "2"앞에 온다고 한다. 그러므로 sort(.. 2023. 2. 28.
자바스크립트 <제일 큰 자리 수와 제일 낮은 자리의 수 비교> 큰 자리수와 낮은 자리수 같은지 비교 핵심이라고 생각하는 부분 ↓ 과정을 설명(ex. 201이 입력값으로 들어온 것을 예로들자면 처음에 우선 변수 least에는 1이 저장되고 while문 안에서는 most값으로 역시 1이 저장된다. 그 후 몫으로 나오는 20(Math.floor으로 소수점 생략)이 다시 number에 저장. 다시 while문이 실행되서 number 값은 0이 아니기 때문에 위의 과정이 반복된다. most는 0을 할당받고 number에는 다시 2가 저장. while문은 다시 반복되므로 most에는 2가 저장. number는 몫이 0이되므로 반복문 종료! prompt는 문자열을 반환하므로 parstInt를 이용해 정수값으로 받아오는 게 중요하다. isInfinite를 사용해서 이게 Num값인.. 2023. 2. 27.
자바스크립트 <암호를대라> 암호를 입력하라! getElementsByTagName은 아래와 같이 HTMLCollection으로 값을 돌려준다. --> 그래서 한 개의 태그를 지정할 때는 id를 지정하는 것 같다. 태그를 내에 미리 작성하면 body 태그를 읽기전에 script안의 코드가 실행되므로 찾고자 하는 id값을 지정해서 null값만 가져오게 된다. onload를 활용하거나 아예 body태그 아래에서 를 활용해야 한다.(반복되는 실수 주의!) 2023. 2. 26.
자바스크립트 별문자(*)출력하기 예전 C언어 수강할 때 버벅였을 때가 생각났다. 한 번에 풀기는 어려웠던 걸로 기억하는데 약간의 소스만 알고있으면 고민하다가 응용해서 다른 방식으로 풀이도 가능하다. document.write()로 live preview로 옆에서 보면서 풀어서 그런가 디버깅 과정 없어도 더 빠르게 풀 수 있었던 것 같다. 문제를 간단히 분해해서 푸는 것도 중요하는게 예를 들면 별문자 7개 출력하기 전에 별문자 3개를 먼저 출력한다고 생각하고 i 값을 3으로 풀고나서 결과값만 변경하면 더 편하다. 반복문 매개변수 i와 j를 묶어주는 star 변수를 지정해서 해결하는 게 KeyPoint라고 생각. 역방향 문제(별문자를 1개부터 7개까지가 아니라 7개부터 1개까지 출력되도록 응용) 2023. 2. 26.
JavaScript 샤갈의 눈 내리는 마을 만들기 기본으로 아래와 같이 주어진 것을 바탕으로 JS를 이용해서 눈내리는 효과를 구현해보자! 배경 이미지는 위의 이미지 참고 --------------------------------------------------------------------------------------------------------------------- --------- 정리 1) snow[i].setAttribute("class","snow")으로 div에 class값으로 snow부여. 2) x[i] = Math.floor(Math.random()*innerWidth)으로 화면 너비를 고려해서 x값 구해두기. 3) 문제의 원인(1) --> left 속성은 앞에 style 붙이고 px은 ""넣어야 4)>함수 안에서 만든 배열을 .. 2023. 2. 25.