CoffeeScript facts for kids

Kids Encyclopedia Facts

Quick facts for kids
CoffeeScript
Influenced by

Paradigm	Multi-paradigm: prototype-based, functional, imperative, scripting
Designed by	Jeremy Ashkenas
Developer	Jeremy Ashkenas
First appeared	December 13, 2009; 15 years ago (2009-12-13)

Stable release	2.7.0 / Error: first parameter is missing. ()

Typing discipline	dynamic, implicit
OS	Cross-platform
License	MIT License
Filename extensions	`.coffee`, `.litcoffee`
Haskell, JavaScript, Perl, Python, Ruby, YAML
Influenced
MoonScript, LiveScript, JavaScript

CoffeeScript is a programming language that turns into JavaScript. It was created to make JavaScript easier to read and write. It does this by adding simpler ways to write code, inspired by languages like Ruby, Python, and Haskell.

Some cool features of CoffeeScript include list comprehension, which lets you create lists easily, and destructuring assignment, which helps you unpack values from lists or objects. Many popular tools like Ruby on Rails and Play Framework use CoffeeScript. Even the creator of JavaScript, Brendan Eich, has said CoffeeScript influenced his ideas for JavaScript's future.

History of CoffeeScript
How CoffeeScript Syntax Works
How CoffeeScript is Developed
Recent Updates
Extensions to CoffeeScript
Who Uses CoffeeScript?
See also

History of CoffeeScript

CoffeeScript was first started by Jeremy Ashkenas. He made the very first version on December 13, 2009. He called it "the mystery language" at first. The program that turned CoffeeScript into JavaScript was originally written in Ruby.

Just a few days later, on December 24, he released version 0.1.0. Then, on February 21, 2010, he released version 0.5. This new version had a compiler written in CoffeeScript itself! This means CoffeeScript could build itself. Many people started helping with the project on GitHub.

On December 24, 2010, Jeremy Ashkenas announced the first stable version, 1.0.0. This was a big step for the language. Years later, on September 18, 2017, version 2.0.0 came out. This update helped CoffeeScript work better with modern JavaScript, while still keeping its simple style.

How CoffeeScript Syntax Works

In CoffeeScript, almost everything you write is an "expression." This means that even things like if statements or for loops give back a value. In JavaScript, these often don't return anything. CoffeeScript also lets you write these statements in a shorter way, like consequent if condition.

You can often skip extra parentheses and curly braces in CoffeeScript. Instead, you use indentation (like tabs or spaces) to show blocks of code. This makes the code look cleaner. Also, you don't always need to write out "function calls" explicitly; CoffeeScript can often figure them out.

Let's look at some examples to see how CoffeeScript makes code shorter and easier to read compared to JavaScript.

Body Mass Index Example

To calculate the body mass index (BMI) in JavaScript, you might write:

const mass = 72;
const height = 1.78;
const BMI = mass / height ** 2;
if (18.5 <= BMI && BMI < 25) { alert('You are healthy!') }

In CoffeeScript, you can write the same thing more directly:

mass = 72
height = 1.78
BMI = mass / height**2
alert 'You are healthy!' if 18.5 <= BMI < 25

Notice how the if statement is at the end, and there are no curly braces or extra parentheses.

Greatest Common Divisor Example

To find the greatest common divisor (GCD) of two numbers using the Euclidean algorithm, JavaScript often uses a while loop:

gcd = (x, y) => {
  do {
    [x, y] = [y, x%y];
  } while (y !== 0)
  return x;
}

CoffeeScript has an until keyword that can make this simpler:

gcd = (x, y) ->
  [x, y] = [y, x%y] until y is 0
  x

The until keyword means "do this repeatedly until the condition is true."

Checking for Missing Values

The ? keyword in CoffeeScript is a quick way to check if a variable is empty (meaning it's null or undefined):

personCheck = ->
  if not person? then alert("No person") else alert("Have person")
person = null
personCheck()
person = "Ivan"
personCheck()

This code will first say "No person" because person is empty. Then, after person is set to "Ivan", it will say "Have person."

jQuery Example

If you've used the jQuery library in JavaScript, you might have seen code like this to run something when the page is ready:

$(document).ready(function() {
  // Initialization code goes here
});

Or even shorter:

$(function() {
  // Initialization code goes here
});

In CoffeeScript, the function keyword is replaced by ->. Also, indentation replaces curly braces. So, the same code in CoffeeScript looks like this:

$(document).ready ->
  # Initialization code goes here

Or even simpler:

$ ->
  # Initialization code goes here

String Interpolation

CoffeeScript lets you easily put variables inside strings, just like in Ruby. This is called "string interpolation." If you use double quotes, you can put #{ ... } inside to include a variable's value. Single quotes make the string exactly as you type it.

author = "Wittgenstein"
quote  = "A picture is a fact. -- #{ author }"

sentence = "#{ 22 / 7 } is a decent approximation of π"

List Comprehensions

You can use a special type of for loop called a list comprehension to create lists or do things for each item. For example, to show the squares of odd numbers from 1 to 10:

alert n*n for n in [1..10] when n%2 is 1

This means "alert n times n for every n from 1 to 10, but only when n divided by 2 has a remainder of 1 (meaning it's odd)."

You can also do it by stepping through numbers:

alert n*n for n in [1..10] by 2

This means "alert n times n for every n from 1 to 10, counting by 2s (so 1, 3, 5, etc.)."

Looping Over Data

CoffeeScript has different ways to loop through data:

for ... in is used for looping through items in a list (like an array).
for ... of is used for looping through properties in an object.

Variable Scoping

One thing to know about CoffeeScript is how it handles "scoping." This means where a variable can be used in your code. In CoffeeScript, you can't accidentally use the same variable name inside a small block of code if that name is already used outside that block. This is different from JavaScript, where you might create a new variable with the same name inside a function without affecting the outside variable.

For example, in JavaScript, you can be sure that a variable named foo inside a function won't mess with another foo outside it:

  // ...
  function baz() {
    var foo = "bar";
    console.log(`foo = ${foo}`);
  }
  // ...
}

In CoffeeScript, you need to be a bit more careful. You can't tell just by looking at a small piece of code if a variable's name is already used somewhere else in your program.

How CoffeeScript is Developed

The program that turns CoffeeScript into JavaScript is called a "compiler." Since version 0.5, this compiler has been "self-hosting." This means it's written in CoffeeScript itself! You can use it with Node.js, which is a way to run JavaScript outside of a web browser. However, the main part of the compiler can run in any JavaScript environment.

If you want to try CoffeeScript, the official website, CoffeeScript.org, has a "Try CoffeeScript" button. You can type CoffeeScript code there and instantly see what it looks like in JavaScript. There's also a website called js2coffee that can translate code both ways.

Recent Updates

Source Maps: These are like special maps that help you find errors in your CoffeeScript code. Even though the code turns into JavaScript, source maps let you see where the error happened in your original CoffeeScript file.
Literate Programming: CoffeeScript supports a style of programming where you write your code and explanations together in one file. You can use file extensions like .coffee.md or .litcoffee. This lets you write your code inside Markdown documents. The compiler will only look at the indented parts (which Markdown uses for code) and ignore everything else as comments.

Extensions to CoffeeScript

Iced CoffeeScript is an extended version of CoffeeScript. It adds two new keywords: await and defer. These keywords help make code that deals with tasks happening at different times (asynchronous tasks) much simpler. It makes the code look more like a step-by-step program, avoiding long chains of "call-back" functions. You can use Iced CoffeeScript for both web servers and web browsers.

Who Uses CoffeeScript?

Many companies and projects have used CoffeeScript.

On September 13, 2012, Dropbox announced they had rewritten their web code from JavaScript to CoffeeScript. However, they later switched to TypeScript in 2017.
GitHub, a popular website for sharing code, used to tell its developers to write new JavaScript code in CoffeeScript. Their Atom text editor was also written in CoffeeScript.
Pixel Game Maker MV, a tool for making games, uses CoffeeScript as part of its game development system.