사용자와 상호작용할 수 있는 대화상자
-alert
-prompt
-confirm
🎀alert 알려줌 (일방적으로 창을 띄움)
ex. 비밀번호가 틀렸습니다. 이름을 입력해주세요.
prompt 입력 받음
ex.
const name = prompt("이름을 입력하세요.");
alert("환영합니다, " + name + "님");
-> 이름을 입력받을 수 있는 박스를 띄우고, Mike 입력하면
환영합니다 Mike님
이라는 alert가 뜬다.
🎀const name = prompt("이름을 입력하세요.");
alert(안녕하세요, ${name}님, 환영합니다.);
-> 이름을 입력받을 수 있는 박스를 띄우고, Tony 입력하면
안녕하세요 Tony님, 환영합니다.
이라는 alert가 뜬다.
const name = prompt("이름을 입력하세요.");
console.log(name)
-> 입력창에 이름 안누르고 취소를 누르면
null 반환
const name = prompt("예약일을 입력해주세요.", "2020-10-");
console.log(name)
-> 입력창에
2020-10
가 디폴트로 뜬다. 뭔가 안내하거나 힌트를 주는 용도
🎀confirm 확인 받음
const isAdult = confirm("당신은 성인 입니까?");
console.log(isAdult)
-> 당신은 성인 입니까?
라는 창이 뜸. alert와 달리 확인 버튼과 함께 취소 버튼도 있음.
확인 누르면 true 반환
취소 누르면 false 반환
단점 : 1. 창이 떠 있을 때 스크립트 일시정지. 동작에 제한 받음.
ex. 유튜브에서 알림 버튼을 눌렀는데 텍스트가 안 뜨고 alert 창이 뜬다면 일일히 확인 버튼을 눌러서 꺼줘야 함.
2. 스타일링 불가능.
위치와 모양을 정할 수 없고, 브라우저마다 모양이 조금씩 다름.
참고 : //를 코드 앞에 붙이면 주석이 되어 무시됨. 개발할 때 참고해야 할 점이 있을 때 유용하게 사용됨. 다른 사람이 해당 코드를 이해하는 데에 도움이 된다.
