자바스크립트(JavaScript) :
객체(object) 기반의 스크립트 언어이다. HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현한다. 자바스크립트는 주로 웹 브라우저에서 사용되지만, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있다.
<script>
head 안에 넣어도 되고, body 안에 넣어도 되고 위치는 상관이 없다
</script>
변수 선언 :
자바스크립트에서는 변수를 선언 해도 되고 안해도 된다.
var 변수명;
let 변수명;
const 변수명;
자바스크립트에서 문자열은 " " 나 ' ' 둘다 가능하다. 즉, 자바에 있던 String 타입은 자바스크립트에 존재하지 않는다.
css 처럼 html 파일이 아니라 javascript 파일에 변수만 따로 작성 하여 body를 작성 해도 된다.
불러오는 링크는 <script type="text/javascript" src="경로"> 이렇게 사용 하면 된다.
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<script type="text/javascript" src="myjs.js">
//함수 밖에서 선언 했기 때문에 전역변수이다.
//전역변수는 어느 함수에서나 사용이 가능하다.
var a = 10;
let b = 20;
c = "hello";
d = 'abc'; //변수 선언 안하고 사용 가능
let e = 2.34;
var f = [ 1, 2, 3, 4, 5 ]; //자바 스크립트 배열은 대괄호로 표현한다
let g = {
"name" : "aaa",
"tel" : "1111"
}; //객체 생성 역시 가능하고 중괄호로 표현 한다.
//Jason : 대괄호와 중괄호만 기억하면 된다.
let h = true; //boolean 타입도 있음
let dan = 3;
</script>
</head>
<body>
<script type="text/javascript">
//document.write() : html 문서에 출력 메서드
document.write("<h1>a : " + a + "/ b : " + b + "</h1>");
document.write("<h1>" + c + "</h1>");
document.write("<h1>" + d + "</h1>");
document.write("<h1>" + e + "</h1>");
for (i = 0; i < f.length; i++) {//자바스크립트는 변수선언이 없기 떄문에
//for 문 돌릴 때 int i 이렇게 안해도 된다
document.write(f[i] + ",");
}
document.write("<h3> g name : " + g.name + " g tel : " + g.tel
+ " </h3>");
for (x = 1; x < 10; x++) {
document.write(dan + " * " + x + " = " + dan * x + "<br/>");
}
if (h == true) {
documet.write("true");
} else {
documet.write("false");
}
//자바스크립트에서 문자열은 "" 나 ' ' 둘다 가능하다.
//즉 자바에 있던 String 타입은 자바스크립트에 존재하지 않는다.
</script>
</body>
</html>
Javascript 파일
/**
*
*/
var a = 10;
let b = 20;
c = "hello";
d = 'abc';
let e = 2.34;
var f = [1,2,3,4,5]; //자바 스크립트 배열은 대괄호로 표현한다
let g = {"name" : "aaa", "tel":"1111"}; //객체 생성 역시 가능하고 중괄호로 표현 한다.
//Jason : 대괄호와 중괄호만 기억하면 된다.
let h = true; //boolean 타입도 있음
let dan =3;
'Front > javascript' 카테고리의 다른 글
[Javascript] 웹 페이지의 근육 심기 - value값 가져오기 (0) | 2023.03.25 |
---|---|
[Javascript] 웹 페이지의 근육 심기 - 구구단 테이블 만들기 (0) | 2023.03.24 |
[Javascript] 웹 페이지의 근육 심기 - 대화 상자(dialog box) (0) | 2023.03.24 |
[Javascript] 웹 페이지의 근육 심기 - 함수(function) (0) | 2023.03.24 |
[Javascript] 웹 페이지의 근육 심기 - var, let, const 차이 (1) | 2023.03.24 |