JavaScript36 Timeouts and Dates 이번에는 함수를 딱 한 번만 호출할건데, 일정 시간이 지난 뒤에 호출하도록 해보겠다. 이때 사용하는 함수는 setTimeout() 인데, 먼저 호출하려는 함수를 넣어주고 그 다음에는 얼마나 기다릴지를 ms 단위로 넣어주면 된다. 이제 화면을 실행하면 5초 뒤에 console창에 Hello가 출력되는 것을 확인할 수 있다. 이번에는 JS가 가지고 있는 Date object라는 tool을 사용해보자 Date는 new Date() 의 형식으로 쓸 수 있는데, 이는 오늘 날짜를 가져온다. new Date()를 변수로 지정하여 다양한 메소드를 사용할 수 있고, date와 관련된 많은 정보를 얻을 수 있다. 이제 여기서 getHours와 getMinutes, getSeconds를 매 초마다 출력하게 만들어보자. g.. 2022. 2. 25. Intervars 시계를 만들기 위해 파일을 만들어 각각 세분화했다. 그리고 시계를 넣기 위해 를 만들었다. 잘 동작하는 것을 확인했으면, 이제부터 intervals와 timeout에 대해 이야기해보자. Interval는 '매번' 일어나야 하는 무언가를 말한다. (ex : 2초 마다) 그렇기 때문에 2초마다 어떤 일이 일어나게 만들고 싶을 때 interval을 사용하게 된다. 이렇게 만든 함수를 2초마다 실행하고 싶을 때, 이런 기능을 제공하는 tool이 바로 setInterval() 이다. setInterval()은 두 개의 argument를 받는데, 첫 번째 argument는 내가 실행하고자 하는 function이고 두 번째 argument는 호출되는 function의 시간 간격을 몇 ms(milliseconds)로 .. 2022. 2. 25. Loading Username 이번 시간에 할 것은, local storage가 비어있으면 form을 보여주며 처음부터 진행하면 되고 local storage에 유저의 정보가 있다면 새로고침을 했을 때에도 form이 나타나지 않도록 하는 것이다. 그렇다면 먼저 local storage에 유저정보가 있는지 없는지를 확인하게 만들어야한다. 이렇게 코드를 추가로 작성한 다음, consol창에서 확인해보면, 우리가 원하는 값이 나오는 것을 확인할 수 있다. 그러니 이제 저 코드를 이용하여 아래와 같은 형식으로 조건문을 작성하면 된다. 그런데 보다시피 "username"이 반복되는 것을 알 수 있는데, 이는 오타를 유발할 수 있으므로 USERNAME_KEY 라는 변수로 지정한 다음 해당 내용을 전부 수정했다. 이제 다시 조건문 작성으로 돌아가.. 2022. 2. 24. Saving Username 우리는 원하는 값을 저장하고, 저장한 다음에는 그 값을 불러올 수 있으며 그 값을 지울수도 있다. 이를 위해서 우리는 key와 value만 사용하면 되고, 유저가 이름을 제출할 때 그걸 저장하도록 코드를 구현하면 된다. localStorage.setItem(key, value) 의 형식으로 입력하면 되는데, 이때 key는 저장될 값의 이름이고 value는 저장될 값을 의미한다. 이제 파일을 실행하여 이름을 입력한 뒤 login 버튼을 누르면 cookie에 key와 value가 저장되는 것을 확인할 수 있다. 그런데 아직도 새로고침을 하면 form이 사라지지 않고 유지되는데, 우리는 이것을 원하지 않기 때문에, 다음 주제에서는 local storage에 username이 존재하는지 확인한 다음, 존재하면 .. 2022. 2. 23. 이전 1 ··· 3 4 5 6 7 8 9 다음
