💫 JavaScript
- 웹 브라우저에서 사용하는
프로그래밍 언어 - 표준 공식 명칭 : ECMAScript
- 현재 자바스크립트 버전 : ES6(ECMAScript 6)
💫 JavaScript 적용 방법
- 이벤트 핸들러(Event Handler) 방식 (= 이벤트)
- 태그에 직접 기재
- 모든(대부분) 태그 > onXXX 속성 제공
<input type="button" value="버튼" onclick="alert('자바스크립트');">- 임베디드 방식
<head> 태그 안에 <script> 태그를 삽입
<head>
<script> alert('자바스크립트'); </script>
</head>- 외부 방식
- *.js 확장자가 붙은 js 파일을 만들어 HTML 파일에 불러온다.
<script src="경로"></script>
<script src="ex01.js"></script>💭 재사용률에 따라서 선택한다.
💫 JavaScript 구문의 실행 순서
- 동기(문장 순서대로 실행) : 위 -> 아래, 연산자 우선순위
- 브라우저가 HTML과 JavaScript를 동시에 실행한다.
- HTML 조작 시 HTML과 JavaScript 구문의 순서가 중요하다.
<!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>
<style>
/* <style>은 일반적으로 문서내 <head> 자식으로 1회 적용 */
</style>
<script>
// <script>는 문서 내에 여기저기 여러번 적용하는 모습을 자주 볼 수 있다.
// -> 코드의 실행 순서를 제어하기 위해서
// -> 동기순으로 적용
</script>
</head>💫 JavaScript 디버깅
alert(값);
- 디버그 전용 함수 X
- 구문 간단해서 많이 사용한다.
- 웹 브라우저에 경고창을 띄운다. > 블럭이 걸림(break)
console.log(값);
- 디버그 전용 함수 O
- FM
- 적극 추천
- 개발자 콘솔창에 출력 + 사용자에게 출력 X
추가 자료
🔗 자바스크립트 표준 스타일
