📌 자바스크립트에서 문자열과 prompt 활용하기
자바스크립트에서 문자열은 매우 중요한 자료형 중 하나입니다. 또한, **window.prompt()**를 사용하면 사용자로부터 입력을 받을 수 있어 매우 유용합니다. 이 글에서는 문자열의 개념과 prompt() 메서드에 대해 설명하겠습니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" contect="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>문자열 & window.prompt()</title>
</head>
<body>
<script>
let apple;
apple = '사과'
console.log(apple)
console.log("사과")
let banna = '바나나'
console.log(apple + " & " + banna)
// const order = "아메리카노 1반 & 라뗴 2잔 주시오!!"
// alert(order)
let answer = prompt("당신이 좋아하는 과일은?")
alert(answer)
let userResponse = prompt("이름을 입력하세요:"); // 이상인 입력하면
console.log("사용자 이름: " + userResponse);
//출력 사용자이름 : 이상인
</script>
</body>
</html>🚦 문자열 (String)
자바스크립트에서 문자열은 ‘기호의 순차 수열’을 뜻합니다. 즉, 문자, 숫자, 특수문자 등을 조합하여 만든 기호의 집합입니다. 문자열은 따옴표로 시작하고, 따옴표로 끝나며 정의됩니다. 작은 따옴표(')와 큰 따옴표(") 모두 사용할 수 있습니다.
문자열의 예시:
let greeting = "Hello, World!";
let name = 'John';- 주의: 문자열을 정의할 때는 시작하는 따옴표와 끝나는 따옴표가 반드시 같아야 합니다.
💻 문자열 연산
자바스크립트에서 문자열은 연산이 가능합니다. 문자열을 더하기(+) 연산을 수행하면, 산술적인 덧셈이 아니라 문자열 이어붙이기가 이루어집니다.
문자열 이어붙이기 예시:
let firstName = "John";
let lastName = "Doe";
let fullName = firstName + " " + lastName; // "John Doe"위 코드에서 "John"과 "Doe"가 " "(공백)으로 이어붙여져 "John Doe"라는 문자열을 생성합니다.
🧑💻 window.prompt() 메서드
window.prompt()는 브라우저에서 사용자에게 입력을 받을 수 있는 다이얼로그 박스를 열어주는 메서드입니다. 이 메서드는 사용자에게 문자열을 입력받고, 그 값을 반환합니다.
prompt() 사용 예시:
let userResponse = prompt("이름을 입력하세요:");
console.log("사용자 이름: " + userResponse);위 코드에서 prompt()는 "이름을 입력하세요:"라는 메시지를 담은 다이얼로그 박스를 표시합니다. 사용자가 입력한 값을 userResponse 변수에 저장하고, 이를 콘솔에 출력합니다.
📝 prompt() 메서드의 특징
- 문자열 반환: prompt()는 사용자가 입력한 문자열을 반환합니다. 이 문자열은 변수에 저장하거나 다른 작업에 활용할 수 있습니다.
- 주의 사항: prompt() 메서드는 사용자 입력을 다이얼로그 박스에서 받을 때 실행 중인 코드가 실제로 바뀌는 것이 아니라 마치 바뀌는 것처럼 실행되는 방식으로 동작합니다.
✅ 마무리
자바스크립트에서 문자열은 매우 유용한 자료형으로, 문자, 숫자, 특수문자를 조합하여 다양한 데이터를 처리할 수 있습니다. prompt() 메서드는 사용자 입력을 받을 때 매우 유용하며, 이를 통해 동적인 웹 페이지를 만들 수 있습니다.
문자열과 prompt()를 활용하여 더욱 인터랙티브한 웹 개발을 시도해 보세요!
'JavaScript' 카테고리의 다른 글
| Chapter 1-8. undefined 외 (0) | 2025.03.31 |
|---|---|
| Chapter 1-7. 템플릿 리터럴 (0) | 2025.03.31 |
| Chapter 1-5. 변수와 상수 (0) | 2025.03.31 |
| Chapter 1-4. 콘솔출력과 자료형 (0) | 2025.03.31 |
| Chapter 1-3. 동작 원리 출력해보기 (자바스크립트) (0) | 2025.03.31 |