구르소 기술 블로그

인사이드 자바스크립트 part 1

요즘 자바스크립트에 푹 빠져있다. 취업을 위해서는 엔터프라이즈 언어를 배우는게 더 도움이 될꺼라는 조언을 받았지만 가슴이 시키는 것을 하고 싶었다. 책 리뷰는 잘하지 않지만 지금까지 산 전공책만 해도 40권이 넘은데 안하면 웬지 손해보는 느낌이였다. 그래서 오늘은 공부 동기부여도 될겸 인사이드 자바스크립트 책을 소개하려고 한다.

1. 책 선택

나는 어쨌든 학교에서 배운 언어들과 실무에서 배운 파이썬을 알고 있기 때문에 초급자 입장에서 바라볼 필요는 없었다. 찾아본 책으로는 “모던 자바스크립트 딥 다이브”, “혼자 공부하는 자바스크립트”, “코어 자바스크립트”, “인사이드 자바스크립트”가 있었다. 프론트엔드를 하기 위해서 자바스크립트를 배우는 것이 아니기 때문에 입문서는 그렇게 필요하지 않았다. 오히려 react나 node.js를 찾아보는게 더 도움 됐을지 모른다. 하지만 나는 본질을 이해해야지 그 상위 개념들도 쉽게 이해할 수 있다고 믿고 있다. 결국 초중급을 지향하는 인사이드 자바스크립트 책과 좀 더 딥하게 배울 수 있는 코어 자바스크립트 책을 골랐다. 오늘 소개할 책은 인사이드 자바스크립트이다. 그럼 내가 배운 것들을 같이 짚어보자.

2. 책 요약

자바스크립트 데이터 타입

자바스크립트 기본 타입으로는 숫자, 문자열, 불린값, null, undefined 등이 있다. 또한 자바스크립트는 느슨한 타입 체크 언어로 변수에 어떤 타입이 들어가도 상관하지 않는다. 숫자의 경우 정수형이 따로 없고, 모든 숫자를 실수로 처리하므로 5/2를 했을 때 2.5가 나오게 된다. 문자열 같은 경우에는 작은 따옴표나 큰 따옴표로 생성한다. 주의할 점으로는 한 번 정의된 문자열은 변하지 않는다. null과 undefined 타입 모두 ‘값이 비어 있음’을 나타낸다. undefined는 타입이자 값을 나타낸다. null같은 경우에는 타입은 object이고 값을 비교할 때에는 일치 연산자(===)를 사용해서 값을 확인해야 한다.

NaN(Not a Number) 값은 수치 연산을 해서 정상적인 값을 얻지 못할 때 출력되는 값이다. 1 – ‘hello’ 연산 결과는 NaN이다.

자바스크립트에서는 5가지의 기본타입을 제외한 모든 값은 객체다. 배열, 함수 등이 객체로 취급된다. 참조타입이라고 부르는데 모든 연산이 실제 값이 아닌 참조 값으로 처리되기 때문이다. 기본 타입의 경우에는 값에 의한 호출 방식이고 참조 타입의 경우 참조에 의한 호출 방식으로 작동한다.

let a = 100;
const objA = { value: 100 };

function changeValue(num, obj) {
  num = 200;
  obj.value = 200;

  console.log(num);
  console.log(obj);
}

changeValue(a, objA);

console.log(a);
console.log(objA);

/*
200
{ value: 200 }
100
{ value: 200 }
*/

기본 타입인 경우에는 값이 복사되지만 참조 타입인 경우에는 값이 변하는 것을 확인할 수 있다.

자바스크립트의 모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있다. 부모 객체의 프로퍼티를 쓸 수 있다. 이러한 부모 객체를 프로토타입 객체라고 부른다.

연산자

연산자(+)는 더하기 연산과 문자열 연결 연산을 수행한다. 모두 숫자일 경우에만 더하기 연산이 수행되고, 나머지 문자열 연결 연산이 이뤄진다.

==(동등) 연산자와 ===(일치) 연산자가 있다. == 연산자는 타입이 다른 경우 타입 변환을 거쳐 비교하지만 === 연산자는 타입이 다를 경우 변환하지 않고 비교한다.

!! 피연산자를 불린값으로 변환하는 것이다.

함수 호이스팅

함수 선언문 형태로 정의한 함수의 유효 범위는 코드의 맨 처음부터 시작한다. 이것을 함수 호이스팅이라고 한다.

함수 객체

자바스크립트에서는 함수도 객체다. 자바스크립트 함수는 다음과 같은 동작이 가능하다.

• 리터럴에 의해 생성
• 변수나 배열의 요소, 객체의 프로퍼티 등에 할당 가능
• 함수의 인자로 전달 가능
• 함수의 리턴값으로 리턴 가능
• 동적으로 프로퍼티를 생성 및 할당 가능 이와 같은 특징이 있으므로 자바스크립트에서는 함수를 일급객체라고 부른다.

콜백 함수

함수의 이름을 지정하지 않아도 함수가 정의되며 이러한 함수가 익명 함수라고 한다. 대표적인 용도로는 콜백 함수이다.

마치며

가볍게 책 내용을 소개해봤다. 뒷장으로 가면 갈수록 어려워 질 것이다. 가슴이 식어도 꾸준히 배워서 정복하자. 이상 인사이드 자바스크립트 요약이였다.

• js
• javascript