[12/13] DAY9 자바스크립트 공부

9일 차 진도

 

 

 

 

Date 객체

특정 날짜의 시간과 현재 날짜와 시간을 알 수 있다.

 

 

 

let nowDate = new Date();

console.log(nowDate); // 2023-12-13T00:50:37.026Z

 

오늘의 연도 월, 일 시간이 출력된다.

 

 

 

 

Date 객체의 메서드

getMonth(월), getDate(일), getDay(요일)

 

let nowDate = new Date();
let month = nowDate.getMonth();
let date = nowDate.getDate();
let day = nowDate.getDay();

console.log(`${month}월 ${date}일 ${day}요일`) // 11월 13일 3요일

 

getMonth 메서드는  월을 0~11 사이의 숫자로 표현하기에, +1을 해줘야 한다.

 

getDay 메서드는 요일을 일요일부터 토요일까지 0~6 사이로 표현하기에, 우리가 사용할 요일의 정보가 담긴 배열을 활용해야 한다.

 

 

 

let nowDate = new Date();
let month = nowDate.getMonth()+1;
let date = nowDate.getDate();
let day = nowDate.getDay();

const week = [ '일','월','화','수','목','금','토'];

console.log(`${month}월 ${date}일 ${week[day]}요일`) // 12월 13일 수요일

 

요일이 잘 출력되는 것을 확인할 수 있다.

 

 

 

let nowDate = new Date();
let month = nowDate.getMonth()+1;
let date = nowDate.getDate();
let day = nowDate.getDay();
let hours = nowDate.getHours();
let minutes = nowDate.getMinutes();

const week = [ '일','월','화','수','목','금','토'];

console.log(`${month}월 ${date}일 ${week[day]}요일`) // 12월 13일 수요일

console.log(`${hours}시 ${minutes}분`) // 9시 59분

 

시간도 출력할 수 있다.

 

 

 

 

 

로컬스토리지

웹 브라우저에 데이터를 저장할 수 있는 기능

 

로컬 스토리지라는 객체를 사용해 데이터를 저장할 수 있고, 이를 위해서 setItem라는 메서드를 사용해야 한다.

const IdElement = document.getElementById("id");
const passwordElement = document.getElementById("password");
const loginBtn = document.getElementById("loginBtn");

loginBtn.addEventListener("click",()=>{
  localStorage.setItem('id',IdElement.value);
  localStorage.setItem('pw',passwordElement.value);
  alert("로그인 성공!")
})

setItem에는 두 개의 매개변수를 전달하는데 첫 번째 매개변수는 키값인 저장될 값의 이름,  두 번째 매개변수는 실제로 저장될 value값이다.

 

 

로컬 스토리지에 객체를 넣을 때는 JSON.stringify()를 사용해서 JSON 문자열로 변환 후 저장해야 한다.

 

또한 로컬 스토리지 객체에서 getItem을 통해 가져올 때는 JSON.parse()를 통해 객체형태로 변환해줘야 한다. 

 

 

 

 

 

[9일 차 미션]

9일 차 미션

 

 

9일 차 제출