안녕하세요 풀스택 개발자를 꿈꾸는 진쓰입니다.

자바스크립트 2장 - 자바스크립트 연산자 포스팅 시작하겠습니다.


목차입니다.

 (1).산술연산자

(2). 대입연산자

(3). 증감연산자

(4). 비교연산자

 

(5). 논리연산자

(6). 비트연산자

(7). 삼항연산자

(8). 문자연결연산자



(1). 산술연산자

기호

예제

결과(ans)

덧셈

+

ans = 10 +30

40

뺄셈

-

ans= 20 - 10

10

곱셈

*

ans = 30 * 10

300

나눗셈

/

ans= 20 / 10

2

나머지

%

ans = 20 % 10

0

 

 

자바스크립트 연산자 예제코드

결과화면

 

<html>

<head><title> </title>

<script language="javascript">

<!--

document.write("자바스크립트 예제"+"<br>");

ans = 20 + 10;

document.write(ans+"<br>");

ans = 20 - 10;

document.write(ans+"<br>");

ans = 20 * 10;

document.write(ans+"<br>");

ans = 20 / 10;

document.write(ans+"<br>");

ans = 20 % 10;

document.write(ans+"<br>");

//-->

</script>

</head>

<body>

</body>

</html>

 

 

 

 

(2). 대입연산자

기호

예제

대입연산자이용

덧셈대입

+=

ans = ans +10

ans+=10

뺄셈대입

-=

ans = ans – 7

ans-=7

곱셈대입

*=

ans = ans * 5

ans*=5

나눗셈대입

/=

ans = ans / 3

ans/=3

나머지대입

%=

ans = ans % 5

ans%=5

 

 

 

예제코드 

결과 

 

<html>

<head><title> </title>

<script language="javascript">

 

ans = 20;

document.write("자바스크립트 예제"+"<br>");

ans +=10;

document.write(ans+"<br>");

/*   주석처리하였습니다. 실습해보세요.

ans -=10;

document.write(ans+"<br>");

ans *=10;

document.write(ans+"<br>");

ans /=10;

document.write(ans+"<br>");

ans %=10;

document.write(ans+"<br>");

*/

</script>

</head>

<body>

</body>

</html>

 

 

 

 

(3). 증감연산자

-전위 연산자

   피연산자의 앞쪽에 위치한다.

 

-후위연산자

   피연산자의 뒤쪽에 위치한다.

 

•종류  :  ++  ,  --
•(예) ans++,ans--, ++ans,--ans

예제코드 

결과 

 document.write("증감연산자 예제"+"<br>");
   a = 10;
   document.write(++a +"<br>");
   document.write(a++ +"<br>");
   document.write(a +"<br>");
   
   //a == 12
   b = 10;
  
   document.write(++a + b++ + "<br>"); //13 + 10 =23
   
   //b=11
   document.write(b + "<br>");

 

 

 

(4). 비교연산자

 

 

기호

예제

A=30, B=10인경우

작다

<

A < B

false

크다

>

A > B

true

작거나같다

<=

A <= B

false

크거나 같다

>=

A >= B

true

같다

==

A == B

false

같지 않다

!=

A != B

true

 

 예제

결과 

 document.write("비교연산자 예제"+"<br>");
   a = 10;
   b = 5;
   
   c = a > b;
   document.write("1." + c + "<br>");
   
   c = a < b;
   document.write("2." + c + "<br>");
   
   c = a == b;
   document.write("3." + c + "<br>");
  
   c = a != b;
   document.write("4." + c + "<br>");
  

 

 

 

 

(5). 논리연산자

- and: &&   둘다 맞아야 true, 하나라도 false면 false 입니다.

- or:     ||     하나라도 true면 true 입니다.

 

 

A

B

A && B

A || B

False

False

False

False

False

True

False

True

True

False

False

True

True

True

True

True

예제 

결과 

 document.write("논리연산자 예제"+"<br>");
   //0 false
   //0이외의 수 true
   c =  (!2 || 3) && (!0);
   document.write(c+"<br>");
   
   document.write("비트연산 예제"+"<br>");
   c = 10;
   //   0000 1010
   c = c << 2;  //   0010 1000  = 32 +8 =40
   document.write(c+"<br>");
   //10*2*2
   
   c = 12;
   // 0000 1100  
   c = c >> 2;    // 0000 0011   => 3
   document.write(c+"<br>");

 

 

 


(6). 비트연산자

 

(6)-1. 쉬프트 연산자

 - 오른쪽으로 이동과 왼쪽으로 이동 시킬 수 있습니다.

 

연산자

뜻

예

의미

>>

오른쪽 이동

10 >> 2

10의 이진수표현에서 오른쪽으로 2칸 이동

<<

왼쪽 이동

10 << 2

10의 이진수표현에서 왼쪽으로 2칸 이동

 

 

 

예제 

결과 

 

 

 

   a=10;
   a = a>>2;
   document.write(a +"<br>");
   a=10;
   a <<= 2;   // a = (a<<2) 와 같다.
   document.write(a +"<br>");

 

 

 

 

 

 

 

 

 

 

(6)-2. 비트논리연산자

-  &(비트 AND), |(비트 OR), ^(비트 XOR), ~(비트 NOT) 등이 있다.


 

비트끼리의 and, or, xor, ~연산을 진행한다.

 

 


(7). 3항연산자


  조건   ?   수식1 : 수식2

 

조건이 참이면 수식1이 실행.

조건이 거짓이면 수식2가 실행 

 

예제 

결과 

 document.write("3항연산자 예제"+"<br>");
   c = 0;
   (10 < 50) ? c=5 : c=10;
   document.write(c+"<br>");
   
   (10 > 50) ? c=5 : c=10;
   document.write(c+"<br>");
   

 

 

 

 

.

(8). 문자연결연자

 

+ 기호 사용 합니다.

 

ex) A + "ans" (A에 30이 저장된 경우)

 

30ans가 출력됩니다.

 

 예제

결과 

   A = 30;
   B = "ans";
   document.write(A+B +"<br>");
   
   C = A + B;
   document.write(C +"<br>");

 

 

 

 

 

'웹 (WEB) > 자바스크립트' 카테고리의 다른 글

자바스크립트 객체, 배열 (6장)  (2) 2017.06.12
자바스크립트 함수의개요 및 내장함수(5장)  (0) 2017.06.11
자바스크립트 제어문2 반복문(for, while) (4장)  (0) 2017.06.09
자바스크립트 제어문(1), if, switch (3장)  (0) 2017.06.09
자바스크립트 개요(1장)  (0) 2017.06.08

+ Recent posts

티스토리툴바