CSS - 형용사
HTML - 명사
Javascript - 동사
Javascript
웹 페이지에서 복잡한 기능을 구현할 수 있도록 하는 스크립팅 언어 또는 프로그래밍 언어
동적기능, 동적처리, 이벤트 처리, 슬라이드 메뉴 등을 구성 가능하다.
+ 이 언어는 아이폰과 같은 스마트폰의 보급과 동시에 웹의 수요가 늘면서 동시에 인기 급상승한 언어 사용법
<script>
//javascript 코드 작성
</script>필수 도구
console.log()브라우저의 개발자 도구 콘솔에서 확인가능(검사)alert()브라우저가 열렸을 때, 그 내용을 알림창으로 보여준다.
내장 방식 & 링크방식
내장방식 : 위치는 어디에나 사용이 가능하다.
+)간단하다, 특정 페이지에서만 작동하는 기능일 경우 내장 방식으로만 따로 구현 가능
<script>
//javascript 코드 작성
</script>링크방식 : Javascript 파일을 따로 만들어서 링크하는 방식
<script src="./index.js"></script>
위치는 어디서나 사용이 가능하지만, 주로 head나 body 태그 안에서 많이 사용한다.
읽는 순서는 말그대로 읽히는 순서에 따라서 작동한다.
위치
<head>에 포함되는 경우 페이지가 열리는 시간이 오래걸릴 수 있다. 따라서 html을 제어해야하는 JS코드만 head에 포함시키자. 그 외는 body에 넣으면 좋다.
표기법
dash-case(kebab-case)
HTML, CSS에서 많이 사용하는 방법
snake_case
HTML, CSS에서 많이 사용하는 방법
camelCase
JS, Java 에서 많이 사용하는 방법
*무조건 소문자로 시작! 그다음 단어부터는 첫글자 대문자로!
PascalCase
JS 에서 많이 사용하는 방법
*무조건 대문자로 시작!마찬가지로 그다음 단어부터 첫글자 대문자로
Zero-based Numbering
0 기반 번호 매기기
특수한 경우를 제외하고 컴퓨터는 0부터 숫자를 시작한다.
주석
ctrl + /
// : 한줄일 때 슬라이스 2개
/* */ :여러줄일 때
변수
데이터를 저장하고 참조(사용)하는 데이터의 이름 이를 이용해서 저장된 데이터를 가져와 사용할 수 있게 된다.
키워드 var, let, const
- 변수 선언
let 변수이름;
var 변수이름; - 할당
const 변수이름=값 ;
let 변수이름 = 값;
var 변수이름 = 값;
var
- 선언 단계와 초기화가 동시에 이루어지며 아무것도 할당하지 않으면 undefined 가 할당된다.
- 중복 선언이 가능하며 재선언이 가능하다.
- 기존의 변수에 덮어 씌워지면 문제가 발생한다.
- 변수가 블록 단위에서 끝나는 것이 아니라, 자기 맘대로 전역을 돌아다니고 영향력을 행사하여 의도치 않은 문제가 발생된다.
- 따라서 ES6문법(2015년)부터는 let 사용이 권장되고 있다.
var name; // 변수 선언 및 undefined 자동 할당
name = 'ji-hye';//초기값 할당
var old = 40; // 변수 선언시 초기화
old = 26; // 변수 재할당 가능
let
- 변수 중복 선언이 불가능하지만, 재할당 가능하다.
- var과 마찬가지로 선언을 하지 않으면 자동으로 undefined가 들어간다.
let nationality; // 변수 선언 및 undefined 자동 할당
nationality= 'KR'; // 초기화
nationality='US'; //변수 재할당 가능const
- 초반에 선언할 때 반드시 초기화(const 변수이름=값)를 동시에 진행해야 한다.
- 재선언 불가능, 재할당 불가능하다. 즉, const를 사용해서 변수를 한번 선언하면 값을 바꿀 수 없다.
- 단, const로 객체를 생성하였을 때 속성 자체를 변경하는 것은 불가능하지만 배열 내 값이나, 객체 속성 값은 업데이트할 수 있음을 유의하자!
- 대, 소문자 구분 가능
const job = 'student'; //변수 선언 및 초기화
job = 'dancer';//에러 발생 재할당 불가능자료형
언어 타입
- 강한 타입 언어 : 타입 검사를 통과하지 못하면 실행 자체가 안되는 타입 sring(문자), int(숫자), double(소수점) Java, c
- 약한 타입 언어 : 런타임에서 타입 오류를 만나더라도 실행을 막지 않는다. 타입이 여러 종류인 값들이 상관없이 지정된다. JS, python
문자형 데이터 string
따옴표 사용 "", '' 둘다 사용 가능
문자, 변수를 동시에 쓰고 싶을 때
console.log(변수, 변수, 변수);
console.log("안녕하세요 "+변수,"입니다");
console.log(안녕하세요 ${변수}입니다);
숫자형 데이터 Number
숫자는 그냥 작성하면 되는데 따옴표를 붙히면 숫자로 인식한다.
참, 거짓 데이터 Boolean
True /False
미할당 데이터 undefined
값이 할당되지 않았다.
의도된 빈 데이터 Null
데이터가 의도적으로 비어져 있다.
배열 데이터 Array
여러 데이터를 순차적으로 한번에 넣을 때
대괄호 [데이터, 데이터, 데이터...] 안에 여러개의 데이터 넣어서 배열한다.
배열 안에 앞서 나온 어떤 값이든 넣을 수 있다.
배열에서 사용 가능한 속성, 함수
변수명.length
변수명.push(추가할값) 마지막에 추가
변수명.pop() 마지막 삭제 배열 제
변수명.uhshift(추가할값) 맨 앞에 추가
변수명.shift() 맨 앞 삭제
변수명.indexOf(찾을값) 값의 인덱스(순번, 0부터 시작함을 잊지 말기) , 없을땐 -1
변수명.includes(찾을값)값이 있는지 있을땐 true, 없을 댄 false
console.log(colors.reverse()) 배열을 반전시킨다.
