프로그래밍 언어/Javascript

operator, if, for loop

김곰댕 2021. 8. 19. 17:26
728x90
<!DOCTYPE html>
<html lang = "en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" consent="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <script src="operator.js"></script>
    </head>
    <body></body>
</html>

1. String concatenation

//String concatenation
console.log('my' + 'cat'); //+기호를 통해 문자열과 문자열을 합해서 새로운 문자열을 만들 수 있음
console.log('1' + 2); //문자열에 숫자를 더하면 숫자가 문자열로 변환되어 합해짐
console.log(`string literals : 1 + 2 = ${1 + 2}`);

출력 결과

2. Numberic operators

//Numberic 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

출력 결과

3. Increment and decrement operators

//Increment and decrement operators
let counter = 2;
const preIncrement = ++counter; //preIncrement
//counter = counter + 1;
//preIncrement = counter; //값을 먼저 1 올리고 preIncrement에 할당
console.log(`preIncrement: ${preIncrement}, counter: ${counter}`);

const postIncrement = counter++; //postIncrement
//postIncrement = counter;
//counter = counter + 1; //postIncrement에 먼저 할당하고 값을 1 올림
console.log(`postIncrement: ${postIncrement}, counter: ${counter}`);

const preDecrement = --counter; //preDecrement
//counter = counter - 1;
//preDecrement = counter; //값을 먼저 1 내리고 preDecrement에 할당
console.log(`preDecrement: ${preDecrement}, counter: ${counter}`);

const postDecrement = counter--; //postDecrement
//postDecrement = counter;
//counter = counter - 1; //postDecrement에 먼저 할당하고 값을 1 내림
console.log(`postDecrement: ${postDecrement}, counter: ${counter}`);

출력 결과

4. Assignment operators

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

5. Comparison operators

//Comparison operators
console.log(10 < 6); //작은 경우
console.log(10 <= 6); //작거나 같은 경우
console.log(10 > 6); //큰 경우
console.log(10 >= 6); //크거나 같은 경우

출력 결과

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

//Logical operators: || (or) , && (and) , ! (not)
const value1 = false;
const value2 = 4 < 2;

// || (or) 어떤것이든 하나라도 true이면 true
console.log(`or: ${value1 || value2 || check()}`); //check()같은 함수호출을 제일 마지막에 배치하는것이 효율이 좋음

function check()
{
    for(let i = 0; i<10; i++)
    {
        //wasting time
        console.log('😱');
    }
    return true;
}

// && (and) 모두 다 true 일 경우에만 true
console.log(`and: ${value1 && value2 && check()}`); //check()같은 함수호출을 제일 마지막에 배치하는것이 효율이 좋음

function check()
{
    for(let i = 0; i<10; i++)
    {
        //wasting time
        console.log('😱');
    }
    return true;
}

//! (not)
console.log(!value1);

출력 결과

7. Equality

//Equality
const stringFive = '5';
const numberFive = 5;

// == (타입이 달라도 문자열 안의 5를 숫자로 인식해서 같다고 생각)
console.log(stringFive == numberFive); //같으면 true
console.log(stringFive != numberFive); //같지않으면 true

// === (타입을 신경써서 타입이 다르면 다른애)
console.log(stringFive === numberFive);
console.log(stringFive !== numberFive);

출력 결과

Equality 예시 (1)
//Equality 예시 (1)
const ellie1 = {name: 'ellie'};
const ellie2 = {name: 'ellie'};
const ellie3 = ellie1;
console.log(ellie1 == ellie2); //false
console.log(ellie1 === ellie2); //false
console.log(ellie1 === ellie3); //true

출력 결과

Equality 예시 (2)
//Equality 예시 (2)
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

출력 결과

8. Conditional operators: if , else if, else

//Conditional operators: if
//if , else if, else
const name = 'ellie';
if (name === 'ellie')
{
    console.log('Welcome, Ellie!');
}
else if (name === 'coder')
{
    console.log('You are amazing coder');
}
else
{
    console.log('unkwnon');
}

출력 결과

9. Ternany operator : ?

condition ? value1 : value2
//Ternany operator: ?
console.log(name === 'ellie' ? 'yes' : 'no'); //name이 ellie이면 yes, 아니면 no (간단하게 작성한 if)

출력 결과

10. Switch statement

//Switch statement
//else if를 사용할 일이 많은 경우 switch를 사용하는것을 권장
const browser = 'IE';
switch (browser)
{
    case 'IE':
        console.log('go away!');
        break;
    case 'Chrome': //Chrome이거나 Firefox인 경우에는 same all! 출력 
    case 'Firefox':
        console.log('same all!');
        break;
    default:
        console.log('same all!');
        break;
}

출력 결과

11. Loops

(1) while

//while
//조건을 검사한 다음 블럭을 실행
let i = 3;
while (i>0)
{
    console.log(`while: ${i}`);
    i--;
}

출력 결과

(2) do - while

//do-while
//먼저 한번 블럭을 실행한 다음 조건을 검사
do
{
    console.log(`do while: ${i}`);
    i--;
}while (i>0);

출력 결과

(3) for loop

//for loop
//for(begin; condition; step)
for(i=3; i>0; i--)
{
    console.log(`for: ${i}`);
}

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

출력 결과

(4) nested loops

//nested loops
for(let i = 0; i < 10; i++)
{
    for (let j = 0; j<10; j++)
    {
        console.log(`i: ${i}, j:${j}`);
    }
}
break 예시

break : 루프를 아예 끝내는것

문제 : 숫자 0~10까지 출력하는데 8을 만나면 그만

for(let i = 0; i<=10; i++)
{
    if(i > 8)
    {
        break;
    }
    console.log(`q1: ${i}`);
}

출력 결과

continue 예시

continue : 해당 부분만 스킵

문제 : 숫자 0~10까지 짝수인 부분만 출력

for(let i = 0; i<=10; i++)
{
    if(i%2 !== 0)
    {
        continue;
    }
    console.log(`q2: ${i}`);
}

출력 결과

728x90
저작자표시 (새창열림)