자바스크립트 (Javascript)
자바스크립트는 웹 브라우저에서 동적인 기능을 구현할 수 있는 프로그래밍 언어입니다. 초기에는 웹 페이지에서 간단한 스크립트를 작성하는 데 사용됐으나 현재는 웹 애플리케이션의 복잡한 기능을 구현하는 언어로 자리 잡았습니다.
자바스크립트를 공부하는 이유
웹 개발자가 배워야하는 3가지 언어가 있습니다.
- 웹 페이지의 내용을 정의하는 HTML
- 웹 페이지의 레이아웃을 지정하는 CSS
- 웹 페이지의 동작을 프로그래밍하는 Javascript
자바스크립트의 특징
- 클라이언트 사이드 스크립트 : 웹 브라우저에서 실행되며 사용자의 인터랙션에 응답하고 페이지를 동적으로 업데이트할 수 있습니다.
- 서버 사이드 개발 : Node.js와 같은 런타임 환경 덕분에 자바스크립트는 서버 사이드에서도 사용됩니다. 즉 서버 측 애플리케이션도 자바스크립트로 작성할 수 있습니다.
- 동적 타이핑 : 자바스크립트는 변수 타입을 명시하지 않아도 런타임 때 타입이 결정됩니다. 코드 작성의 유연성을 제공하지만 타입 관련 오류가 발생할 수 있습니다.
- 비동기 프로그래밍 : 자바스크립트는 비동지 작업을 처리하기 위한 기능들을 제공합니다. setTime, fetch, Promises, async/await 등의 기능을 통해 비동기 작업을 쉽게 다룰 수 있습니다.
- 객체 기반 : ES6부터 클래스 문법이 도입되어 자바스크립트는 객체지향 프로그래밍을 지원합니다.
자바스크립트 사용법
자바스크립트를 사용하기 위해서는 <script></scrtip> 태그가 필요합니다.
<script>
console.log("hello world");
</script>
자바스크립트는 HTML 문서에 얼마든지 <script> 태그를 넣을 수 있습니다.
<head> 태그 안의 자바스크립트
<!DOCTYPE html>
<html>
<head>
<title>head javascript</title>
<script>
function myFunc() {
console.log("hello world");
}
</script>
</head>
<body>
<h1>Main Page</h1>
<button type="button" onclick="myFunc()">버튼</button>
</body>
</html>자바스크립트 코드를 <head> 태그에 배치해서 사용할 수 있습니다. 위에 코드는 버튼을 클릭하면 콘솔에서 hello world가 출력됩니다.
자바스크립트를 <body> 태그 안에 작성할 수 있습니다.
<!DOCTYPE html>
<html>
<head>
<title>head javascript</title>
</head>
<body>
<h1>Main Page</h1>
<button type="button" onclick="myFunc()">버튼</button>
<script>
function myFunc() {
console.log("hello world");
}
</script>
</body>
</html>자바스크립트를 <body> 태그 내에 작성할 수 있습니다. <body> 태그 맨 아래에 자바스크립트를 작성하면 브라우저에 표시 속도가 향상됩니다.
따로 js 파일을 생성해서 자바스크립트를 작성하고 HTML 파일에서 js 파일을 불러오는 형식으로 사용할 수 있습니다.
먼저 js 파일을 생성합니다.
function myFunc() {
console.log("hello world");
}myFunc.js 파일에 코드를 작성하면 HTML에 적용하면 됩니다.
<!DOCTYPE html>
<html>
<head>
<title>head javascript</title>
</head>
<body>
<h1>Main Page</h1>
<button type="button" onclick="myFunc()">버튼</button>
<script src="myFunc.js"></script>
</body>
</html>
출처
W3Schools.com
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com
'Programming > Javascript' 카테고리의 다른 글
| 자바스크립트에서 타임리프 사용하기 (1) | 2024.10.06 |
|---|---|
| 자바스크립트 함수 (0) | 2024.09.19 |
| 자바스크립트 변수 (0) | 2024.09.13 |
| 자바스크립트 구문 (0) | 2024.09.13 |
| 자바스크립트 출력 (0) | 2024.09.13 |
