IT/JS

Operator, Control flow statement

프티 2021. 5. 20. 15:06
반응형

1. string concatenation 문자열 연결

  • 문자열과 숫자 연결의 경우 + 연산자를 이용
    console.log('my'+'cat');
    console.log('1'+2);​

  • 변수를 출력하는 경우 ( ` ` )안에 위치
    console.log(`string literals: 1+2 = ${1 + 2}`);
    console.log('hatae\'s \nbook');​
  •  ( ' ' )안에 '를 문자열로 입력해야하는 경우 \사용
    console.log('hatae\'s \nbook');​

2. numeric operator

  • 사칙연산 및 거듭제곱(**), 나머지(%)를 활용
    console.log(1+1);
    console.log(2**2);​

3. increment and decrement operators

let a = 3;
  • 증감된 값 적용
    const aplus = ++a; // a : 4
    console.log(` aplus:${aplus} `); // aplus : 4
  • 증감되기 전 값 적용 (위에서 증가된 a값 이어서 적용)
    const aaplus=a++; // a : 5
    console.log(` aaplus:${aaplus} `); // aaplus : 4​

4. assignment operators

  • (정의될 값) (연산기호-등호) (연산될 값)
    let x =3;
    let y =4;
    
    x += y; // x + y값을 x에 정의
    console.log(x); // 7
 

5. comparison operators

  • 비교 부호 사용(<, >, <=, >=)
    console.log(10>=6); // true

6. logical operators

  • 조건에 맞다면 true를 반환한다.
  • ||의 경우, true를 찾는 즉시 중단되며 true를 반환한다.
    조건문에서는 함수를 최대한 마지막 순서에 배치해야 효율이 높다.
  • &&의 경우, false를 찾는 즉시 중단되며 false를 반환한다.
    object && object.something // 이를 활용하여 object가 false(빈 객체)가 아니라면 true를 반환하게 할 수 있다.​
  • !( not )
    let value1 = true;
    console.log(!value1); // false​

7. equality

const strfive='5';
const numfive=5;
  • loose equality -> type이 관여하지 않는다.
    console.log(strfive == numfive); // true
    console.log(strfive != numfive); // false
  • strict equality -> type이 관여한다.
    console.log(strfive === numfive); // false
    console.log(strfive !== numfive); // true
  • object equality by reference
    const ha1 = {name:'ha'};  // ha1 - ref1 - name - ha
    const ha2 = {name:'ha'};  // ha2 - ref2 - name - ha
    const ha3 = ha1;          // ha3 - ref1 - name - ha​
    ref를 비교하기 때문에 ha3과 ha1은 strict하게 갖다고 할 수 있다.
    console.log(ha1 == ha2); // true
    console.log(ha1 === ha2); // false
    console.log(ha1 === ha3); // true

8. 조건문

  • if,else if, else가 있으며, if와 else는 두 번까지 중복사용 가능하다.
    if (조건) {
    	수행할 코드;
    };​

9. ternary operator: ? (삼항 조건 연산자)

  • condition ? value1 (yes) : value2 (no);
    const name = 'hty';
    console.log(name === 'hty' ? 'yes' : 'no'); // yes​

10. switch statement

  • 여러 if를 사용하여 체크해야할때 유용하다.
    const browser = 'ie';
    switch (browser){
        case 'a':
            console.log('go away!');
            break;
        case 'chrome': //같은 출력을 원하면 겹쳐서 작성하면 된다.
        case 'firefox':
            console.log('gooood!');
            break;
        default: //else와 같은 의미
            console.log('same all!');
            break;
    }​
    break;를 반드시 사용해야 목적에 맞는 결과 값을 얻을 수 있다.

11. loops

조건에 부합하기 전까지 반복문 수행

 

사용되는 연산자

break : 루프 중지 후 탈출

continue : 루프 중지 없이 다음 조건문으로 넘어감

 

  • while
    let i = 3;
    while (i>0){ // false가 될때까지 반복
        console.log(`while: ${i}`);
        i--;
    }​
  • do while
    let i = 3;
    do{ //조건에 일치하는 값만 출력하려면 do while을 사용
        console.log(`do while: ${i}`);
        i--;
    }while (i>0);
    
    /* 결과
    do while: 3 
    do while: 2 
    do while: 1
    */
  • for
    for (i=3;i>0;i--){
        console.log(`for:${i}`);
    }
    for (let i=3;i>0;i=i-2){ //inline variable declaration
        console.log(`for:${i}`);
    }​
  • nested loops ( O(n^2)형 구조는 cpu에 좋지 않다고한다. )
    for(let i =0;i<10;i++){
        for(let j=0;j<10;j++){
            console.log(` ${i} x ${j} = ${i*j}`); // 구구단
        }
    }​

 

다음은 반복문을 활용한 코드를 작성해보았다.

 

//1. 0부터 10까지 반복하되 짝수만 출력
for(let i=0;i<=10;i++){
    if(i==0 || i%2 !== 0){
        continue;
    }
    else if(i%2 == 0){
        console.log(`${i}`);
    }
}
//2. 0부터 10까지 반복하되 8이 되면 중지
for(let i=0;i<=10;i++){
    if(i==8){
        break;
    }
    console.log(`${i}`);
}

1번 결과:

 

 

 

2번 결과:

반응형

'IT > JS' 카테고리의 다른 글

Array  (0) 2021.05.20
Function  (0) 2021.05.20
Class  (0) 2021.05.20
변수타입, 데이터타입, let vs var, hoisting (드림코딩 by 엘리)  (0) 2021.05.06
main.js와 html 구현을 효과적으로 할 수 있는 방법(by 드림코딩 엘리)  (0) 2021.05.06