6. Javascript 연산자

 

' + ' 연산자

Javascript의 ' + ' 연산자는 더하기 / 문자열 연결 연산을 수행합니다. 다른 언어와 비슷한 기능을 하기 때문에 특이 사항은 없습니다. 물론, 피연산자가 모두 number일 때 더하기 연산이 수행되고 나머지의 경우 문자열 연결 연산자로 사용됩니다.

 

var add1 = 1 + 99;
var add2 = 'just' + 'music';
var add3 = 1 + 'life';
var add4 = 'life' + 1;

console.log(add1);
console.log(add2);
console.log(add3);
console.log(add4);

// 100
// justmusic
// 1life
// life1

 

 

---

 

typeof 연산자

typeof 연산자는 피연산자의 데이터 타입을 문자열 형태로 리턴하는 연산자입니다. 아래와 같이 타입 별 typeof연산자 실행 결과를 확인해 둡시다. 특히, null / 배열 / 함수의 데이터 타입을 착각하기 쉬우니 주의!

 

타입	종류	typeof 출력
기본타입	숫자	number
	문자열	string
	불린값	boolean
	null	object
	undefined	undefined
참조타입	객체	object
	배열	object
	함수	function

 

 

---

 

동등 연산자( == )와 일치 연산자( === )

Javascript에서 두 값이 동일한지 여부를 확인하는 연산자입니다. 두 연산자 모두 "값을 비교하여, 결과를 boolean으로 출력한다."는 동일한 동작을 갖고있는데요, 차이점은 무엇일까요? 아래 예시를 살펴보겠습니다.

 

console.log(100 == '100');
console.log(100 === '100');

// true
// false

 

위의 결과를 보시면, 같은 비교임에도 불구하고, 동등 연산자의 경우 'true'로 출력하고 일치 연산자의 경우 'false'로 출력하였습니다. 동등 연산자의 경우 피연산자의 타입이 다른 경우에는 일정 규칙에 따라 타입을 통일하여 비교합니다. 반면 일치 연산자는 타입을 변경하지 않습니다. 

 

이에 따라 일치 연산자의 기준에서는 number인 100과 string인 '100'은 엄연히 다른 값이므로, 비교한 결과를 false로 출력하는 것이지요. 

 

사실 Javascript를 비롯한 대부분의 프로그래밍 언어에서의 작동 방식을 감안하면, 일치 연산자의 방식이 더 적합하다고 볼 수 있습니다. 그래서 특별한 경우가 아니라면 Javascript에서 값의 비교는 일치 연산자를 활용하는 것을 권장하고 있습니다. 

 

 

---

 

' !! ' 연산자

!!연산자는, 피연산자를 boolean 값으로 변환하여 출력하는 역할을 합니다. 일반적으로 사용하는 '!'는 대부분 피연산자의 boolean 값을 반대로 출력합니다. 하지만 '!!'는 피연산자의 boolean을 명확하게 출력하는 것이 목적입니다. 주로 아래와 같은 규칙을 갖습니다. 

 

* 1은 true / 0은  false
* 값이 있는 문자열은 true / 값이 없는 문자열은 false
* true / false는 그대로 출력
* null / undefined는 모두 false로 출력
* 객체 / 배열은 모두 true로 출력. 값이 없더라도 true이다.

 

console.log(!!0);
console.log(!!1);
console.log(!!'string');
console.log(!!'');
console.log(!!true);
console.log(!!false);
console.log(!!null);
console.log(!!undefined);
console.log(!!{});
console.log(!![]);
console.log(!![1,2,3]);

// false
// true
// true
// false
// true
// false
// false
// false
// true
// true
// true