자바스크립트+jQuery 완전정복 스터디 3: 중급 고급 활용편(위키북스 웹동네 시리즈 5)

『자바스크립트+jQuery 완전정복 스터디』는 독자 개인의 실력과 목표에 맞게 공부할 수 있도록 총 3권으로 구성돼 있습니다.



『자바스크립트+jQuery 완전정복 스터디 3 (중급/고급/활용편)』에서는 한 단계 높은 수준의 웹프로그래밍을 구현하기 위해 자바스크립트를 활용한 클래스와 객체지향을 다룹니다. 또한 1, 2편에서 배운 내용을 바탕으로 실무에서 한 번쯤 만들게 되는 UI콘텐츠를 제작해 보면서 다양한 실무 팁과 테크닉도 알려줍니다.



★ 이 책만의 특징 ★



◎ 이 책은 기획 단계에서부터 개인/단체 스터디를 목적으로 제작되었습니다.

◎ 이 책은 이제 막 시작하는 초급자를 위한 초급 단계와 일반 실무자의 실력 향상을 위한 중급/고급/실무 단계로 구성돼 있으며 개인의 실력과 목적에 맞게 선택해서 스터디를 진행할 수 있습니다.

◎ 학습하기 쉽게 하나의 장(주제)은 여러 개의 레슨(소주제)으로 구성돼 있습니다.

◎ 실무 이론과 실무 중심 예제가 가득합니다.

◎ 학습한 내용을 자체적으로 평가할 수 있는 실무형 미션도 가득 들어 있습니다.



★ 이 책의 대상 독자 ★



◎ 자바스크립트+jQuery를 활용해 탭메뉴 정도는 쉽게 만들 수 있는 실무자

◎ 자바스크립트 클래스를 제대로 정복하고 싶은 독자

◎ 자바스크립트를 활용한 객체지향 프로그래밍(OOP)를 제대로 정복하고 싶은 개발자

◎ jQuery 플러그인 제작방법을 제대로 정복하고 싶은 사용자

◎ 자바스크립트 객체지향 프로그래밍 기반 UI 콘텐츠를 제작하고 싶은 실무자

[05부] 자바스크립트 클래스와 클래스 단위 프로그래밍



▣ 01장: 자바스크립트 클래스 기초

Lesson 01. 클래스 소개

__01. 클래스를 이해하기 위해 반드시 알고 있어야 하는 내용

__02. 클래스란?

__03. 자바스크립트에서 클래스란?

Lesson 02. 클래스 관련 기본 개념과 용어정리

__01. 인스턴스

__02. 객체란?

__03. 프로퍼티

__04. 메서드

Lesson 03. 오브젝트 리터럴 방식으로 클래스 만들기

__01. 사용법

__02. 예제

__03. 특징

__04. 실무에서 오브젝트 리터럴 사용 예

Lesson 04. 함수 방식으로 클래스 만들기

__01. 사용법

__02. 예제

__03. 특징

Lesson 05. 프로토타입 방식으로 클래스 만들기

__01. 사용법

__02. 예제

__03. 특징

Lesson 06. 클래스 정의 방법 3가지 비교

__01. 특징

__02. 클래스 정의 방법(포장법) 비교

__03. 인스턴스 생성 방법

__04. 객체 외부에서 프로퍼티와 메서드 접근 방법

__05. 객체 내부에서 프로퍼티와 메서드 접근 방법

Lesson 07. 미션



▣ 02장: 클래스 중급

Lesson 01. this의 정체

__01. this란?

__02. 일반 함수에서의 this

__03. 일반 중첩 함수에서의 this

__04. 이벤트 리스너에서의 this

__05. 메서드에서의 this

__06. 메서드 내부의 중첩 함수에서의 this

Lesson 02. 함수호출() vs. new 함수호출()

__01. 함수호출()

__02. new 함수호출()

Lesson 03. 함수 단위 코딩 vs. 클래스 단위 코딩

__01. 함수 단위 코딩 1

__02. 함수 단위 코딩 2

__03. 클래스 단위 코딩

Lesson 04. 인스턴스 프로퍼티와 메서드 vs. 클래스 프로퍼티와 메서드

__01. 인스턴스 프로퍼티와 메서드

__02. 클래스 프로퍼티와 메서드

Lesson 05. 패키지

__01. 패키지란?

__02. 일반 프로그래밍에서 패키지

__03. 자바스크립트에서 패키지



▣ 03장: jQuery 플러그인 제작

Lesson 01. jQuery 확장 소개

__01. jQuery 확장이란?

__02. jQuery 확장 요소 종류

Lesson 02. jQuery 유틸리티 만들기

__01. 유틸리티 소개

__02. 유틸리티 구조

__03. 사용자 정의 jQuery 유틸리티 만들기

Lesson 03. jQuery 플러그인 만들기

__01. jQuery 플러그인 소개

__02. jQuery 플러그인 구조

__03. jQuery 플러그인 구조 분석

__04. 사용자 정의 jQuery 플러그인 만들기

__05. 다음 내용 예고

Lesson 04. 함수 기반 플러그인 만들기

__01. 구문

__02. 예제

__03. 정리

Lesson 05. 클래스 기반 플러그인 만들기

__01. 문법

__02. 예제

__03. 정리

Lesson 06. 플러그인 그룹 만들기

__01. 소개

__02. 예제

__03. 결론

Lesson 07. extend() 메서드를 활용한 플러그인 옵션 처리

__01. 기본 옵션값

__02. jQuery의 extend() 메서드 소개

__03. extend() 메서드를 활용한 플러그인 옵션 처리

Lesson 08. 미션



[06부] 자바스크립트 객체지향 프로그래밍



▣ 01장: 객체지향 프로그래밍 기초

Lesson 01. 절차지향 프로그래밍 vs. 객체지향 프로그래밍

__01. 절차지향 프로그래밍

__02. 객체지향 프로그래밍

__03. 절차지향 프로그래밍 vs. 객체지향 프로그래밍

Lesson 02. 객체지향 프로그래밍의 특징

__01. 객체지향 프로그래밍이란?

__02. 객체지향 프로그래밍 언어란?

__03. 객체지향 프로그래밍 언어 학습법

__04. 자바스크립트는 객체지향 프로그래밍 언어인가요?

Lesson 03. 객체지향 프로그래밍 언어에서 제공하는 기본 기능

__01. 기본 기능 종류

__02. 선언 부분과 구현 부분

__03. 클래스

__04. 인터페이스

__05. 추상 클래스(abstract class)

__06. UML 소개

Lesson 04. 이번 장을 마치며



▣ 02장: 객체지향 프로그래밍 특징 01-추상화

Lesson 01. 추상화 소개

__01. 추상화란?

__02. 예제

Lesson 02. 자바스크립트에서 추상화

__01. 일반 OOP에서 지원하는 추상화

__02. 자바스크립트에서 추상화

Lesson 03. 미션



▣ 03장: 객체지향 프로그래밍 특징 02-캡슐화

Lesson 01. 캡슐화 소개

__01. 캡슐화란?

__02. 예제

Lesson 02. 자바스크립트에서의 캡슐화

__01. 일반 OOP에서 지원하는 캡슐화 관련 기능

__02. 자바스크립트에서 캡슐화

Lesson 03. 미션



▣ 04장: 객체지향 프로그래밍 특징 03-클래스 상속 기초

Lesson 01. 클래스 상속 소개

__01. 클래스 상속이란?

__02. 상속은 이럴 때 사용해요

Lesson 02. 클래스 상속 기능

__01. 코드 재사용

__02. 중복 코드 제거

__03. 확장

Lesson 03. 자바스크립트에서 클래스 상속

__01. 일반 OOP에서 클래스 상속

__02. 자바스크립트에서 클래스 상속

Lesson 04. 미션



▣ 05장: 객체지향 프로그래밍 특징 03-클래스 상속 중급

Lesson 01. 자식 클래스와 부모 클래스 연동처리

__01. 자바스크립트 최상위 부모 Object 클래스

__02. 자바스크립트에서 부모생성자 호출하기

Lesson 02. 자바스크립트에서 메서드 오버라이드

__01. 메서드 오버라이드란?

__02. 부모 클래스의 기능을 자식 클래스에서 재정의

__03. 부모 클래스의 기능을 자식 클래스에서 확장

Lesson 03. 자바스크립트에서 메서드 오버로딩

__01. 자바스크립트에서 메서드 오버로딩

__02. 문법

__03. 예제

Lesson 04. constructor 프로퍼티 활용

__01. constructor 프로퍼티 소개

__02. 예제

Lesson 05. 클래스 상속 규칙

__01. 클래스 상속은 이럴 때 사용하면 안 되요

__02. 예제



▣ 06장: 객체지향 프로그래밍 특징 04-다형성

Lesson 01. 다형성 소개

__01. 다형성이란?

__02. 예제

Lesson 02. 다형성과 데이터 타입과의 관계

__01. 일반 객체지향 프로그래밍에서 데이터 타입의 의미

__02. 일반 객체지향 프로그래밍에서 다형성의 의미

__03. 정리

Lesson 03. 자바스크립트에서 다형성

__01. 일반 객체지향 프로그래밍의 다형성 관련 문법

__02. 자바스크립트에서 다형성

Lesson 04. 미션



▣ 07장: 합성

Lesson 01. 합성 소개

__01. 합성이란?

__02. 예제

Lesson 02. 클래스 상속 vs. 합성

__01. 공통점

__02. 사용 용도

__03. 실무에서는 상속보다는 합성을 많이 사용합니다

__04. 정리



[07부] 실무활용! OOP를 적용한 UI 콘텐츠 제작



▣ 01장: 1단 바메뉴

Lesson 01. 분석하기

__01. 소개 및 미리보기

__02. 요구사항

__03. 용어정리

__04. 출력효과

__05. 동작효과

Lesson 02. 구현하기



▣ 02장: 폴더 아코디언

Lesson 01. 분석하기

__01. 소개 및 미리보기

__02. 요구사항

__03. 용어정리

__04. 출력효과

__05. 동작 효과

Lesson 02. 구현하기



▣ 03장: 이미지 슬라이더

Lesson 01. 분석하기

__01. 소개 및 미리보기

__02. 요구사항

__03. 용어정리

__04. 출력효과

__05. 동작효과

Lesson 02. 구현하기



▣ 04장: 탭패널

Lesson 01. 분석하기

__01. 소개 및 미리보기

__02. 요구사항

__03. 용어정리

__04. 출력효과

__05. 동작효과

Lesson 02. 구현하기

김춘경 저자 김춘경(딴동네)는 웹 분야 중 주로 웹프론트엔드 개발과 웹앱 & 모바일웹앱 개발자로 활동하고 있으며 책 집필과 IT학원에서 웹 기술과 관련된 강의를 하고 있습니다. 또한 웹프론트엔드 개발자를 위한 온오프라인 공간인 웹동네를 운영하고 있습니다.



웹동네는 웹앱과 웹프론트엔드 분야를 전문으로 연구하고 학습하는 그룹으로서, 온라인에서는 온라인 동영상 강의, 소셜 스터디, 정보공유 등을 진행하는 웹동네(http://www.webdongne.com) 사이트를 운영 중이며 오프라인에서는 맞춤형 스터디, 정보 공유 세미나, 실무 특강을 진행할 수 있는 웹동네 모임 공간을 운영하고 있습니다.