위챗 미니프로그램 가이드 : 구문 syntax 2/2

유튜브 강좌 : youtu.be/qbncWPR8yMQ

 

- 연산자

산술 연산자

+ : 덧셈

- : 뺄셈

* : 곱셈

** : 지수연산(ES2016)

/ : 나눗셈

% : 나머지

++ : 증가

-- : 감소

 

피연산자 뒤에 붙여(예: x++) 접미사로 사용한 경우 증가하기 전의 값을 반환합니다.

var x = 3;
var y = x++; // y = 3, x = 4

console.log(y);
console.log(x);

피연산자 앞에 붙여(예: ++x) 접두사로 사용한 경우 증가한 후의 값을 반환합니다.

var a = 2;
var b = ++a; // a = 3, b = 3

console.log(a);
console.log(b);

 

할당 연산자

=  : x = y  : x = y

+= : x += y  : x = x + y

-=  : x -= y  : x = x - y

*=  : x *= y  : x = x * y

/=  : x /= y  : x = x / y

%=  : x %= y  : x = x % y

**= : x **= y : x = x ** y

var x = 10;
x += 5;

console.log(x);

 

문자열 연산자

+ : 연산자는 문자열 변수를 추가(연결)하는 데 사용.

var txt1 = "hello";
var txt2 = "world";
var txt3 = txt1 + " " + txt2; //hello world

console.log(txt3);

var txt1 = "What a very ";
txt1 += "nice day";

console.log(txt1);//What a very nice day

console.log(5 + 5);//10
console.log("5" + 5);//55
console.log("Hello" + 5);//Hello5

 

비교 연산자

==  : 같다 (데이터 유형을 자동으로 변환 한 다음 비교)

=== : 같다 (데이터 유형이 일치하지 않으면 false가 리턴되고, 동일한 경우 비교가 수행)

!=  : 같지 않다 (데이터 유형을 자동으로 변환 한 다음 비교)

!== : 같지 않다 (데이터 유형이 일치하지 않으면 false가 리턴되고, 동일한 경우 비교가 수행)

>  : 크다

<  : 작다

>=  : 크거나 같다

<=  : 작거나 같다

?  : 조건부 삼항 연산자는 세 개의 피연산자를 취할 수 있는 유일한 연산자입니다. 보통 if 명령문의 단축 형태로 쓰입니다.

    : 조건 ? 참일때 : 거짓일때

console.log(2 > 5); // false
console.log(5 >= 2); // true
console.log(7 == 7); // true
console.log(false == 0); // true
console.log(false === 0); // false

예외 : 특수 숫자 NaN이 자신을 포함하여 다른 모든 값과 같지 않다

NaN을 결정하는 유일한 방법은 isNaN () 함수를 사용

console.log(NaN === NaN); // false
console.log(isNaN(NaN));// true

삼항 연산자

var age = 23;

console.log(age > 18 ? "OK, you can go." : "Sorry, you are much too young!");//OK, you can go.

 

논리 연산자

&& : and

|| : or

! : not

console.log(true && true); //true
console.log(true && false); //false
console.log(false && true && false); //false
console.log(false || false); //false
console.log(true || false); //true
console.log(false || true || false); //true
console.log(!true); //false
console.log(!false); //true
console.log(!(2 > 5)); //true

var x = 6, y = 3;
console.log(x < 10 && y > 1);//true
console.log(x == 5 || y == 5);//false
console.log(!(x == y));//true

 

 

- 조건문

if()

if문은 if (조건) { 내용 } 으로 구성되며 조건이 true면 내용이 실행된다.

 

- 기본

if (조건식) {

    // 조건식이 참이면 이 블록이 실행된다.

} else {

    // 조건식이 거짓이면 이 블록이 실행된다.

}

 

- 다중 조건식

if (조건식1) {

    // 조건식1이 참이면 이 블록이 실행된다.

} else if (조건식2) {

    // 조건식2이 참이면 이 블록이 실행된다.

} else if (조건식3) {

    // 조건식3이 참이면 이 블록이 실행된다.

} else {

    // (조건식1,조건식2,조건식3) 모두 거짓이면 이 블록이 실행된다.

}

 

- 다중 if

if (조건식) {

    // 조건식이 참이면 이 블록이 실행된다.

    if (조건식) {

        // 조건식이 참이면 이 블록이 실행된다.

    } else {

        // 조건식이 거짓이면 이 블록이 실행된다.

    }

} else {

    // 조건식이 거짓이면 이 블록이 실행된다.

}

    var num = 70;
    if (num >= 10) {
      console.log("10보다 큽니다");
    } else {
      console.log("10보다 작습니다.");
    }

    var name = "lee"
    if (name === "kim") {
      console.log("kim씨 군요!");
    } else if (name === "lee") {
      console.log("lee씨 군요!");
    } else if (name === "park") {
      console.log("park씨 군요!");
    } else {
      console.log("모르겠습니다!");
    }

    var age = 3;
    if (age >= 18) {
      console.log("성년이군요!");
    } else {
      if (age >= 6) {
        console.log("청소년이군요!");
      } else {
        console.log("유아이군요!");
      }
    }

 

switch()

switch ~ case문은 if ~ else와 비슷하다.

case 뒤에는 name에 해당하는 조건을 적고 그 아래에 실행할 내용을 적는다.

default는 else처럼 어떤 조건에도 해당이 안 될 때 실행된다.

switch문 사용시 주의해야할 점 :

break을 적지 않으면 해당 case 아래로 모든 내용이 실행되기 때문에 case 하나마다 내용 밑에 break를 적어줘야한다.

 

break문 vs continue문

break : 반복문 전체 종료

continue : 반복 구문 단위로 종료

    for (var i = 0; i < 5; i++) {
      if (i === 2) {
        break;
      }
      console.log(i);
    }
    //출력 0,1

    for (var i = 0; i < 5; i++) {
      if (i === 2) {
        continue;
      }
      console.log(i);
    }
    //출력 0,1,3,4


    var name = "lee"
    switch (name) {
      case "kim": // c가 10일 때
        console.log("kim씨 군요!");
        break;
      case "lee": // c가 9일 때
        console.log("lee씨 군요!");
        break;
      case "park": // c가 8일 때
        console.log("park씨 군요!");
        break;
      default: // 위의 경우에 해당하지 않을 때
        console.log("모르겠습니다!");
    }

 

 

- 반복문

for()

조건이 거짓으로 판별될 때까지 반복

for ( 초기; 조건; 업데이트 ) {

    반복될 문장

}

    for (var i = 1; i <= 10; i++) {
      console.log(i);//1~10까지 출력한다.
    }

다중 for문

구구단을 출력해보자

    for (var i = 1; i <= 9; i++) {
      console.log(i + '단을 출력합니다');
      for (var j = 1; j <= 9; j++) {
        console.log(i + '*' + j + '=' + i * j);
      }
    }

무한루프 : 주의!!!

    var x = 0;
    for (; ;) { //무한루프
      if (x > 100) {//if문을 나갈 조건
        break; //if문을 빠져나감
      }
      x++;
    }
    console.log(x);

for..in문이란? 객체의 열거 속성을 통해 지정된 변수를 반복

for ( 변수 in 객체 ) {

    반복 실행 구문

}

 

배열을 이용한 for문

    var array = ['Apple', 'Google', 'Microsoft'];
    for (var i = 0; i < array.length; i++) {
      console.log(array[i]);
    }
    //Apple
    //Google
    //Microsoft

배열에 대한 for .. in문

    var array = ['Apple', 'Google', 'Microsoft'];
    for (var key in array) {
      console.log("key: " + key + "; value: " + array[key]);
    }
    //key: 0; value: Apple
    //key: 1; value: Google
    //key: 2; value: Microsoft

Object에 대한 for .. in문

    var object = {
      name: 'kim',
      age: 20,
    };
    for (var key in object) {
      console.log("key: " + key + "; value: " + object[key]);
    }
    //key: name; value: kim
    //key: age; value: 20

for..of문이란? 반복가능한 객체(Array, Map, Set, String, TypeArray, arguments 객체등)를 반복

for ( 변수 of 반복되는 열거가능한 속성이 있는 객체 ) {

    반복 실행 구문

}

문자열에 대한 for..of문

    var iterable = "abc";
    for (var value of iterable) {
      console.log(value);
    }
    // a
    // b
    // c

배열에 대한 for..of문

    var iterable = [10, 20, 30];
    for (var value of iterable) {
      console.log(value);
    }
    // 10
    // 20
    // 30

forEach문이란? 오직 Array객체에서만 사용 가능한 메서드이며 (ES6부터는 Map, Set을 지원) 배열의 요소들을 반복하여 작업을 수행

배열의 첫번째부터 마지막까지 반복하면서 item을 꺼낼 수 있다.

item: 배열의 각각의 item

index: 배열의 index

arr[index + 1] : 배열 자체를 가리킨다.

    var arr = ['가', '나', '다'];
    arr.forEach(function (item, index, arr) {
      console.log(item, index, arr[index + 1]);
    });
    //가 0 나
    //나 1 다
    //다 2 undefined

 

while()

while문이란? 어떤 조건문이 참이기만 하면 문장을 계속해서 수행

while(조건 구문) {

    반복 구문

}

 

    var n = 0;
    var x = 0;
    while (n < 3) {
      n++;
      x += n;
      console.log(x);
    }
    // 1
    // 3
    // 6

주의!! 무한반복!!

    //while (true) {
    //  console.log("Hello, world");
    //}

do..while문이란? 특정한 조건이 거짓으로 판별될 때까지 반복

do

    반복 구문

while (조건 구문);

    var i = 1;
    do {
      console.log("i = " + i);
      i++;
    } while (i < 4);
    // i = 1
    // i = 2
    // i = 3