자바스크립트 연산자 Operator

 

 

 

자바스크립트의 ES5기반으로 한 기본 개념들입니다.  

공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다.

재배포 수정하지 마세요. 

 

 

 

---

연산자

• +, -, *, /, %
• >, >=, <, <=
• ==,!=, ===,!==
• 콤마, typeof, delete, void
• instanceof, in, new 등등

 

 

할당 연산자

• +=, -=, *=, /=, %= 
• <<=, >>=
• &=, ^=, |=
• 먼저=앞을 연산한 후 할당한다. 

 

 

연산

var value = "딸기"
var value2 = "2"
var result3 = 2 + 4 + value;
var result4 = 3 + value2;
console.log(result3);       //6딸기
console.log(typeof result3);        //string
console.log(typeof result4);        //32

 

숫자가 아닌 몇몇의 값은 연산하기 전에 숫자로 변환된다. 

• undefined : NaN
• null : 0
• true : 1
• false : 0
• string : 값이 숫자면 숫자로 연산된다. +연산자일 때는 기본적으로 +의 양쪽을 더하지만 한쪽이라도 숫자가 아니면 연결이 된다.

 

console.log(32-2);           //30
console.log(32-"2");         //30
console.log(32-true);        //31
console.log(32-false);       //32
console.log(32-"two");       //NaN

console.log(3*4);           //12
console.log(3*"4");         //12
console.log(3*true);        //3
console.log(3*false);       //0
console.log(3*"four");      //NaN
console.log(2.3*3);         //6.8999999995
console.log(2.3*10*3/10);   //6.9


console.log(0/0);           //NaN
console.log(1/0);           //Infinity
console.log(0/2);           //0
console.log(1/"딸기");      //NaN


console.log(5%2.5);             //0
console.log(5%2.3);             //0.4000000000036d
console.log(5*10-(2*2.3*10));   //0.4

 

• - 연산자 :  string 타입이지만 값이 숫자면 number타입으로 변환하여 뺜하다. 하나라도 숫자가 아닐 경우 NaN를 반환한다. 
• * 연산자 : string 타입이지만 값이 숫자면 number타입으로 변환하여 곱한다. 하나라도 숫자가 아닐경우 NaN를 반환한다.  소수 값 처리 때문에 연산 결과 소수 값이 생기는 것을 방지하기 위해 10을 곱해 소숫값없이 계산한 다음 10으로 다시 나눠준다. 
• / 연산자 :  string 타입이지만 값이 숫자면 number타입으로 변환하여 나눈다. 하나라도 숫자가 아닐 경우와 분자가 분모가 모두 0일 때 NaN를 반환한다.  분자가 0이면 0을 반환하고 분모가 0일 경우 Infinity를 반환한다. 
• % 연산자 : string 타입이지만 값이 숫자면 number타입으로 변환하여 나눈 다음 나머지를 구한다. 

 

 

단항 연산자

var result = "4"
console.log(typeof result);             //string
console.log(typeof +result);            //number
console.log(typeof Number(result));     //number
console.log(10 + -result);              //6
console.log(result);                    //4

 

• + 단항 연산자 : 값을 number 타입으로 변환한다. 
• - 단항연산자 : 값의 부호를 바꾼다. -면 +로 바꾸고 +면 -로 바꾼다. 연산할 때만 바꾸고 원래 값은 바뀌지 않는다. 

 

후치, 전치, 논리 Not 연산자

var value1 = "4"
console.log(value1++ +5);       //9
console,log(value1);            //3

var value2 = "3"
console.log(--value2 +5);       //7
console,log(value2);            //2


var value3 = true               
console.log(!value4);           //false
console,log(!!"T");             //undefined

 

• 후치 연산자 : value++, value-- 의 형태로 문장이 끝난 후(세미콜론이 끝난 후) 연산이 이루어진다. ++라면 1씩 증가하고 --라면 1씩 감소한다.
• 전치 연산자 : ++value, --value의 현태로 문장 안에서 먼저 연산이 이루어진다. ++라면 1씩 증가하고 --라면 1씩 감소한다. 
• ! 연산자 :! value의 형태로 식의 평과 결과를 true/false로 변환한 다음 true면 false로 false면 true로 반환한다. 원래 값은 바뀌지 않고 사용할 때만 변환한다. 

 

 

유니코드 

 

세계의 모든 문자를 통합화하여 코드화 한 것이다. 

언어뿐만 아니라 이모티콘도 포함되어있고 이모티콘은 각 브라우저마다 조금씩 다르게 보인다. 

코드값을 '코드 포인트'라고 한다. ( 0000 ~ FFFF, 10000 ~ 1 FFFF )

코드 포인트는 유니코드 컨소시엄 홈페이지에서 확인할 수 있다. http://www.unicode.org/

console.log("\u0031");                  //1

 

표기 방법: u와 숫자 형태로 이루어져 있으며 자바스크립트에서는 u앞에 역 슬래쉬(\)를 작성해야 한다. 만약 역 슬래쉬를 문자로 쓰고 싶다면 두 개를 써주면 된다.

 

 

관계 연산자 

console.log(1 < "2");                       //true
console.log(2  >= "4");                     //false

console.log("\u0031" >"\u0032");        //true
console.log("A" > "1");                 //true
console.log("가" >= "다");               //false
console.log("B12" > "B24");             //false

 

• <, >, <=, >= 연산자 , instanceof 연산자, in 연산자 
• 양쪽이 number 타입일 때 비교 값이 참이면 true, 거짓이면 false를 반환한다. 
• 한쪽이 string 타입이라면 false를 반환하고 양쪽이 모두 string 타입이면 유니코드 사전 순서로 문자 하나씩 비교한다.  

 

동등, 부등, 일치, 불일치 연산자

console.log(1 == "1");                      //true
console.log(1 != "1");                      //false
console.log(1 === "1");                     //false
console.log(1 !== "1");                     //true

let value;
console.log(value == undefined);            //true
console.log(value == null);                 //true
console.log(value === undefined);           //true
console.log(value === null);                //false

 

• == : 동등 연산자, 왼쪽과 오른쪽이 같으면 true, 다르면 false이다. 값 타입은 비교하지 않는다. 
• != : 부등 연산자, 왼쪽과 오른쪽이 다르면 true, 같으면 true이다. 
• === : 일치 연산자, 왼쪽과 오른쪽의 값과 타입이 모두 같으면 true, 하나라도 다르면 false이다. 
• !== : 불일치 연산자, 값, 또는 타입이 다르면 true, 같으면 false이다. 

 

 

|| 연산자, && 연산자

var a , b = 0, c= 3;
console.log(a || b || c);               //3   
console.log(a || b);                    //undefined
console.log( b === 0 || d === 1);       //true
console.log(b && c);                    //3
console.log(a && b && d);               //false

 

• || : or 연산자, 식의 평가 결과가 하나라도 true면 true이고 전체가 모두 false이면 false이다. 왼쪽 결과가 true면 그 뒤는 비교하지 않는다. 
• && : and 연산자, 식의 평가 결과가 모두 true면 true 하나라도 아니면 false이다. 왼쪽 결과가 false면 그 뒤는 비교하지 않는다. 

 

 

조건 연산자

console.log(1 === "1" ?"smae" :"different");
console.log(1 !== "1" ?"smae" :"different");

 

• 조건? 문장 1 :문장 2
• 조건을 먼저 평가하고 true이라면? 뒤의 결과를 반환하고 false라면 :뒤의 결과를 반환한다.