자바스크립트는 참 편리한 스크립트 언어이지만 다른 한편으로는 이해하기 힘든 녀석이기도 합니다. 이유인 즉선 너무 유연하게 사용할 수 있다보니 가끔 일반적인 언어, 컴퓨터 상식으로는 "왜 이렇게 동작하지?" 하는 경우들이 있기 때문입니다. 가장 대표적인 것이 조건 비교문을 이용하여 변수나 객체를 비교할때 입니다. 잘 동작할 것으로 생각했던 구문들이 정상적인 동작을 하지 않거나 예상치 못한 반응을 한다면 혹시 아래 표에 나온 경우중 하나가 아닌지 잘 살펴봐야 합니다. 아래 표는 http://dorey.github.io/JavaScript-Equality-Table/ 에서 업어왔습니다

 
Boolean 값인 True 와 1은 같은 값일까요? 그리고 True 와 "1"은 같은 값일까요? 조금 더 나아가 True 와 [1] 을 비교하면 어떻게 될까요? 두개의 이퀄 연산자(==)를 사용하여 자바스크립트에서 값을 비교하는 경우 위의 표에서 초록색으로 표시된 것처럼 결과가 리턴된다고 합니다. "" 와 0 이 같다는 생각을 해보셨나요? 혹은 "" 와 [[]] 가 같은 값으로 식별된다는 상상을 누가 해봤을까요? 

때문에 자바스크립트에서는 각 객체와 객체를 비교했을 때 값을 정확하게 예측하기 힘들다면 이퀄 연산자를 두개 이어쓰는 대신 세개(===)를 쓰는 것이 좋습니다. 세개의 이퀄 연산자를 사용하는 경우 엄격한 규칙에 의거하여 값을 비교하게 되고 이로 인한 조건 비교문의 오동작을 효과적으로 막을 수 있습니다. 세개의 연산자에 대한 부정형은 !== 이니 참고하시면 될 것 같습니다


훨씬 상식(?)에 가까운 결과를 보실 수 있습니다. 같은 형태의 자료형들간에 비교를 했을때 정확한 값이 나오는 것을 볼 수 있습니다. 자바스크립트를 쓰면서 뭔가 이해할 수 없는 동작이 발생하고 있다면 표를 참고하시고 연산자를 바꿔보는 것을 검토해 보세요. 우리의 시간은 소중하니까요. :-)

 

저작자 표시
신고
Posted by 노피디
Development2013.12.26 15:23
웹의 세상이 되면서 웹 개발자들이 각광받는 시대입니다. 서버사이드 개발을 하던 프론트엔드 개발을 하던 웹 개발은 이제 어느 회사에서도 없어서는 안되는 중요한 역할을 해내고 있습니다. 그런데 웹을 그냥 하는 것과 웹을 잘 하는 것은 분명 차이가 있을 것 같습니다. 고작 10년여의 경력인지라 모르는 것들이 정말 많고 계속 변하는 웹 관련 기술에 혀를 내두를 지경이지만 결국 기본이 탄탄하다면 두려울(?)것이 없다는 생각을 늘 하고 있습니다.

웹을 이해하기 위해서는 웹을 소화하는 주요 주체인 브라우저에 대해서 잘 이해할 필요가 있습니다. 내가 만든 자바스크립트가 브라우저에게 어떤 영향을 줄 것인지? 내가 만든 서버사이드 스크립트 메서드 한개가 사용자에게 어떤 경험을 주게 될지를 고민하는 것이 필요하다는 이야기입니다. 브라우저가 행하는 기본적인 동작을 이해하는 것에서 웹 튜닝이나 웹 가속에 대한 논의가 시작될 수 있을 것 같습니다.

사진 출처 : www.internetretailer.com


웹은 서버가 내려주는 HTML 을 읽고 사용자에게 표현하는 역할을 합니다. 브라우저는 HTML 의 여러가지 구성요소를 어떻게 해석하고 받아들이고 이해한 내용을 표현하는 것일까요? 렌더링 단계(화면에 컨텐츠를 보여주는 단계) 이전에 일어나는 일들과 하지 않아야 하는 것들을 간략하게 설명한 동영상이 있어서 소개해 봅니다. 브라우저의 동작을 이해하기 위해서 TCP 도 잘 알아야 하지만 일단은 그렇구나~ 하고 넘어가면 좋을 것 같습니다!


- NoPD -


 
저작자 표시
신고
Posted by 노피디

티스토리 툴바