반응형
# 자바스크립트 학습
- 학습 환경을 구성하기 위해 기존에 사용하던 에디터가 있으면 해당 에디터를 사용한다.
- 사용하던 에디터가 없다면 Visual Studio Code (VS Code)를 다운받아서 사용한다.
# html, js 파일 생성하여 출력해보기
- 아래와 같이 코드를 작성 후 hellow.html로 저장한다.
<!DOCTYPE html>
<html lang=ko>
<head>
// meta charset="utf-8" : 해당 코드를 입력하지 않을 경우 간혹 한글이 깨지는 현상이 발생한다.
<meta charset="utf-8">
<title>자바스크립트</title>
<script src="./hellow.js" defer></script>
</head>
<body>
</body>
</html>
- hellow.html 파일과 동일한 위치에 hellow.js 파일을 생성한 후 아래와 같이 코드를 작성 후 저장한다.
var hello = "안녕하세요.";
document.body.innerText = hello;- hellow.html 파일을 클릭하여 실행 하거나 혹은 웹브라우저에 파일을 드래그하여 드롭하면 아래와 같이 출력이 된다.
# 문장 (Statement)
- 문장이란 JS(자바스크립트) 실행 단위이다.
- 세미클론(;)까지를 하나의 문장으로 처리한다.
var book = "책";- 자바스크립트의 경우 세미클론으로 문장을 구분하기 때문에 들여쓰기의 유무가 크게 관계 없으나, 일반적으로 가독성을 위해 들여쓰기를 사용한다.
- 들여쓰기는 가독성을 위한 것으로 일반적으로 2칸, 4칸을 사용한다. 들여쓰기에 정해진 건 없고, 개발자의 취향이며 들여쓰기를 적용 할 경우 일관성을 갖고 적용하는 것이 바람직하다.
# 변수 (Variable)
- 값을 저장하는 영역
- 변수에 저장된 값을 재 사용하기 위해 변수를 사용한다.
- 변수의 선언과 값 할당은 아래와 같이 진행한다.
- 변수 선언 시 사용되는 var는 Variable의 약어.
// 변수의 선언
var 변수명;
// 변수의 선언과 값 할당하는 방법
var book = "책";## 변수의 선언 방법
- 콤마로 구분하여 다수 작성
var book = "책", point = "12345";- 줄을 바꾸어 작성
var book = "책",
point = 12345;- 변수 이름 앞에 콤마를 작성
var book = "책"
, point = 12345;- 시맨틱(Semantic) : 의미를 부여하여 변수 이름을 작명하는 것으로, 변수 이름은 포괄적인것 보다 구체적인게 좋다.
## 변수에 값을 할당하는 방법
- 나중에 할당한 값으로 바뀐다.
var point = 222, point = 345;
point = 555;
=>
JS(자바스크립트)는 코드를 왼쪽에서 오른쪽으로 실행하며 처리한다.(세미클론이 나올떄 까지)
point라는 변수의 값이 222 > 345 > 555로 변경된다.- 같은 값을 할당한다.
var point = amount = 555;
=>
좋은 형태는 아니며,
point와 amount의 값은 555반응형
'인프런 강의 학습 > 자바스크립트 비기너' 카테고리의 다른 글
| 자바스크립트 학습 6일차 (0) | 2020.12.09 |
|---|---|
| 자바스크립트 학습 5일차 (0) | 2020.12.08 |
| 자바스크립트 학습 4일차 (0) | 2020.12.03 |
| 자바스크립트 학습 3일차 (0) | 2020.12.02 |
| 자바스크립트 학습 2일차 (0) | 2020.12.01 |