목차
이미 Python 및 Java, C 지식을 아는 상태에서 강의를 들었으며,
프로그래밍적인 측면에서 너무 쉽거나 당연한 부분은 아주 간단히 넘어가거나 적지 않았음.
■ 코맨드 선언
- 세미콜론 : 파이썬처럼 굳이 문장에 끝에 ;을 붙일 필요는 없지만, coding convetion상 붙이는게 권고.
- //두개를 붙이면 주석 처리
■ 출력 (ALERT, CONSOLE.LOG)
파이썬의 print. Java의 System.out.println. C의 printf와 같은 것. 크게 2가지로 볼 수 있음. 콘솔로 보여주느냐 아님 팝업으로 띄우느냐.
- alert(<출력할내용>) 팝업으로 뜸. (확인을 눌러야 종료)
- console.log(<출력할내용>) 코멘드창에 뜸.
■ 대화상자 (ALERT, PROMPT, CONFIRM)
아래 3가지는 팝업창이 무조건 뜨며, 이 팝업창을 작성/종료하지 않는 이상 다음으로 넘어가지 않음.
빠르고 간단하다는 장점이 있지만, 스타일링이 불가능하다는 (디자이너들이 못생겨서 싫어함) 단점도 있음
- alert(<메세지>) : 알려주는 역할.
팝업이 뜨긴한데, 버튼이 "확인"받게 없어서 정말 알려주는 용도밖에 할 수 없다. 비밀번호를 재 확인하세요! 이럴 때 쓰임 - prompt(<메세지>) : 입력받음 (파이썬의 input같은 역할).
팝업창이 떠서 입력받게 하며, 아무것도 입력하지 않으면 null 반환.
- 참고로 prompt(<메세지>,<디폴트값>) 괄호 안에 argument를 2개까지 넣을 수 있음.
- 파이썬의 input처럼 prompt로 입력받은 값은 무조건 문자형임. - confirm(<메세지>) : 역시 알려주는 역할. 단, alert와는 다르게 취소 & 확인 버튼이 2개임. 그래서 true & false 반환.
■ 변수 및 변수 선언
- Java나 C와는 달리 Python처럼 앞에 굳이 int, float, bool 이란 자료형을 선언하지 않아도 됨.
즉 int age = 25; 라고 선언하지 않음. - 대신, 변수를 선언할 때 앞에 붙이는 것은 4가지 임. 아무것도 안붙이기도, var 또는 let 또는 const를 붙이기도 하는데 이는 후술.
- 변수는 문자와 숫자 $와 _만 가능 (단 숫자로 시작하는건 안됨. 숫자가 된다는 건, num1, num2 이런게 된단 소리)
■ 문자열 스트링
- 문자열을 리터럴로 입력할 경우, 시작과 끝에 따옴표를 붙여주어야 함. 큰 따옴표, 작은따옴표, back tick (1왼쪽에 있는 `)다 됨.
- 백틱(backtick)은 파이썬의 f-string기법 같이 이용할 때 좋음
console.log(`Hello. I am ${name}`); console.log(`Total price is ${1000*3}won`); - 예약어(Reserved Words)는 변수명으로 사용할 수 없음. class = "수업" 안됨
■ 자바스크립트에서 변수 선언하기 (4가지)
자바 스크립트에서 변수를 선언할 때는 (???) 변수명 = 변수값이다.
파이썬처럼 변수 앞에 변수타입을 넣지 않아도 좋다. 자바나 씨의 경우 int age = 30; float length = 34.52; 이런식으로 쓰는데 말이다. 그렇다면 저 위 (???) 변수명 = 변수값; 에 물음표 자리에는 무엇이 들어가는 것일까?
공백, let, const, var 4가지가 들어갈 수 있다.
□ 자바스크립트에서 변수 선언하기 (1/4) 공백
- 가장 손쉽게 변수 선언하는 방법은 변수명 = 변수값;
- 하지만 이 방법은 비추천된다. 변수가 너무 손쉽게 덮어씌워지며 수정될 수 있기 때문이다
- name = "Mike"; age = 30; 이라고 선언 후 , name이라는 변수명이 유일하다는 보장이 없기 때문이다.
그래서 나온게 나온게 const와 let (후술)
사실 이 부분은 잘 모르겠다.
백준 알고리즘 풀 때는 특히 덮어씌워지며 값을 변경해야하는 일이 잦아서..
웹에서는 한 변수가 값이 변경되는 일이 많이 없나?)
□ 자바스크립트에서 변수 선언하기 (2/4) LET
- let name = "Cindy"; 선언 후 밑에 let name = "Gloria"; 선언하면 에러 발생
그런데 let은 단순히 경고의 느낌이 강함, 위에 같은 이름의 변수를 이미 사용했는지 안했는지의 확인 용도?
왜냐하면 let name = "Cindy"; 이래놓고 name = "Gloria"; 라고 하면 (앞에 공백) 에러 없이 덮어씌워지기 때문이다. - 솔직히 개인이 코드를 짤 땐, 일부러 의도한 경우 외, 실수로 같은 변수명으로 서로 다른 값을 지정할 일은 없다. 단체 프로젝트에서 조심해야할 부분이다.
□ 자바스크립트에서 변수 선언하기 (3/4) CONST
- 절대 바뀌지 않을 상수를 선언할 때 사용된다. const PI = 3.141592; 처럼말이다.
- (항상 그래야하는 것은 아니지만), 불변의 값은 대문자로 변수명을 지정하기도 한다. 예를 들어 PI.
- let이랑 달리 어떠한 방법으로도 수정 불가하다. const name = "Cindy"; name = "Cindy";는 에러가 뜬다.
- 팁: 웬만해선 일단 모든 변수를 선언할 때 const로 선언한 뒤, 변경될 여지가 있는 변수들만 let으로 바꾸는 식으로 코딩하자.
□ 자바스크립트에서 변수 선언하기 (4/4) VAR
- 사실 변수 앞에 (공백), const, let 말고도 <var>을 붙일 수 있다.
- var로 지정한 변수는 변해도 에러가 뜨지 않는다. var name = "Jenny"; var name = "Jennifer"; 가능
- var는 자바나 씨에서 값없이 초기화 선언만 해두었던 것처럼 (예: int age; float length;) 값 지정없이 일단 변수 선언만 하는게 가능하다. 예: var age;
여기서 호이스팅에 대해 알아보고 가자!
스코프 내부 어디서든 변수 선언은 최상위에 선언된 것처럼 하는 것을 호이스팅이라고 부른다.
위 예제에서 var name;이라고 미리 선언만 했지 값을 지정하지 않았음에도 불구하고,
console.log(name)은 레퍼런스 에러가 뜨지 않고, undefined를 띄우며 조용히 넘어간다.
(호이스팅은 완전 기초 단계에서 이해하기엔 어려운 개념이긴 하니 ㅠㅠ. 노트4번에서 자세히 설명하겠다)
