clear_uncertainty

본 포스팅은 생활코딩님의 정규표현식 토픽을 공부하고 정리한 내용입니다. 본 포스팅의 패턴(Page) 및 설명은 http://zvon.org/comp/r/tut-Regexp.html#Pages~Contents 를 참고했습니다. 정규표현식 패턴들 Page 5 기호 .은 모든 특성(문자, 공백, 기호 등)을 검출합니다. Source : Regular expressions are powerful!!! Case1 Regular Expression . First match Regular expressions are powerful!!! All match Regular expressions are powerful!!! 따라서 .은 처음에 맨 앞 텍스트 R을 검출하고 그 후, 모든 문자를 검출합니다. Case2 Re..

본 포스팅은 생활코딩님의 정규표현식 토픽을 공부하고 정리한 내용입니다. 본 포스팅의 패턴(Page) 및 설명은 http://zvon.org/comp/r/tut-Regexp.html#Pages~Contents 를 참고했습니다. 정규표현식 패턴들 Page 3 특정한 기호는 특정한 의미를 갖습니다. 소스가 who is who일때, who로 시작하는 소스를 검출할때 ^who를 사용합니다. who$는 who로 끝나는 텍스트를 검출합니다. Source : who is who Case1 Regular Expression ^who First match who is who All match who is who Case2 Regular Expression who$ First match who is who All matc..

본 포스팅은 생활코딩님의 정규표현식 토픽을 공부하고 정리한 내용입니다. 본 포스팅의 패턴(Page) 및 설명은 http://zvon.org/comp/r/tut-Regexp.html#Pages~Contents 를 참고했습니다. 정규표현식 정규표현식은 문자열을 처리하는 방법 중 하나로 특정한 조건의 문자를 '검색'하거나 '치환'하는 과정을 매우 간편하게 처리 할 수 있는 수단입니다. 정규표현식 패턴들 Page 1 더보기 정규표현식은 대소문자를 구분합니다. 따라서 Case1의 정규표현식은 특정한 문자를 찾아내지만, Case2는 그렇지 못합니다. Source : Hello world! Case1 Regular Expression Hello First match Hello, world! All match Hel..

2021-08-14 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. 저번 포스팅에 이어 todonelist를 만들어봅시다. function paintToDo(task){ const genericLi = buildGenericLi(task); const completeBtn = document.createElement("button"); completeBtn.innerText = "V"; completeBtn.addEventListener("click", handleCompleteClick); genericLi.append(completeBtn); toDoList.append(genericLi); } function paintFin(task){ co..

2021-08-14 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. 이번 포스팅에선 todolist를 진화시켜봅시다. 저번 todolist에선, user가 todolist를 입력하고, 삭제를 할 수 있으며 새로고침을 해도 값이 저장되는 것을 구현했습니다. 이번 포스팅에는 todonelist를 만들어 user가 todolist를 완료했을 때, todonelist로 이동을 하고, todonelist을 완료하지 못했을 때, todolist로 이동하는 것을 구현해봅시다. 위는 HTML과 CSS, 그리고 To-Done-List를 모두 완성한 브라우저의 모습입니다. (이 포스팅에서는 HTML과 CSS를 다루지않습니다.) 먼저 코드를 확인해봅시다. const ..

2021-08-13 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. 이번 포스팅에선 요일 기능을 구현해봅시다. 저번 포스팅에서 자바스크립트를 통해 현재 날짜와 시간을 알아낼 수 있었습니다. const clock = document.querySelector("h2#clock"); const todayDate = document.querySelector("#date") function getClock() { const date = new Date(); const hours = String(date.getHours()).padStart(2,"0"); const minutes =String(date.getMinutes()).padStart(2,"0"); ..

2021-08-01 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. 이번 포스팅에선 날씨기능을 구현해봅시다. 먼저, weather.js 라는 자바스크립트 파일을 생성한 뒤 HTML에 import 해줍시다. 위치를 알아야 , 그 위치의 날씨를 알 수 있기때문에 가장 먼저 구현할 것은, 사용자의 위치를 파악할 것입니다. 위치를 파악하기 위해 navigator.geolocation.getCurrentPosition(onGeoOk, onGeoEroor); 을 알아봅시다. Navigator Navigator 인터페이스는 사용자 에이전트의 상태와 신원 정보를 나타냅내며, 스크립트로 해당 정보를 질의할 때와 애플리케이션을 특정 활동에 등록할 때 사용합니다. N..

2021-07-29 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. 이번 포스팅에선 투두리스트(todo-list)를 만들어봅시다. 먼저, todo.js 라는 자바스크립트 파일을 생성한 뒤 HTML에 import 해줍시다. todolist를 만들기위해 html에 form과 ul을 생성해줍니다. li는 만들지않습니다. 이제 JS로 li를 만들어 html에 추가할 수 있습니다. JS로 html에서 만든 Form과 Input과 List를 갖고옵시다. const toDoForm = document.getElementById("todo-form"); const toDoInput = document.querySelector("#todo-form input");..

2021-07-28 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. 이번 포스팅에선 웹 브라우저에서 랜덤으로 배겨화면이 변화하도록 해봅시다. 먼저, background.js 라는 자바스크립트 파일을 생성한 뒤 HTML에 import 해줍시다. img라는 폴더를 만든 후, 배경화면으로 지정하고 싶은 이미지를 저장해줍시다. 그리고 랜덤한 이미지를 선택하는 방법은 저번 포스팅에서 했던, 방식과 동일합니다. const image = ["0.jpg","1.jpg","2.jpg","3.jpg","4.jpg","5.jpg"]; const chosnImage = image[Math.floor(Math.random() * image.length)]; console..

2021-07-27 자바스크립트 학습일지입니다. 해당 내용은 노마드코더님의 강의를 들으며 추가적인 학습을 정리한 내용입니다. [Math.method()] 이번 포스팅에선 웹 브라우저에서 랜덤으로 명언이 나타나도록 구현해봅시다. 먼저, quotes.js 라는 자바스크립트 파일을 생성한 뒤 html에 import 해줍시다. quotes.js에 quotes라는 array를 만들어, 약 10개의 명언과, 저자를 입력해줍시다. 만약, 콘솔에 명언을 표시한다면 console.log(quotes[number])을 구현하면됩니다. number에 들어가는 수는 0부터 9까지이고, 우리는 0부터 9까지의 숫자를 랜덤으로 뽑아야합니다. Math.random() 랜덤한 수를 얻기위해선 Math.random()을 이용해야합니다..