Book Image

CoffeeScript Application Development

By : Ian Greenleaf Young
Book Image

CoffeeScript Application Development

By: Ian Greenleaf Young

Overview of this book

JavaScript is becoming one of the key languages in web development. It is now more important than ever across a growing list of platforms. CoffeeScript puts the fun back into JavaScript programming with elegant syntax and powerful features. CoffeeScript Application Development will give you an in-depth look at the CoffeeScript language, all while building a working web application. Along the way, you'll see all the great features CoffeeScript has to offer, and learn how to use them to deal with real problems like sprawling codebases, incomplete data, and asynchronous web requests. Through the course of this book you will learn the CoffeeScript syntax and see it demonstrated with simple examples. As you go, you'll put your new skills into practice by building a web application, piece by piece. You'll start with standard language features such as loops, functions, and string manipulation. Then, we'll delve into advanced features like classes and inheritance. Learn advanced idioms to deal with common occurrences like external web requests, and hone your technique for development tasks like debugging and refactoring. CoffeeScript Application Development will teach you not only how to write CoffeeScript, but also how to build solid applications that run smoothly and are a pleasure to maintain.
Table of Contents (19 chapters)
CoffeeScript Application Development
About the Author
About the Reviewers

Using inheritance while refactoring

There's one more bit of refactoring that will help us pare down our code. We've got a pattern that's repeated in a number of places in our views:

availablePets = document.getElementById "available_pets"
availablePets.innerHTML = petOutput.join ""

We find a DOM element using an id, and then insert some generated output into it. It would be nice if we could encapsulate this logic somewhere. It will save us time, make our code easier to read, and if we want to change the pattern (say, to support older browsers), we'll only need to do it in one place.

This is a generic piece of display functionality, but we don't have a good way to share among all our view classes. Well… we do have a good way, we just haven't written it yet! This is a perfect situation for inheritance. We'll define a generic View class that all our views inherit from, which will give us an easy way to promote code reuse.

First add it to index.html, before the other view files:

<script src...