자바스크립트 란?
- 자바스크립트는 객체(오브젝트) 기반의 스크립트 언어이다.
- 웹의 동작을 구현할 수 있다.
- 자바스크립트는 HTML의 ‘내용’을 변경할 수 있다.
- 자바스크립트는 HTML의 ‘속성’을 변경할 수 있다.
- 자바스크립트는 HTML의 ‘스타일’을 변경할 수 있다.
- 자바스크립트의 실행문은 세미콜론(;)으로 구분됩니다.
- 자바스크립트는 대소문자를 구분합니다.
리터럴 - 직접 표현되는 값 그 자체를 의미합니다.
12 // 숫자 리터럴
"JavaScript" // 문자열 리터럴
'안녕하세요' // 문자열 리터럴
true // 불리언 리터럴
자바스크립트에서는 영문자(대소문자),숫자,언더스코어(_),달러($)만을 사용할 수 있습니다.
Camel Case 방식이란 식별자가 여러 단어로 이루어질 경우에 첫 번째 단어는 모두 소문자로 작성하고, 그 다음 단어부터는 첫 문자만 대문자로 작성하는 방식입니다.
관행적으로 이 방식을 많이 사용합니다. (예: var firstVar = 10;)
- 에러 문자 해석
is not a function - ‘ . ’ 뒤에 부분의 함수가 문제인 것
( ) - parentheses
{ } - braces
[ ] - brackets
` - 백틱의 특성 줄 바꿈을 할 수 있다.
\n - 줄 바꿈을 할 수 있다.
'' "" `` 등 빈문자도 문자열로 인식을 한다.
문자열을 숫자로 바꾸는 법
perseInt() = Number()
perseInt() - 3.14를 3이라는 정수로 바꿈
perseFloat() - 3.14를 정확히 보여줌
prompt() - 는 팝업창이 뜨고 쓴 값을 문자열로 해석해주는데
parseInt(prompt()) -는 팝업창이 뜨고 쓴 값을 숫자로 해석을 해줌
반복문
for (초기조건; 조건체크; 조건변경) {}
예1) for (var i = 0; i < 10; i++) {
console.log(i);
}
i는 0이고, 0은 당연히 10보다 작은데, i++을 해서
한턴끝나고 반복해서 1씩 증가하게 해라 라는 의미
계속 증가하다가 10이 써지기전에 아 이 값은 true가 아니구나 라고 판단
0~9까지만 화면에 출력이 되는 것이다.
관례적으로 for문을 쓸 때 개발자들은 i를 쓴다.
예2)
var movies = ['극한직업', '어벤져스, '오펀', '강시', '나 홀로 집에'];
for (var i = 0; i< movies.length; i++) {
console.log( movies[i] );
}
이러면 콘솔창에 영화 이름이 차례대로 위에서 아래로 출력이 된다.
코드해석: 영화들 이름을 먼저 선언해주고, i는 0이고, 0보다 영화의 길이(영화들 목록)가 더 크다. 그러면서 i는 1씩 증가를 하니까 0에서 영화목록들 길이만큼 반복되서 추가가 가능한 것이 된다. (movies.length = 얼마나 추가해도 영화 목록을 추가하면 추가한대로 다 보여줌)
그러면서 movies에 인덱스 [i]를 추가해주면 인덱스의 숫자가 0에서 부터 영화목록 길이만큼 늘어나게 된다. 그래서 콘솔창에 영화목록이 주르륵 뜰 수 있는 것. 영화 목록 리스트로는 5개이기때문에 인덱스로 세면 0,1,2,3,4까지니까 영화 목록이 전체다 출력이 되는 것이다.
자바스크립트는 조립하는 레고와 같은 언어이다.예3)
console.log( movies[ movies.length -1 ] );
코드해석: movies 들 중에서 영화 목록은 예를 들어 5개라고 치면 인덱스는 0부터 시작하지만 length는 셀 때 1부터 시작하기에 -1을 넣으면 마지막것을 찾아서 콘솔창에 출력을 해주는 것. 인덱스와 리스트의 차이를 정확하게 알 것
