<script>
document.write("환영합니다") => ctrl + alt + o => 결과화면에 환영합니다 표시됨
</script>
document 는 문석 객체이며 문서 출력 메서드인 write()을 이용하여 데이터를 문서에 출력할때 사용한다.
1. 자바스크립트는 대. 소문자를 구분하여 작성한다.
ex) 날짜 객체 생성 : new Date
2. 문자형 데이터를 작성할 때는 큰 따옴표와 작은따옴표 의 겹침 오류를 주의
ex) 오류: document.write("책에 "자바스크립트는 대소문자를 구분해야 합니다"라고 나와 있다.");
잘된 예:document.write('책에 "자바스크립트는 대소문자를 구분해야 합니다"라고 나와 있다.');
잘된 예:document.write("책에\"자바스크립트는 대소문자를 구분해야 합니다\"라고 나와 있다.");
- 문자형
문자형 (string) 데이터는 문자나 숫자를 큰따옴표(" ")또는 작은따옴표(' ')로 감싸고 있다.
또한 문자형 데이터에 html 태그를 포함하여 출력하면 태그로 인식한다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
<script >
let s ="java"
let num = 100;
document.write("<h1>String</h1>");
</script>
</html>
-숫자형 데이터는 단어 의미 그대로 숫자를 의미한다.
만약 "100"과 같이 큰따옴표가 숫자를 감싸고 있다면 숫자가 아닌 문자형 데이터이다.
이 경우에는 Number("100")를 이용하면 문자형 데이터를 숫자형 데이터로 바꿀수 있다.
-논리형
논리형 (boolean)데이터는 true, false 가 있다.
Boolean 메서드는 숫자 0과 null(비어있는 값으로 지정된것),undefined,빈 문자(" ")를 제외한 모든 데이터에 대해 true
-type of
지정한 데이터 또는 변수에 저장된 자료형을 알고 싶을 때 사용한다.
--- 대입 연산자
대입 연산자(=)는 연산된 데이터를 변수에 저장할때 사용
복합 대입 연산자(+=,-=,*=,/=,%=)는 산술 연산자와 대입 연산자가 복합적으로 적용된것
<tr>
tr은 'table row'의 약자로, 테이블의 행을 표현한다.
<td>
td는 'table data'의 약자이다.
사실 위에서는 td를 간단히 '열'이라고 표현하였지만, 정확하게는 td태그는 테이블에 들어가는 데이터, 셀을 의미한다.
즉, 하나의 테이블 안에 <tr> 태그로 행을 표현하고, 그 안에 <td> 태그를 이용하여 데이터를 표현 하는 것.
"?"는 JavaScript에서 조건 연산자(ternary operator)의 기호입니다.
조건 연산자는 세 개의 피연산자를 취합니다. 첫 번째 피연산자는 평가할 조건이며, 두 번째 피연산자는 조건이 참일 때 반환할 값이며, 세 번째 피연산자는 조건이 거짓일 때 반환할 값입니다.
위의 코드에서는 a가 b보다 큰 경우 "javascript"를 반환하고, 그렇지 않은 경우 "hello"를 반환합니다. 따라서 결과는 "javascript" 또는 "hello" 중 하나가 됩니다.
--- 적정 체중을 구하는 테스트기 만들기
적정 체중 = (본인 신장 - 100) x 0.9
철수의 적정 체중
신장 : 180
체중 : 74
적정 체중 : (180-100) x 0.9 = 72kg
결과 : 적정 체중은 72kg이며 현재 적정 체중에서 2kg 초과한 것을 알수있다.
----- 적정 체중 구하는 코드 작성하기
prompt() 기본 사용법 ==> prompt("질문","기본응답");
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
<script >
let name = prompt("당신의 이름은?","");
let height = prompt("당신의 신장은?","");
let weight = prompt("당신의 몸무게는?","");
let normal_w = (height - 100) * 0.9;
let result = weight>= normal_w - 5 && weight<=normal_w + 5; // 오차 범위 5
result = result ? "적정 체중입니다." : "적정 체중이 아닙니다.";
document.write(name+"님은" +result);
</script>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
<script >
//진영이의 하루 지출 내역은 교통비 3000원, 식비6000원, 음료비 3000원입니다.
// 삼항 조건 연산자를 사용하는데
// 하루 적정 지출 비용인 1만 원을 초과했을 경우에는 ooo원 초과라고 출력하고
// 아닐 경우에는 "돈 관리 잘 했어요!"라고 출력
let price1 = 3000;
let price2 = 6000;
let price3 = 3000;
let result = price1+price2+price3>10000? "ooo원 초과" : "돈 관리 잘했어요!";
document.write(result);
</script>
</html>
'javascript' 카테고리의 다른 글
| 웹프로젝트 로그인창완료 (0) | 2023.04.13 |
|---|---|
| do it 자바스크립트+제이쿼리 입문 2일차 (0) | 2023.04.13 |
| map 함수의 정의,코테 연습 (0) | 2023.04.07 |
| 배열메소드 (0) | 2023.04.06 |
| 야구 미니게임 (0) | 2023.04.06 |