JS - 연산자 (operator)

1. string concatenation (+)

1) 문자열 + 문자열 = 새로운 문자열

console.log('my'+'cat');
my cat

2) 문자열 + 숫자 = 숫자가 문자열로 변환

console.log('1'+2);
12 (string)

3) `` 백틱 기호 사용하여 string literals 이용

console.log(`string literals: 1+2 = ${1+2}`);
string literals: 1+2 =3

(줄바꿈을 하거나 특수기호를 넣어도 문자열로 변환되어서 나온다는 장점)

2. Numeric operators

• console.log(1+1); // add 더하기
• console.log(1-1); // substract 빼기
• console.log(1/1); // divide 나누기
• console.log(1*1); // multiply 곱하기
• console.log(5%2); // remainder 나눈 나머지값
• console.log(2**3); // exponentiation 2의 3승

3. ++increment and --decrement operators

let counter = 2;
const preIncrement = ++counter;
// counter= counter+1;
// preIncrement = counter;
// 카운터에 1을 더해서 카운터의 값을 다시 할당한 다음에 
// preIncrement라는 변수에 카운터 값을 할당하는 것 (3이 할당됨)

const postIncrement = counter++;
// postIncrement =counter;
// counter = counter+1;
// 먼저 변수 값을 postIncrement에 할당한 다음에 그 뒤에 카운터 값을 증가 시킴 

pre 바로 업데이트 되어서 할당되고
post 할당해놓고 업데이트는 그 이후에

4. Assignment operators

let x = 3;
let y = 6;
x += y; // x = x+y;
x -= y;
x *= y;
x /= y;

5. comparison operators (비교)

console.log(10<6); // less than
console.log(10<=6); // less than or equal
console.log(10>6); // greater than
console.log(lo>=6); // greater than or equal

6. logical operators

||(or)

value나 expression 중에서 하나라도 true가 잇으면 true로 연산
or연산자는 처음으로 true가 나오면 거기서 연산 멈춤 뒤에는 볼필요도 없음
연산 많이하는 함수 호출하거나 expression 같은 것들을 제일 앞에 두면 안됨 /심플한 벨류를 앞에 두는게 효율적

&&(and)

모두 true여야 true 리턴함
헤비한 오퍼레이션일수록 뒤에 두는게 좋음

!(not)

값을 반대로 바꿔줌
값이 true면 false로 변경

7. Equality

const stringFive = '5';
const numberFive = 5;

== loose equality (타입을 변경해서 검사)
console.log(stringFive == numberFive); 
true 출력
console.log(stringFive != numverFive);
false 출력

=== strict equality (타입 다르면 다른거야)
console.log(stringFive === numberFive);
flase 출력
console.log(stringFive !== numberFive);
true 출력

object equality by reference
오브젝트는 레퍼런스 형태로 메모리에 저장

const ellie1 = {name:'ellie'};
const ellie2 = {name:'ellie'};
//ellie1과 2는 똑같은 데이터가 들어있는 오브젝트이지만 
//실제로 메모리에는 각각 다른 레퍼런스가 들어있음. 
const ellie3 = ellie1;
console.log(ellie1==ellie2); false
console.log(ellie1===ellie2); false
console.log(ellie1===ellie3); true

8. If operators

if, else if, else

const name = 'yosi';
if (name === 'yosi'){
	console.log('welcome, yosi!');
} else if(name==='coder'){
	console.log('you are amazing coder');
} else {
	console.log('unknown');
}

9. ? operators

condition ? value1 : value2;

console.log(name === 'ellie'?'yes':'no');
	//name이 엘리야? 맞으면 왼쪽인 yes출력
	//틀리면 : 다음에 나오는 no 출력 

10. switch

const browser = 'IE'
switch (browser){
	case 'IE':
    	console.log('go away!');
        break;
    case 'Chrome':
    	console.log('love you!');
        break;
    case 'Firefox':
    	console.log('love you!');
        break;
    default:
    	console.log('same all!');
        break;
}

go away 출력!
  
// 내용이 반복되는 크롬과 파이어폭스 부분을 아래처럼 변경할 수 있음   
  case 'Chrome':
  case 'Firefox':
    	console.log('love you!');
        break;

11. While Loops

let i = 3;
while (i>0) {
	console.log(`while: ${i}`);
    i--; 
  // i--; = i를 1 감소시킨다는 의미 
}

while: 3
while: 2
while: 1

________________________________

do while loop = 먼저 블럭을 실행한 다음에 조건이 맞는지 안맞는지 검사

  do { 
    console.log(`do while: ${i}`);
    i--;
  } while (i>0);

do while: 0

블럭을 먼저 실행하고 싶다면 do while
조건문이 맞을 때만 블럭 실행하고 싶다면 while

12. for loop

for(시작하는 문장; 조건; 어떤 스텝 밟을건지;)

for (i=3; i>0; i--){
  console.log(`for: ${i}`);
}

for (let i=3; i>0; i=i-2){
  console.log(`inline variable for: ${i}`);
}

13. nested loops

for (let i=0; i<10; i++){
	for (let j=0; j<10; j++){
    	console.log(`i:${i}, j:${j}`);
    }
}

break : loop를 완전히 끝내는 것

continue : 지금것만 스킵하고 다음 스텝으로 넘어가는 것

// 0부터 10까지 짝수만 ! 
for (i=0; i<11; i++){
  if(i%2 !== 0){
    continue;
  }
  console.log(`q1. ${i}`);
}

출력
q1. 0
q1. 2
q1. 4
q1. 6
q1. 8
q1. 10

__________________________________________________

// 0부터 10까지, 8에 도달하면 멈추기 
for (let i=0; i<11; i++){
  if(i>8){
    break;
  }
  console.log(`g2. ${i}`);
}

출력
q2. 0
q2. 1
q2. 2
q2. 3
q2. 4
q2. 5
q2. 6
q2. 7
q2. 8