유튜브 코딩앙마 채널의 '자바스크립트 기초 강좌' 를 공부하며 정리한 내용입니다.
사용자와 상호작용 할 수 있는 대화상자 세가지입니다. alert
은 알림창을 띄우고, prompt
는 입력창을 띄우고, confirm
은 확인창(취소까지 있는)을 띄웁니다.
const name = prompt("이름을 입력하세요");
alert("환영합니다."+name+"님");
prompt
와 alert
을 활용한 예시입니다. 베틱을 활용하면 아래와 같이 수정 가능합니다.
const name = prompt("이름을 입력하세요");
alert(`환영합니다. ${name}님`);
prompt
는 두개의 인수를 받을 수 있습니다.
const name = prompt("예약일을 입력해주세요", "2020-10-");
첫번째 값은 안내 메시지, 두번째 값은 입력창에 디폴트 값으로 표시됩니다. 입력값에 대한 힌트를 줄 수 있습니다.
confirm
창은 alert
과 다르게 취소 버튼도 생깁니다. 이때 확인을 누르면 true
취소를 누르면 false
값을 가져옵니다. 사용자의 행동을 한 번 더 확인할 때 사용합니다.
const isAdult = confirm("당신은 성인입니까?");
const.log(isAdult);
단점으로 확인 창이 뜨면 화면이 일시 정지되어 진행이 안되고, 스타일링이 안 되어 브라우저마다 모습이 다릅니다. 그래서 별도 css
로 작업을 해줍니다.