1. Number Data type

이항연산자 - 왼쪽(좌항)에 있는 값과 오른쪽(우항)에 있는 값을 처리해서 하나의 값을 만들어내는 역할

console.log(1);
console.log(1+1);
console.log(4-1);
console.log(2*3);
console.log(10/2);

 

2. String Data type

String(문자열) 표현 : " " , ' '

 

어떤 데이터를 사용하냐에 따라 연산자의 의미가 바뀜 

"+" 이항연산자 -> 결합 연산자 

//이항 연산자 
console.log(1+1); 	// 2

//결합 연산자 
console.log('1'+'1');	// 11

 

 

String count

string.length  

console.log('abcd'.length);

 

3. Variable

var a = 1;
console.log(a);

변수 선언시 변수 앞에 var 를 붙이는 것이 좋음 

 

 

코드 상에서의 줄바꿈 

\

출력 상에서의 줄바꿈

\n

var name = 'k8805';
// String literals
var letter = 'Dear '+name+'\n\nabcdefg'+'\
\
abc';
console.log(letter);

 

4. Template literals

키보드를 보면 ~ 표시 옆에 ` 가 있는데 이를 이용

var letter = `Dear ${name}

abcdefg`;
console.log(letter);

개행문자 \n를 사용하지 않고 enter를 쳐도 error없이 출력됨

 

변수를 넣어서 치환하고 싶을 때

 +name+ 대신에 ` ` 안에서 ${name}을 사용함

`${1+1}` 의 경우 1+1 의 연산결과가 출력됨

 

※ 5번 6번 7번 세가지는 서로 밀접한 관계에 있기 때문에 같이 생각하는 것이 좋음

5. Boolean Data type

console.log(true);
console.log(false);

실행하면 각각 true와 false가 출력된다. 

true는 변수 이름으로 쓸 수 없음 

 

6. Comparison operator (비교연산자)

좌항과 우항을 비교해서 true나 false 둘 중에 하나의 값을 만들어내는 연산자 

console.log(1==1);  //true
console.log(1==2);  //false
console.log(1===1); //true
console.log(1>2);   //false
console.log(1<2);   //true

'=' 는 개수에 따라 의미가 다름

= 1개 (name=1) : 대입 연산자

= 2개 (name==1) : 비교 연산자 (좌항과 우항의 값이 같으면 true, 다르면 false)

= 3개 (name===1) : 비교 연산자 ( 좌항과 우항의 값이 정확하게 같은지 비교해주는 연산자)

☆ 비교연산자를 사용할 때, == 보다는 === 권장

 

7. Conditional Statement (조건문)

조건에 따라 실행문의 흐름 제어

if 괄호 안에는 문법적으로 true/false 즉, boolean형이 들어감

if(true){
   console.log('C1'); 
}
if(false){
    console.log('C2');
}

위 코드와 아래의 코드는 동일하다.  true가 아니면 false이기 때문에  if (true){..} else{..} 를 쓸 수 있다. 

if(true){
    console.log('C1'); 
 }
else{
     console.log('C2');
 }

 

8. loop (반복문)

for문, while문, do-while문

- while문 (가장 기초적이지만 불편) 

while 괄호 안에는 if 괄호 안과 마찬가지로 boolean형을 넣는다. 

while 괄호 안에 true를 넣으면 : 무한 반복문 

아래 코드와 같이 i<5를 넣으면 반복문이 실행될때 마다 i가 1씩 커지고, i가 5가 되면 false가 되므로 반복문을 종료한다. 

var i=0;
while(i<5){
    console.log(i);
    i=i+1;
}

 

'Web > HTML\CSS\JavaScript' 카테고리의 다른 글

[JavaScript] Function  (0) 2020.07.25
[JavaScript] Array data type  (0) 2020.07.25
[HTML] 기본문법 태그  (0) 2020.07.13
[HTML+CSS3] 링크만들기  (0) 2020.05.25
[HTML+CSS3] 이미지삽입하기  (0) 2020.05.19

+ Recent posts