This article is currently in the process of being translated into Korean (~98% done).
Hello, world!
역사적으로 모든 프로그래밍 튜토리얼은 "Hello, world!" 예제로 시작해야 합니다. 이 예제의 목적은 단순히 "Hello, world!"라는 메시지를 사용자에게 출력하는 것입니다. 이는 자바스크립트가 발명되기 최소 20년 전인 1974년으로 거슬러 올라갈 수 있지만, 그럼에도 불구하고 이 튜토리얼은 "Hello, world!" 예제로도 시작할 것입니다.
JavaScript에서는 메시지를 해석하는 데 사용되는 JavaScript 엔진에 따라 메시지를 출력하는 위치가 달라질 수 있습니다. 예를 들어 브라우저에서 실행하는 경우 alert() 함수 또는 console.log() 함수를 이용해 메시지를 표시할 수 있습니다
alert("Hello, world!");이 예제를 실행해 보면 세계적으로 유명한 메시지와 함께 멋진 팝업이 표시됩니다. 이전에 이야기했듯이 이 튜토리얼은 브라우저에 초점을 맞추지 않고 시작되지만, HTML 파일에 이 코드를 삽입하면 다음과 같이 script 태그 안에 있어야 한다는 점을 알아야합니다.
<script>
alert("Hello, world!");
</script>Hello, webpage!
이 점을 인지하고 간단하지만, JavaScript를 실제(비록 간단하지만) 웹페이지에 통합하여 작동하는 또 다른 예를 보여드리고자 합니다:
<!DOCTYPE html>
<html>
<head>
<title>Hello, world!</title>
</head>
<body>
<p>And now for the world famous message:</p>
<script>
document.write("Hello, world!");
</script>
<p>Thank you, and goodnight!</p>
</body>
</html>위 예제를 여기 튜토리얼에서 직접 실행하거나 컴퓨터에 .html 파일로 저장하고 브라우저에서 열어보세요.
웹페이지의 기본 구조일 뿐인 다양한 HTML 태그에 대해 현재는 너무 걱정하지 마세요. 대신 중간에 있는 script 블록에 집중하세요. 예제코드에서는 JavaScript코드를 HTML 코드 중간 document.write()라고 작성하였습니다. 이 함수는 HTML 코드 코드 간에 직접적으로 넣게됩니다.
Hello, console!
document.write()는 브라우저 전용 함수이므로 Node.js에서 이 함수를 실행하는 경우 작동하지 않을 가능성이 높습니다. 대신 JavaScript 엔진에서 작동하는 함수인 console.log() 를 사용할 수 있습니다
console.log("Hello, world!");브라우저에서 이 기능을 실행하기 위해서는 개발자 도구를 찾아봐야 합니다.개발자 도구에 접근하는 방법은 사용하는 브라우저에 따라 다르지만, F12을 누르면 사용할 수 있습니다. 만약 안된다면 각 브라우저에서 접근하는 방법을 설명하는 this article 에서 확인해보세요.
요약
"Hello, world!"라는 필수 예제를 다루면서 이제 JavaScript 언어에 대해 더 많이 배울 준비가 되었습니다.