베짱이와 노는 개미

웹개발(javascript)프로젝트 챗봇만들기-#6 연산자 본문

웹개발(JAVASCRIPT)프로젝트-챗봇만들기

웹개발(javascript)프로젝트 챗봇만들기-#6 연산자

jsistop16 2021. 9. 15. 11:31

연산자란 프로그래밍언어로 수학적 연산을 도와주는 키워드 라고 생각하면 될것같다.

 

연산자에는 5가지 종류가 있다.

 

산술, 대입, 증감, 비교, 논리 연산자 이다.

 

1. 산술연산자

 

사칙연산을 다루는 연산자이다. + - * / % 가 있다.

 

+는 더하기

-는 뺴기

*는 곱하기

/는 나누기

%는 나눈결과 몫 을 계산해준다

 

2. 대입연산자

 

=이다.

 

var x=10; 이라고 하면

 

x와 10은 같다 라는 의미 보다 x에 10을 대입한다라는 의미로 이해해야한다.

 

대입연산자=는 산술연산자와 함께 쓰일수 있는데 그 의미는 다음과 같다

 

x+=10 이렇게 같이 쓰면 x=x+10과 같다 즉, x에 10을 더해서 다시 x에 대입한다. 라는뜻이다

 

x=x+10이라고 써도 되지만 간단하게 x+=10이라고 쓴다

 

x-=10

x*=10

x/=10

x%=10 이런식으로 모두 가능하다.

(x%=10같은 경우는 x=x%10 다시말해서 x를 10으로 나눈 몫을 x에 대입)

 

3. 증감연산자

변수를 1씩 증가 혹은 감소시킬떄 사용하는 연산자이다.

 

var x=10; // x를 선언함과 동시에 10으로 초기화

 

x++; //x를 1증가

x--; //x를 1감소

++x; //x를 1증가

--x; //x를 1감소

 

여기서 x++; 와 ++x;의 차이가 뭔지 궁금할것이다.

 

바로 연산의 순서이다. x++;같은경우는 연산을 먼저 수행한 후에 x값을 1증가한다.

 

반면 ++x;같은 경우는 x값을 먼저 1 증가 후에 연산을 수행한다.

 

이해하기 힘들수있다. 내가 예제를 만들어봤다. 다음 코드들을 복붙해서 html파일을 열어서 실습해 보면 이해될것이다.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <script src="./practiceday6.js"></script>
        <button onclick="console1()">++x</button>
        <button onclick="console2()">x++</button>
    </body>
</html>

->html코드

var x = 0;


function console1(){
    console.log(++x);
}

function console2(){
    console.log(x++);
}

function init(){
    x=0;
}

->javascript코드

 

이러면 버튼이 두개 생길것이다. ++x라는 버튼은 말그래도 ++x를 구현하는 버튼이고 x++버튼은 x++를 구현하는 버튼이다.

 

초기 x값은 0으로 설정했다

 

처음에 ++x버튼을 먼저 누르면 1이 콘솔창에 뜰것이다. x를 먼저 증가시킨후에 콘솔창에 출력한것이다.

 

다시 새로고침을 누르고 웹페이지 처음으로 돌아가자

 

이젠 처음에 x++버튼을 눌러보자 그럼 0이 뜰것이다. x가 1증가해서 x값이 1이 증가하긴한거다. 하지만 콘솔창에 먼저

띄운후에 x값을 1증가시킨것이다.

 

그리고 다시 x++ 버튼을 눌러보면 x값에 저장된 1이 이제서야 콘솔창에 뜰것이다. 그리고 다시 1증가해서 2가 x값에

 

저장된 상태가 될것이다.

 

그럼 다시 새로고침 누르고 처음 상태로 돌아가보자 x++버튼을 누르고 ++x버튼을 누르면 몇이 나올까

 

정답은 2이다. x++버튼을 누름(0출력 x값은 1) 그다음 ++x를 누르면(2가 바로 출력 x값에는 2저장)이렇게 되는것이다.

 

1이 출력되지 않는것이다. 연산순서에 따라 이런결과가 나오는것이다.

 

4.비교연산자

비교 연산자는 변수를 변화시키는 연산자는 아니다. 말그대로 비교를 해서 결과값은 true/false로 나타내주는 연산자이다.

var x = 10;
var y = 12;
var str1 = "10";

x == y; // false
x != y; // true
x >= y; // false
x <= y; // true
x == str1; // true 자료형은 다르지만 값이 10으로 동일
x === str1; // false 값은 동일하지만 자료형이 다름
x !== str1; // true

예시 js코드이다. 비교연산자에는

 

== : 값이 동일한가

!= : 값이 다른가

>= : 크거나 같은가

<= : 작거나 같은가

=== : 값과 자료형까지 동일한가

!== : ===의 여사건(둘중 하나라도 다른가)

 

5. 논리연산자

논리식을 판단하여 true,false를 판단하는 연산자이다. && , || , ! 이렇게 3가지가 있다

 

&& : 두 논리식이 모두 참이어야 true반환

|| : 두 논리식 중 하나만 참이어도 true반환

! : 논리식이 참이면 false, 거짓이면 true을 반환(반대를 반환)

 

&&와 ||는 두개의 논리식을 비교하는것이고

 

!는 한개의 논리식을 다루는 연산자이다. 

 

 

이상으로 연산자에 대해서 5가지 종류를 알아보았다. 끝

'웹개발(JAVASCRIPT)프로젝트-챗봇만들기' 카테고리의 다른 글

웹개발(javascript)프로젝트 챗봇만들기-#8 객체  (0) 2021.09.23
웹개발(javascript)프로젝트 챗봇만들기-#7 조건문, 반복문  (0) 2021.09.17
웹개발(javascript)프로젝트 챗봇만들기-#5 데이터타입과 변수선언  (0) 2021.09.14
웹개발(javascript)프로젝트 챗봇만들기-#4 콘솔  (0) 2021.09.13
웹개발(javascript)프로젝트 챗봇만들기-#3 자바스크립트적용해보기  (0) 2021.09.10
'웹개발(JAVASCRIPT)프로젝트-챗봇만들기' Related Articles more