전체 페이지뷰

2018년 10월 18일 목요일

alert, prompt, confirm

이 강좌는 환경과 무관한 자바스크립트의 코어만을 다룹니다만, 데모 환경을 브라우저로 하고 있기 때문에 최소한의 브라우저 UI요소인 alert, prompt, confirm을 알아보고 가겠습니다.

alert

문법: alert(message)
메세지를 보여주고 유저가 '확인'을 누를때까지 스크립트 실행을 멈춥니다.
예) 
alert("Hello");
cs

Modal window라고 하는 작은 창에 메세지를 띄우는데, modal이란 유저가 버튼을 누를 때 까지 유저가 상호작용을 할 수 없는 것을 말합니다.





prompt


prompt 함수는 두개의 인수를 갖습니다.

문법: result = prompt(title[, default]);

이 함수는 메세지와 더불어 방문자를 위한 입력 필드, 확인/취소 버튼이 있는 modal window를 띄웁니다.

위 문법에서 title은 방문자에게 보여줄 메세지이고, default는 초기값인데 선택적으로 사용할 수 있습니다.

방문자는 값을 입력하고 확인 버튼을 누르거나 취소 혹은 Esc 키를 눌러 창을 취소할 수 있습니다.

값이 입력되었으면 입력된 값을 반환하고, 입력이 되지 않았으면 null을 리턴합니다.

예)
let age = prompt('How old are you?'100);
 
alert(`You are ${age} years old!`); // You are 100 years old!
cs







*참고
IE에서는 두번째 인자를 사용하지 않으면 입력창에 "undefined"를 표시합니다. 보기에 좋지 않으므로 초기값을 설정하지 않으려면 두번째 옵션으로 빈 문자열을 넣어주면 좋습니다.


confirm


문법: result = confirm(question)

확인/취소 버튼이 달린 창을 보여주는 함수입니다. 확인을 누르면 true, 아니면 false를 반환합니다.

예)
let isBoss = confirm("Are you the boss?");
 
alert( isBoss ); // true if OK is pressed
cs




댓글 없음:

댓글 쓰기