JavaScript

    [알고리즘]연속 부분 수열 1 - 투포인터 알고리즘

    문제 N개의 수로 이루어진 수열이 주어집니다. 이 수열에서 연속부분수열의 합이 특정숫자 M이 되는 경우가 몇 번 있는지 구하는 프로그램을 작성하세요. 만약 N=8, M=6이고 수열이 다음과 같다면 1 2 1 3 1 1 1 2 합이 6이 되는 연속부분수열은 {2, 1, 3}, {1, 3, 1, 1}, {3, 1, 1, 1}로 총 3가지입니다. 입력예제 N=8, M=6 1 2 1 3 1 1 1 2 강사님의 풀이 function solution(m, arr){ let answer = 0; let sum = 0; let left = 0; //left, right 두개의 포인터로 시작, right는 for문 안에서 증감된다. for(let right = 0; right=m){ //sum이 m보다 크거나 같으면, ..

    [알고리즘] 공통원소 구하기 - 투포인터 알고리즘

    문제 A, B 두 개의 집합이 주어지면 두 집합의 공통 원소를 추출하여 오름차순으로 출력하는 프로그램을 작성하세요. (두 집합의 공통원소를 오름차순 정렬하여 출력합니다.) 입력예제 5 1 3 9 5 2 5 3 2 5 7 8 풀이 function solution2(arr1, arr2) { let answer = []; let n = arr1.length; let m = arr2.length; let p1 = 0; let p2 = 0; arr1.sort((a, b) => a - b); arr2.sort((a, b) => a - b); while (p1 < n && p2 < n) { if (arr1[p1] === arr2[p2]) { answer.push(arr1[p1++]); p2++; } else if (..

    [JS] 전위 연산자, 후위 연산자

    증가/감소(++/--) 연산자는 피연산자를 기준으로 위치에 따라 그 의미가 약간 달라진다. 전위 연산자 증가/감소(++/--) 연산자가 피연산자의 앞에 있으면 이를 전위 연산자 라고 한다. 이 경우 피 연산자의 값을 먼저 증가/감소 시킨 뒤 다른 연산을 수행한다. let x = 5, result; //선증가 후할당 result = ++x; //result == 6, x == 6; //선감소 후할당 result = --x; //result == 5, x == 5; 위 예시에서는 x앞의 전위 증가 연산자(++)가 x = x+1로 증가시켰고, 이 결과값을 result에 할당시켜 두 변수 모두 6의 값을 갖게 되었다. (감소도 마찬가지) 후위 연산자 전위 연산자와 반대로, 먼저 다른 연산을 수행한 후 피연산자의..

    [TIL]2022-0105 (WED)

    [TIL]2022-0105 (WED)

    JavaScript Type conversion & implicit type coercion : 명시적 형 변환 & 묵시적 강제 형 변환 let n = 10 + "10"; // n = "1010" let n = "40" - 1 // n = 39 let n = "40" - "30" // n = 10 + : 피연산자 중 하나 이상이 문자열이면, 문자열로 연결한다. - : 문자열을 숫자열로 변환하여 계산한다. (*,/ 도 포함) implicit type coercion 으로 인해 버그가 발생하는 경우도 있으니, 내용을 알고있으면 해결에 도움이 될 수 있다. Truthy & Falsy values (Boolean type) : 잠재적 true 혹은 false values Falsy values : 0, ' ',..

    [JS]2021-1115 자바스크립트 .createElement() & .appendChild - HTML 요소 추가하기

    document.creatElement() document 객체의 메소드로, HTML 요소를 생성할 수 있다. const bgImage = document.createElement("img"); //img태그 생성 부모노드.appendChild() 특정 요소에 자식 요소를 추가할 수 있다. document.body.appendChild(bgImage); //body 내부에 bgImage를 추가 배열 내의 랜덤 이미지 화면에 출력하기 const images = [ "0.jpg", "1.jpg", "2.png" ]; const chosenImage = images[Math.floor(Math.random() * images.length)]; const bgImage = document.createElemen..

    [JS]2021-1114 자바스크립트 Math - Random number 랜덤 숫자 생성 /반올림, 올림, 버림

    nomadcoders VanilaJS #6.0~2 강의를 정리한 내용입니다. Math.random() 랜덤한 숫자를 만들 수 있는 함수. 0이상 1 미만의 난수(부동소수점)을 랜덤하게 만든다. See the Pen Untitled by hyejj19 (@hyejj19) on CodePen. Math.floor() 소수점 이하를 버림하는 메소드. 참고 : .ceil() 올림 / .round() 반올림. 소수점 이하를 버림으로써, 정수를 만들 수 있다. 난수의 범위를 생각해 Math.random * n을 하면, 원하는 범위의 정수 난수값을 얻을 수 있다. See the Pen random2 by hyejj19 (@hyejj19) on CodePen. 이를 배열에 적용해, 새로고침 시 배열 내의 랜덤한 내용이..

    [JS]2021-1114 padStart() - 문자열 시작 채우기(문자열을 채워 원하는 길이로 만들기)/ String() - 숫자를 문자열로 바꾸기

    [JS]2021-1114 padStart() - 문자열 시작 채우기(문자열을 채워 원하는 길이로 만들기)/ String() - 숫자를 문자열로 바꾸기

    nomadcoders VanilaJS #5.0~3 강의를 정리한 내용입니다. padStart() "1".padStart(4,"0"); // "0001"을 출력 String에서만 사용 가능한 함수로, 특정 문자열을 원하는 길이만큼, 원하는 문자열로 채울 수 있다. 사용 방법은 padStart(원하는 길이, 채우고자 하는 문자열) 자매품으로 padEnd()도 있다. String(number) number를 string으로 변환할 수 있다. string(556); //"556" 을 출력 Date 객체의 현재시간들은 number이기 때문에 padStart() 적용을 위해서 string 으로 변환해야한다. 그리고 .padStart를 적용해 자릿수가 2 미만일 경우 앞에 "0"을 붙여 출력하도록 한다. const ..

    [JS]2021-1114 Date - 자바스크립트로 현재 시간 불러오기/ setInterval(),setTimeout() - 타이머 함수

    [JS]2021-1114 Date - 자바스크립트로 현재 시간 불러오기/ setInterval(),setTimeout() - 타이머 함수

    nomadcoders VanilaJS #5.0~3 강의를 정리한 내용입니다. new Date() new Date()를 호출하면, Date 객체를 불러온다. 이 함수를 인수 없이 호출하면 현재 날짜, 시간이 저장된 Date 객체를 반환한다. function getTime() { const date = new Date(); //new Date()는 Date 객체를 불러옴, 이 함수를 인수 없이 호출하면 현재 날짜 및 시간이 저장된 date 객체가 반환된다. clock.innerText =`${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`; //Date 객체의 여러 메소드를 활용해, 현재 시간 값을 얻어올 수 있음. 이를 innerText로 화면에 ..

    [JS]2021-1107 localStorage - If 문으로 정보 저장 여부 확인

    [JS]2021-1107 localStorage - If 문으로 정보 저장 여부 확인

    nomadcoders VanilaJS #4.3~7 강의를 정리한 내용입니다. if 문으로 localStorage 정보 저장 여부 확인하기 브라우저에 정보 저장 여부로 표시되는 화면의 내용이 달라지게끔 만들고자 한다. 로그인 정보가 있다면, 로그인 화면 없이 바로 인삿말이 뜨도록, if 문을 활용해 만들 수 있다. const savedUsername = localStorage.getItem(USERNAME_KEY); //로컬 스토리지에 담긴 username을 변수로 선언한다. if(savedUsername === null) { //만약 로컬 스토리지에 담긴 username이 null값, 즉 없다면 loginForm.classList.remove(HIDDEN_CLASSNAME); //form의 hidden상..

    [JS]2021-1107 localStorage - CSS,HTML 조작

    [JS]2021-1107 localStorage - CSS,HTML 조작

    nomadcoders VanilaJS #4.3~7 강의를 정리한 내용입니다. JavaScript로 CSS 조작하기 - classList 활용 Log in 사용자가 이름을 입력하고 버튼을 클릭해 submit을 하는 동시에, 로그인 폼이 사라지고 인사말이 뜨도록 해야 한다. form과 h1 모두 hidden이라는 클래스를 주고, 아래와 같이 css를 작성해 주었다. .hidden { display: none; } classList를 사용해 html의 class를 추가, 삭제, 변경할 수 있다. 반복해서 사용되는 string의 경우, 철자 오류 방지를 위해 변수로 선언해주는 것이 바람직하다. const HIDDEN_CLASSNAME ="hidden"; function onLoginSubmit(event) { ..