Java Script 작성하기 - Basic

안녕하세요.

Hynn 입니다.

 

이전 포스팅에서는 다소 따분하지만, 그래도 내가 공부해야 하는 언어가 어떤 언어인지를 알 수 있는 개념을 이해해보는 시간을 가져보도록 했었습니다.

 

이제 JavaScript 를 기본적으로 어떻게 사용해보는지를 HTML 때 처럼, 하나씩 해보도록 하겠습니다.

이 역시도 Element 같은 다양한 명령어를 많이 쓰는것 보다, 어떠한 원리로 동작하고 작동이 되는지를 위주로 설명해보려 합니다.

 

 

==================

1. JavaScript 는 어디에 작성합니까?

2. 작성된 JavaScript 의 해석 단계

3. 기본 연산자, 변수란 무엇입니까?

==================

 

1. JavaScript 는 어디에 작성합니까?

 

Java Script 를 작성하기 위해서 역시 VisualStudio Code 를 사용해보도록 하겠습니다.

먼저 JavaScript 는 HTML 영역내에서 작성하는 방법, 그리고 별도의 파일을 생성하고 연결하는 방법이 존재합니다.

 

HTML 영역에서는 특별히 다른 규칙이 있지 않고, <Script></Script> 안에서 자신이 하고자하는 명령어를 입력하는 방식으로 작동합니다.

이를 통해 하나의 HTML 파일 내에서 이를 모두 작성하는 방법이 존재합니다.

하지만 이전에 CSS 에서 학습했듯이, 하나의 페이지에서 작성하기에는 줄이 너무 방대하고, 식별하기가 매우 어려운 단점이 존재하기에 이 역시 연결하는 단계를 거치면 별도의 파일에서 작성해서 하는 방법도 존재합니다.

 



기존의 CSS 를 연결하는 것은 <Link href="경로" type="text/css" rel="stylesheet"> 였다면,

JavaScript 는 약간 다른 입력을 해야 합니다. 입력방법은 아래와 같습니다. 

<link type="javascript" src="/20221028/Javascript/blog.js">

Link 는 동일하게 사용하고 유형을 JavaScript 로 지정하고, 기존의 href 가 아니라 src 로 경로를 연결합니다.

연결을 하기 전 당연히 확장자가 .js 라는 JavaScript 파일을 생성해야 합니다.

 

2. 작성된 JavaScript 의 해석 단계

 

Java Script 역시 해석의 단계는 HTML과 다르지 않습니다.

먼저 아래의 그림을 참조로 본다면, 첫번째로는 위에서 아래로 먼저 해석을 합니다.

그리고 난 뒤 왼쪽에서 오른쪽으로 해석을 하는 단계로 이루어집니다.

 

즉 여기서는 위부터 해석하지만 왼쪽에서 오른쪽으로 해석 후 아래로 넘어가는 형태를 취하게 됩니다.

 

다만 특징적으로 HTML이나 CSS 의 경우, " < > " 나 " ; " 의 구분자를 통해 하나의 속성/명령을 부여한 뒤 마침을 표시해야 하지만, JavaScript 는 특정 연산자를 쓰지 않는 경우, 이를 생략하여도 됩니다.

 

하지만 편의적인 측면에서는 입력하는 것이 더 좋을 수도 있습니다. 이는 결국 작성자의 성향 및 스타일에 따라 달라질 것입니다. 

 

3. 기본 연산자, 변수란 무엇입니까?

 

기본 연산자는 수학에서 대표적으로 사용하는 사칙연산자, 그리고 대입연산자라는 특정한 방식이 존재합니다.

이를 간단하게 정리하면 아래와 같습니다.

 

연산자	설명	예시
+	더하기를 뜻합니다.	console.log(1+1) 결과값 2
-	빼기를 뜻합니다	console.log(2-1) 결과값 1
*	곱하기를 뜻합니다	console.log(2*2) 결과값 4
/	나누기를 뜻합니다	console.log(6/3) 결과값 2
%	나누고 남은 수를 뜻합니다	console.log(6%4) 결과값 2
=	대입연산자로 사용됩니다. 수학에서 사용하던 = 와는 다른 의미가 있습니다.	연산과정에서 대입연산자가 있는 경우, 연산자를 먼저 계산함.

이러한 기본 연산자는 반드시 이해하고 있어야 하니, 이에 대해서는 숙지가 필요하겠습니다.

다음 포스팅에서는 기본적인 변수선언, 작성에 대해서도 살펴보도록 하겠습니다.

 

감사합니다.