전체 글 14

백준 코딩테스트 공부 기록 2, 3-조건문과 반복문

2022. 04. 17 주의할 점 위주로 정리해보았다 * 모든 코드는 자바스크립트(node.js)로 작성합니다 2. 조건문 - 조건문의 종류에는 if/else, switch, try/catch/finally가 있다 이 중 가장 기본적인 조건문은 if/else 문으로, if (조건식) 문장 if (조건식) 문장 1 else if {문장 2} else {문장 3} 이렇게 작성한다 * 꼭 소괄호 / 중괄호 있어야 하는가? => 조건식을 묶은 소괄호(())는 꼭 입력해야 한다!! 문장이 한 줄 뿐이면 중괄호가 없어도 되지만, 여러 줄이면 중괄호를 사용해서 블록 문장으로 작성한다. +) 중괄호를 쓰지 않을 경우 잘못 해석되는 상황이 발생할 수 있으므로 문장이 한 줄이더라도 중괄호를 사용하여 작성하자. - swit..

백준 코딩테스트 공부 기록 - 1: 입출력과 사칙연산

2022.04.16 * 모든 테스트는 node.js(javascript)로 작성합니다! 1단계: 입출력과 사칙연산 - 템플릿 리터럴: 백틱 `` 문자열로 묶어주면, 안의 string이 그대로 출력된다. 플레이스 홀더(${})를 넣어 표현식을 추가할 수도 있는데, 만약 a=2인 경우 console.log(`${a}`); 를 할 시 2가 출력된다 * 단, 템플릿 리터럴 내 `, \, $를 출력하려면 반드시 앞에 백슬래시(\)를 붙여줘야 한다! - node.js에서 입력받기 다음은 백준 사이트에 예시로 나와있는 코드이다 var fs = require('fs'); var input = fs.readFileSync('/dev/stdin').toString().split(' '); var a = parseInt(i..

Audio reactive visuals using p5.js

p5.js로 음악에 반응하는 아트워크 만들기 Awwwards의 다음 강의를 수강한 후 정리한 내용입니다. https://www.awwwards.com/academy/course/audio-reactive-visuals-with-code Audio Reactive Visuals with Code Sound can dictate a new Visual Language. In this case the browser is the canvas and in this course you will learn how to use sound to draw onto that canvas, with... www.awwwards.com 1. p5.js 시작하기 1) p5.js 다운로드 우선 p5.js와 p5.sound를 다운로..

웹페이지 로딩 화면 만들기

Main question 웹페이지가 외부 리소스(이미지, 비디오 등)를 읽어들이기 전까지는 로딩 화면을, 모든 리소스를 읽어들인 후 준비가 되었을 때 페이지를 보이게 하려면? Question 1. 모든 리소스를 읽었는지 여부를 어떻게 알 수 있을까? 우선 웹 브라우저의 자바스크립트 실행 순서에 대해 알아보자. 웹 브라우저의 자바스크립트 실행 순서 렌더링 엔진은 다음의 순서로 HTML 코드를 실행한다 ✅ Window 객체 생성 (웹 페이지와 탭마다 생성) ✅ Window 객체의 프로퍼티로 Document 객체 생성, DOM 트리 구축 시작 - document.readyState = "loading" ✅ HTML 문서 순서에 따라 분석하여 DOM 트리 구축 - 중간에 script 요소가 있으면 HTML 문서..