1. JavaScript 란?
HTML 문서 내의 객체를 핸들링 할 수 있다.
HTML 문서 내의 css 요소를 핸들링 할 수 있다.
서버와 통신 하여 얻은 respons를 동적으로 표현 해 준다.(Ajax)
자바스크립트 객체 형태의 데이터를 서버와 주고 받을 수 있다.(Json)
자바스크립트를 이용한 라이브러리 들이 계속적으로 나타나고 있다.(node.js, jQuery, Electron...)
2. JavaScript 적용 방법
1. html 문서 내에 따로 설정 (웹이 시작하자마자 필요한 요소가 아니면 body 하위에서 실행 할 것)
2. js 파일 외부에서 불러옴
<html>
<head>
<meta charset="UTF-8">
<title>JAVA SCRIPT</title>
<link rel="icon" href="../img/chrome.png">
<style>
</style>
</head>
<body>
</body>
<script>
</script>
</html>
3. 변수
자바와 거의 동일하나 변수 타입이 없다는 것이 특징이다. (var = {정수, 문자열, 배열 등})
<html>
<head>
<meta charset="UTF-8">
<title>JAVA SCRIPT</title>
<link rel="icon" href="../img/chrome.png">
<style>
</style>
</head>
<body>
</body>
<script>
// 변수는 var 이라는 키워드가 붙는다.
// 변수 안에는 뭐든지 다 들어간다. (그래서 데이터 타입이 필요없다.)
var intVal = 123;
var floatVal = 3.14;
var strVal = '문자열'; // 문자열에 싱글쿼터를 써도 된다.
var boolVal = false;
// 콘솔 출력
console.log('int : ' + intVal); // 무조건 문자열로 출력
console.log('float : ', floatVal); // 데이터 타입을 살려서 출력
console.log('string : ' + strVal);
console.log('boolean : ', boolVal);
</script>
</html>
4. 함수 (= 메서드)
자바스크립트에서의 함수는 자바의 메서드와 동일하다.
<html>
<head>
<meta charset="UTF-8">
<title>JAVA SCRIPT</title>
<link rel="icon" href="../img/chrome.png">
<style>
</style>
</head>
<body>
</body>
<script>
// 이름 : 토스트기, 반환 : O, 매개변수 : O
function 토스트기(빵){ // 매개변수 타입이 없다.
return '구워진' + 빵;
}
// 이름 : 번호표기계, 반환 : O, 매개변수 : X
function 번호표기계(){
return '번호표';
}
// 이름 : 저금통, 반환 : X, 매개변수 : O
function 저금통(동전){
console.log(동전 + '이 저금되었습니다.')
}
// 이름 : 호출벨, 반환 : X, 매개변수 : X
function 호출벨(){
console.log('호출되었습니다.')
}
</script>
</html>'JavaScript' 카테고리의 다른 글
| 02. 배열(Array)과 객체(Object) (0) | 2024.03.07 |
|---|