조금씩 꾸준히 완성을 향해

Split() : 문자열을 부분 문자열로 나눌 때 사용하는 메소드 ※ 주의! 문자열을 리스트 형태로 반환 사용방법 str.split([sep]) 구분자(separator)를 괄호안에 넣어주면, 그 구분자를 기준으로 문자열을 분리해 리스트로 반환한다. - split() 이렇게 구분자를 입력하지 않으면, 모든 공백과 개행문자(\n)를 없애고 분리된 문자열을 담은 리스트를 반환한다. #공백제거 fruits = "banana peach apple mango" print(fruits.split()) #['banana', 'peach', 'apple', 'mango'] #개행문자, 공백 제거 fruits = "banana \n\n peach \n apple mango" print(fruits.split()) #['..

퇴사 직전 열심히 알아본 국민취업지원 제도 드디어 선발되어 1차 상담까지 받고 왔다. https://www.kua.go.kr/uapca010/selectEmssRqutIntro.do 국민취업지원제도 국민취업지원제도 정보시스템 회원은 2년을 주기로 재동의 절차를 거쳐 동의한 경우에만 회원자격을 유지할 수 있습니다. 개인정보 수집∙이용 동의일로부터 2년이 되는 까지 기간 내 재동의를 www.kua.go.kr 어떤 제도인지는 사이트를 가면 안내가 잘 돼있다. 나는 퇴사 후 소득이 없기 때문에 1유형에 지원이 가능했고, 향후 6개월간 월 50만원씩 지급될 예정이다. 준비하면서 찾기 힘들었던 정보들이 있어 내가 겪은 경험과 정보들을 간단히 정리해 보고자 한다. 누군가에게는 도움이 되기를. 퇴사 후 바로 신청 가능..

앱에 Todo-list를 추가해 보자. 먼저 이렇게 입력할 수 있는 input 태그를 생성해 준다. const toDoForm = document.getElementById("todo-form"); function handleToDoSubmit(event){ event.preventDefault(); } toDoForm.addEventListener("submit", handleToDoSubmit); submit이 되면 값을 저장하기 위해 handleToDoSubmit 함수를 호출한다. 함수 안에서는 가장 먼저, submit의 default 행위(새로고침)을 막아주기 위해 preventDefalut() 메소드를 불러준다. 그리고 나서는 이렇게 입력하고 enter를 눌렀을 때 값은 저장이 되고, input..

랜덤으로 바뀌는 명언과 배경이미지를 구현해 보자. 랜덤의 수를 가져오기 위해서는 Math라는 module을 살펴봐야 한다. Mathe는 JavaScript의 built-in object로 여러가지 수학적인 작업들을 함수로 제공한다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Math Math - JavaScript | MDN Math는 수학적인 상수와 함수를 위한 속성과 메서드를 가진 내장 객체입니다. 함수 객체가 아닙니다. developer.mozilla.org 그 중, Math.random() 은 0~1 사이의 임의의 수를 제공한다. 이렇게 소수점이 길게 붙은 숫자를 지정된 범위의 수로 바꾸기 위해서는 곱..

실시간으로 시간이 흐르는 시계를 만들기 위해서는 interval에 대한 개념을 알아야 한다. interval은 매번 일어나야 하는 어떤 행위의 간격을 말한다. setInterval() 함수를 이용하면 이를 구현할 수 있다. setInterval(function, 호출 간격) 첫번째 인자에는 실행할 함수를, 두번째 인자에는 호출되는 간격을 milliseconds 단위로 적어준다. 예시를 살펴보자. function sayHello(){ console.log("hello"); } setInterval(sayHello, 5000); //5초마다 콘솔에 "hello"를 출력 5초마다 sayHello 함수가 호출된다. 즉, 5초마다 콘솔에 "hello"가 출력된다. 이렇게 hello가 쌓이는 것을 볼 수 있다. s..

입력받은 username을 저장하고 지속적으로 보여주기 위해서 Web API인 Local Storage를 사용해 보자. Local Storage는 브라우저에 값을 저장하고 가져다 쓸 수 있게 해주는 유용한 API이다. https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage Window.localStorage - Web APIs | MDN The localStorage read-only property of the window interface allows you to access a Storage object for the Document's origin; the stored data is saved across browser sessi..

Username을 입력받고 저장해서 보여주기 위해서는 먼저, input의 값을 가져와야 한다. 그것을 위해 value라는 속성을 사용한다. const loginInput = document.querySelector("#login-form input"); const username = loginInput.value; input에 입력되는 값을 받아서 username이라는 변수에 저장 완료! 여기서 체크해 봐야 할 게 & 의 관계이다. input 태그는 반드시 form 태그 안에 있어 유효성 검사를 작동시킬 수 있다. LogIn 죽, form 태그 안에 있어야 이런 식으로 내재돼 있는 유용한 기능들(required, maxlength 등)을 사용할 수 있다. 그리고 form 태그 안에 있는 input은 자동..

CSS in JavaScript 자바스크립트에서 직접적으로 CSS 변경이 가능하다. style 이라는 method를 사용한다. const h1 = document.querySelector(".hello h1"); function handleTitleClick(){ const currnetColor = h1.style.color; let newColor; if(currnetColor === "blue"){ newColor = "tomato"; } else{ newColor = "blue"; } h1.style.color = newColor; } h1.addEventListener("click", handleTitleClick); 이렇게 h1 태그의 글자 색을 변경가능하다. 그러나 이것은 권장되는 방식은 아..

배열에 element를 단순 삽입하고 삭제 할 때 쓰이는 method인 push, pop, shift, unshift 에 대해 살펴보겠다. 1. push : 아이템을 배열의 끝에 삽입한다. // push: add an item to the end let fruits = ['apple', 'banana']; fruits.push('strawberry', 'peach'); console.log(fruits); // ['apple', 'banana', 'strawberry', 'peach'] 2. pop : 배열의 끝에서부터 아이템을 삭제한다. // pop: remove an item from the end let fruits = ['apple', 'banana', 'strawberry', 'peach'] f..