Head First JavaScript Programming

게임과 퍼즐로 배우는 자바스크립트입문서 | 대화형 웹애플리케이션의 시작

에릭 프리먼 , 엘리자베스 롭슨 지음 | 강권학 옮김

한빛미디어 2016년 06월 02일 출간 종이책 : 2015년 02월 01일 출간

작품소개

책소개

기초에서부터 객체, 함수, 브라우저 도큐먼트 객체 모델과 같은 고급 주제에 이르기까지 자바스크립트 언어의 모든 것을 설명하는 학습서 『Head First JavaScript Programming』.

목차

1. 자바스크립트 간단히 맛보기 : 자바스크립트의 바다에 풍덩
2. 진짜 코드 만들기 : 코딩 파고들기
3. 함수 개요 : 함수 사용하기
4. 순서가 있는 데이터 : 배열
5. 객체 개요 : 객체타운으로의 여행
6. 웹 페이지와 대화를 : DOM과 함께 춤을
7. 형, 일치, 변환 기타 등등 : 형에 대한 심각한 이야기들
8. 모두 한데 모으기 : 앱 만들기
9. 비동기 코딩 : 이벤트 처리
10. 일급 함수 : 해방된 함수
11. 익명 함수, 범위, 클로저 : 고급 함수
12. 고급 객체 생성 : 객체 만들기
13. 프로토타입 사용하기 : 초강력 객체
14. 부록 : (지금까지 설명하지 않은) 못다한 이야기들

출판사 서평

게임과 퍼즐로 배우는 자바스크립트 입문서
머리가 좋아하는 이 학습서는 기초에서부터 객체, 함수, 브라우저 도큐먼트 객체 모델과 같은 고급 주제에 이르기까지 자바스크립트 언어의 모든 것을 설명합니다. 그러나 지루하게 책만 읽는 것은 아닙니다. 게임도 하고, 퍼즐도 풀고, 미스터리 사건도 해결하고, 꿈에도 생각하지 못했던 방법으로 자바스크립트를 이용하게 됩니다. 그리고 진짜 코드를 만듭니다. 그것도 아주 많이. 이제 여러분은 자신만의 웹 애플리케이션을 만들 수 있게 됩니다.

헤드 퍼스트의 검증된 학습이론으로 쉽고 재미있게 배우는 자바스크립트 입문서

[ 이 책의 특징과 장점 ]
- 우리는 자바스크립트의 좋은 점은 가르치고, 나쁜 점에 대해서는 주의를 줍니다.
- 언어의 모든 측면을 꼬치꼬치 설명하지는 않습니다.
- 이 책은 브라우저에서 자바스크립트를 가르칩니다.
- 이 책은 최고의 프로그래밍 기법에 기반한 구조화되고 읽기 쉬운 코드를 지지합니다.
- 이 책에서는 두 개 이상의 브라우저를 사용하도록 권합니다.

[대상 독자 ]
-자바스크립트를 처음 배우거나, 좀 더 깊이 있게 공부하려는 사람

[상세 내용 ]
1, 자바스크립트 간단히 맛보기 : 자바스크립트의 바다에 풍덩
자바스크립트는 여러분에게 초능력을 드립니다. 웹 시대의 진정한 프로그래밍 언어인 자바스크립트는 웹 페이지가 살아 움직이게 만듭니다. 사용자는 더 이상 무미건조하고, 따분하고, 가만히 있는 웹 페이지를 보지 않아도 되요. 자바스크립트를 이용하면 사용자에게 다가가 흥미로운 이벤트에 응답하고, 외부 서버에서 가져온 데이터를 웹 페이지에 사용하고, 직접 그림도 그릴 수 있어요. 그 외에도 많은 일을 할 수 있게 됩니다. 일단 자바스크립트를 배우면 완전히 새롭게 작동하는 페이지를 만들 수 있습니다.

2. 진짜 코드 만들기 : 코딩 파고들기
여러분은 이미 변수, 형, 표현식… 그리고 더 많은 걸 알고 있어요. 즉 여러분은 자바스크립트에 대해 이미 어느 정도 알고 있다는 것이죠. 사실 지금 알고 있는 것만으로도 진짜 코드를 짤 수 있습니다. 뭔가 재미있는 일을 하는 코드, 누군가 사용하고 싶어 하는 코드를 만들 준비가 이미 되어 있는 거죠. 여러분이 부족한 것은 단지 코딩하는 진짜 경험입니다. 이번 장에서는 이 문제를 해결해보겠습니다. 어떻게 하냐고요? 맨땅에 헤딩하면서 간단한 게임을 만들어보는 겁니다. 완전히 자바스크립트만을 사용해서요. 목표가 너무 거대한 거 같다고요? 걱정하지 마세요. 하나하나 차분히 해나가면 됩니다. 망설이지 말고 일단 시작하세요. 이 게임으로 새로운 벤처 회사를 만든다고 해도 말리지 않겠습니다. 코드는 여러분의 것이니까요.

3. 함수 개요 : 함수 사용하기
이제 첫번째 초능력을 배울 겁니다. 지금까지 어느 정도 프로그래밍을 배웠으니 이제 함수를 이용해 작업할 때가 되었습니다. 함수를 이용하면 아주 다양한 환경에서 사용할 수 있는 코드를 만들 수 있습니다. 이 코드는 계속해서 재사용할 수 있고, 관리하기도 훨씬 쉽고, 복잡한 것을 처리해주는 코드에 간단히 이름만 붙여 놓고 중요한 일에 집중할 수 있게 해줍니다. 이렇게 복잡한 부분을 간단히 생각할 수 있게 해주는 방법을 추상화라고 합니다. 함수는 스크립터에서 프로그래머로 넘어가는 관문일 뿐만 아니라 자바스크립트 프로그래밍 스타일에 있어서 핵심이라는 것을 알게 될 겁니다. 이번 장에서는 함수의 작동 방식 및 함수를 작동하게 하는 입출력 등 기본적인 개념을 익히고, 앞으로 계속 사용하게 될 함수 활용 능력을 개발합니다. 이제부터 함수에 대해 제대로 배워보겠습니다.

4. 순서가 있는 데이터 : 배열
자바스크립트에는 숫자, 문자열, 불린형 말고도 많이 있어요. 지금까지는 “해피”, 23, true와 같은 간단한 문자열, 숫자, 불린형과 같은 기본형(Primitive)만 사용해 자바스크립트 코드를 작성해왔습니다. 기본형만 갖고도 할 수 있는 일이 많지만 어느 수준에 도달하면 더 많은 데이터를 다뤄야 해요. 가령 장바구니에 들어 있는 모든 품목들, 재생 목록에 있는 노래들, 수많은 별들과 이 별들의 표면적, 아니면 제품 카탈로그 같은 것들이 있죠. 이런 것들을 처리하려면 약간 더 강력한 무언가가 필요합니다. 순서가 있는 이런 데이터를 처리하려면 자바스크립트 배열(Array)을 이용할 수 있습니다. 이번 장에서는 배열에 데이터를 넣고, 배열을
전달하고, 배열을 이용해 계산하는 방법을 알아볼 거예요. 나중에 데이터를 구조화하는 다른 방법도 배우지만, 일단 배열부터 시작하겠습니다.

5. 객체 개요 : 객체타운으로의 여행
지금까지 기본형과 배열을 코드에 사용해왔습니다. 그리고 단순한 문장, 조건식, for / while 루프, 함수를 사용하면서 상당히 절차적인 방식으로 코드를 만들어왔습니다. 이런 방식은 그다지 객체지향적이지 않아요. 사실 객체지향이랑은 아주 거리가 멉니다. 알게 모르게 우리는 여기저기에서 객체를 사용해왔지만, 직접 객체를 만들지는 않았습니다. 자, 이제 지루한 절차타운을 떠나 객체타운에서 여러분의 객체를 직접 만들 때가 되었어요. 이번 장에서는 객체를 사용하면 여러분의 삶이 얼마나 더 윤택해지는지 알려줄 거예요. 물론 프로그래밍 측면에서 말이죠(책 한 권으로 여러분의 패션 감각과 자바스크립트 기술을 모두 가르쳐드릴 수는 없어요). 여기서 주의할 점이 있습니다. 일단 여러분의 객체을 알게 된 후에는 기존과 같은 방식으로는 돌아가고 싶지 않을 거예요. 객체타운에 도착하면 우리에게 엽서라도 보내주세요.

6. 웹 페이지와 대화를 : DOM과 함께 춤을
지금까지 자바스크립트에 대해 많은 걸 공부했습니다. 사실 초짜에서 스크립터 수준까지는 되었죠. 어쩌면
프로그래머라고 부를 수도 있을지 모르겠습니다. 그런데 중요한 게 빠졌네요. 자바스크립트 기술을 제대로
활용하려면 이 코드가 들어 있는 웹 페이지와 대화하는 방법을 알아야 해요. 웹 페이지와 대화하는 방법을 알아야만 로딩된 후에 사용자의 요구에 응답해 반응할 수는 있는, 동적인 웹 페이지를 만들 수 있습니다. 그러면 어떻게 해야 웹 페이지와 대화할 수 있을까요? 문서 객체 모델(Document Object Model, DOM)을 사용해야 합니다. 이번 장에서는 DOM을 분해해보고, DOM과 자바스크립트를 이용해 웹 페이지에 새로운 기법을 적용해보겠습니다.

7. 형, 일치, 변환 기타 등등 : 형에 대한 심각한 이야기들
이제 형에 대해 신중할 때가 되었습니다. 자바스크립트는 언어 자체를 상세히 배우지 않고도 많은 것을 할 수 있다는 장점이 있습니다. 그렇지만 진짜로 언어를 정복하고, 승진하고, 인생일대에 원하는 것을 해내려면 형을 멋지게 활용할 수 있어야 합니다. 한참 앞에서 자바스크립트에 대해 했던 말이 기억나나요? 자바스크립트가 부유하게 대학교에서 상호 검토를 받고 정의된 언어가 아니라는 걸 말이죠. 사실입니다. 그렇지만 학교를 그만두었다고 스티브 잡스와 빌 게이츠가 실패한 것은 아닙니다. 자바스크립트도 마찬가지입니다. 실제로 자바스크립트는… 흐음… 정교한 형 체계를 갖고 있지 않습니다. 사용하다 보면 특이성도 보입니다. 그러나 걱정할 필요는 없어요. 이번 장에서는 형에 대한 모든 것을 확실히 정리해서 형 때문에 발생할 수 있는 창피한 문제들을 겪지 않게 만들어줄 거예요.

8. 모두 한데 모으기 : 앱 만들기
공구 벨트를 차세요. 그리고 이 공구 벨트에는 새로 배운 코딩 기술, DOM과 약간의 HTML 및 CSS에 대한 지식을 담으세요. 이번 장에서는 지금까지 배운 지식을 총동원해 처음으로 진정한 웹 애플리케이션을 만들어보겠습니다. 전함 한 척이 덜렁 한 줄에 숨는 그런 시시한 게임은 이제 끝이에요. 이번 장에서는 멋지고 큰 게임판, 여러 척의 배, 사용자 입력을 웹 페이지에 바로 입력하는 완전히 새로운 경험을 할 거예요. 먼저 HTML로 게임 페이지 구조를 만들고, CSS로 시각적인 스타일을 지정하고, 자바스크립트로 게임 행동을 구현하는 코드를 작성합니다. 이번 장에서는 약간 복잡한 코드를 구현하는데, 나중에 여러분이 실제로 개발할 때 탄탄한 기반이 될 거예요. 자, 이제 마음의 각오를 단단히 하고 출발할게요.

9. 비동기 코딩 : 이벤트

작가정보

저자(글) 에릭 프리먼

저자 에릭 프리먼은 월트 디즈니사의 디즈니 온라인과 Disney.com의 CTO를 역임했다. 현재 에릭은 엘리자베스와 공동 창업한 스타트업인 위키들리스마트(WickedlySmart)에 전념하고 있다. 에릭은 컴퓨터 과학자로서 예일대학교 박사과정에서 업계 선구자인 데이빗 겔런터와 함께 수학했다. 그의 박사학위 논문은 데스크탑 메타포어의 대안에 대한 근간을 이루고 있다고 인정받고 있으며 최초로 액티비티 스트림을 구현했다.

저자(글) 엘리자베스 롭슨

저자 엘리자베스 롭슨은 소프트웨어 엔지니어, 작가, 강사로 활동하고 있다. 예일대학교 학생 시절부터 기술 분야에 열광했으며, 동대학원에서 전산학 석사학위를 받고 병렬 비주얼 프로그래밍 언어와 소프트웨어 아키텍처를 설계했다. 엘리자베스는 일찍부터 인터넷에 관련된 일을 해왔으며, 입상에 빛나는 The Ada Project 웹 사이트를 공동으로 개발했다. 컴퓨터 과학을 전공한 여성들이 온라인에서 직업을 구하고 멘토링 정보를 구할 수 있도록 도와주는 사이트다.

번역 강권학

역자 중앙대학교 컴퓨터공학과에서 학사와 석사 학위를 받았다. 국방과학연구소, 퓨쳐시스템, 안철수연구소에서 13년간 개발자, 보안전문가, 프로젝트 관리자로 근무했으며, 2009년 4월 호주 멜번에 iGonagi Pty. Ltd.를 설립하고 아이폰 앱을 개발 중이다. 『만들면서 배우는 아이폰 게임 프로그래밍』을 공동으로 저술했고, 『Head First iPhone Development』, 『Head First Programming』, 『Head First Python』, 『iPhone Programming 제대로 배우기』, 『iPhone 3D Programming: using OpenGL ES』(이상 한빛미디어)를 번역했다.