JavaScript - Operator

1. String concatenation

<script>
console.log('my' + 'cat'); // mycat
console.log('1' + 2); // 12
console.log(`string literals: 1 + 2 = ${1 + 2}`); // string literals: 1 + 2 = 3
console.log('mia\'s book'); // mia's book
</script>

• 특수 문자열 사이트

2. Numeric operators

<script>
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승)
</script>

3. Increment and decrement operators

<script>
let counter = 2;
const preIncrement = ++counter;
// counter = counter + 1;
// preIncrement = counter;
console.log(`preIncrement: ${preIncrement}, counter: ${counter}`);
// preIncrement: 3, counter: 3

const postIncrement = counter++;
// postIncrement = counter;
// counter = counter + 1;
console.log(`postIncrement: ${postIncrement}, counter: ${counter}`);
// postIncrement: 3, counter: 4

const preDecrement = --counter;
// counter = counter - 1;
// preDecrement = counter;
console.log(`preDecrement: ${preDecrement}, counter: ${counter}`);
// preDecrement: 3, counter: 3

const postDecrement = counter--;
// postDecrement = counter;
// counter = counter - 1;
console.log(`postDecrement: ${postDecrement}, counter: ${counter}`);
// postDecrement: 3, counter: 2
</script>

4. Assingnment operators

<script>
let x = 3;
let y = 6;
x += y; // x = x + y;
x -= y; 
x *= y;
x /= y;
</script>

5. Comparison operators

<script>
 console.log(10 < 6);
 console.log(10 <= 6);
 console.log(10 > 6);
 console.log(10 >= 6);
</script>

6. Logical operators: ||(or), &&(and), !(not)

   *logical operator는 처음에 true가 나오면 멈춰버림
   value1 || value2 || value3 >> value1이 true면 뒤에 value들은 true false 체크를 하지 않는다.
   연산을 많이 하는 함수나 expression을 가장 뒤에 배치하는 것이 효율적이다.
   

7. Equality

<script>
const stringFive = '5';
const numberFive = 5;

== loose equality
console.log(stringFive == numberFive); // true
console.log(stringFive != numberFive); // false

== strict equality
console.log(stringFive === numberFive); // false
console.log(stringFive !== numbereFive); // true

// object equality
const mia1 = { name: 'mia'};
const mia2 = { name: 'mia'};
const mia3 = mia1;
console.log(mia1 == mia2); // false
console.log(mia1 === mia2); // false
console.log(mia1 == mia3); // true

console.log(0 == false); // true
console.log(0 === false); // false
console.log('' == false); // true
console.log('' === false); // false
console.log(null == undefined); // true
console.log(null === undefined); // false
</script>

8. Conditional operators: if, else if, else

<script>
const name = 'mia';
if (name === 'mia') {
	console.log('Welcome Mia!');
} else if (name === 'coder') {
	console.log('You are amazing coder');
} else {
	console.log('unKnown');
}
</script>

9. Ternary operator: ?
   condition ? value1 : value2;
   간단한 if문을 만들고 싶을 때 사용.

<script>
console.log(name === 'mia' ? 'yes' : 'no');
</script>

10. Switch statement
    if문에서 else if를 많이 사용해야한다면 switch문을 사용하는 것이 좋음.

<script>
const browser = 'IE';
switch (browser) {
	case 'IE':
    	console.log('go away!');
        break;
    case 'Chrome':
    case 'Firefox':
    	console.log('I love you!');
        break;
    default:
    	console.log('same all!');
        break;
}
// default : 매칭되는 케이스문이 없을 때 실행되야 할 코드를 지정
</script>

11. Loops
    ** break나 continue를 사용해 loop를 끝낼 수 있다. break - loop를 끝내는 것, continue - 지금만 스킵하고 다음 스텝으로 넘어가는 것.

<script>
<!--while loop: 조건이 먼저 맞으면 그 다음에 블럭을 실행-->
let i = 3;
while (i > 0) {
	console.log(`while: ${i}`);
    i--;
} // while: 3 / while: 2/ while: 1

<!--do while loop: 블럭을 먼저 실행 시키고 그 다음에 조건이 맞는지 체크-->
let i = 3;
do {
	console.log(`do while: ${i}`);
    i--;
} while (i > 0); // do while: 3 / do while: 2 / do while: 1

<!--for loop(begin; condition; step)-->
for (let i = 3; i > 0; i -= 2) {
	console.log(`inline variable for: ${i}`);
} // inline variable for: 3/ inline variable for: 1

<!--nested loops-->
for (let i = 0; i < 10; i++) {
	for (let j = 0; j < 10; j++) {
     console.log(`i: ${i}, j: ${j}`);
    }
}// i: 0, j: 0 /.../ i: 0, j: 9 /.../ i: 9, j: 9 
</script>

12. typeof 연산자
    값 또는 변수가 어떤 데이터 타입인지 확인할 수 있다.

<script>
const msg = "message";

console.log(typeof msg); // string
console.log(typeof 100); // number
</script>