-
JS 기초 1- 데이터 입력받고 출력하기, 변수선언(prompt, alert, console.log / let, var, const)📗TIL/JavaScript 2022. 6. 7. 20:53
스크립트 적용방법
<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> <script> //아래 있어도 html보다 js가 우선 실행된다. </script> <script src="js/script.js" type="text/javascript"></script> <!-- 스크립트 링크 위아래 아무데나 넣어도 되는데 문제 없으면 아래에 넣기 추천 --> </body> </html>- 어디든 넣을 수 있으나, head태그 안에 넣거나 </body>바로 위에 넣어주는것이 일반적이다.
- link태그와 다르게 script태그는 href가 아닌 src로 파일 경로를 지정해준다.
- link태그와 다르게 닫는태그</script>가 있어야한다.
데이터 입력받고 출력하기
prompt()를 이용하여 데이터를 받고,
let myId = prompt("아이디를 입력해주세요"); alert(myId); //알림창 출력 document.write(myId); //화면에 출력 console.log(myId); //콘솔창에 출력- 알림창에 출력 : alert() 사용
- 콘솔창에 출력 : console.log() 사용
- 웹브라우저 화면에 출력 : 위해서는 document.write()사용한다.
document.write("<p>스크립트로 작성한 글입니다.</p>");- 따옴표 안에 html태그를 사용할 수 있다.
let yrName = prompt("이름을 알려주세요"); let yrAge = prompt("나이를 알려주세요"); document.write( "<h1>이름은 " + yrName + "이고 나이는 " + yrAge + "살입니다.</h1>" ); document.write( `<h1>이름은 ${yrName}이고 나이는 ${yrAge}살입니다.</h1>` );- 큰따옴표(" ")나 작은따옴표(' ')는 구분없이 사용한다.
- 백틱(` `)을 사용하면 매번 + ' ' 할 필요 없이 편하게 출력할 수 있다.
- 대신 백틱 안에 변수를 넣을때는 ${변수명}의 형태로 사용한다.
변수 선언 종류
let radious = 10; const pi = 3.14; //상수여서 const로 변수 선언할 수 있다. let circle = radious * radious * pi; let around = 2 * pi * radious;var : 전역 변수나 함수 지역 변수로 선언, 블록레벨이 적용되지 않는다.
let : 변수가 선언된 구문 내에서만 유효한 변수를 선언한다.
const : 상수의 성질을 띈다. 값을 재할당할 수 없으며 다시 선언할 수도 없다.
'📗TIL > JavaScript' 카테고리의 다른 글
JS기초 4(2) - Date()생성자 활용하기 /.split(',') (0) 2022.09.28 JS기초 4 - 문자와 배열, Number(), if문 기본 (1) 2022.09.23 JS기초 3 - 이스케이프 시퀀스, 나머지 구하기, 증감/논리/할당 연산자 (0) 2022.09.22 JS기초 2 - 데이터 타입 문자열, 숫자열, 배열, 객체(typeof, length) (0) 2022.09.18 자바스크립트 기초 / 용어 모음 (0) 2022.03.03