LearnThe Absoluta Guia do Iniciante para CoffeeScript

CoffeeScript tem se tornado cada vez mais popular nos últimos anos devido à sua adoção pelo Nó.js e Rails. Vamos dar uma olhada por que ele se tornou a linguagem go-to quando as pessoas estão querendo escrever JavaScript em seus aplicativos.o que é CoffeeScript?

CoffeeScript é uma linguagem que é compilada para JavaScript. Código dentro .arquivos de café não são interpretados em tempo de execução, como JavaScript, mas são compilados em .ficheiros js.

Se você está escrevendo para JavaScript para o nó.js ou qualquer implementação de navegador dado, CoffeeScript pode ser escrito para qualquer e todos os sabores de JavaScript.porquê CoffeeScript?

no passado, JavaScript não teve a maior parte das reputações devido à mentalidade copy-and-paste dos anos 90 e início dos anos 2000, parecia que apenas alguns tinham alguma idéia do que estava acontecendo. Foi visto como uma linguagem não tão “séria”. No entanto, JavaScript como uma linguagem tem muito a oferecer e tem algumas SUPER características.

CoffeeScript faz uso das características poderosas do JavaScript sem aprender as características menos conhecidas do JavaScript, adicionando” syntactic sugar ” ao JavaScript. CoffeeScript não tem os semi-colões e chavetas, sintaxe semelhante à de Python e Ruby.

isto significa que você pode escrever menos código e fazer as coisas mais rápido. Também facilita a leitura e a manutenção.

devido a otimizações CoffeeScript usa, quando é compilado para baixo, o JavaScript resultante é tão performante ou, em alguns casos, é ainda mais performante sobre código escrito à mão.

Você pode aprender muito sobre JavaScript olhando para o JavaScript que CoffeeScript compila até. Se há algo novo que você vê lá, pesquisá-lo e ver por que CoffeScript compila dessa forma, em vez do que você está acostumado a ver.

instalando CoffeeScript

vamos instalar CoffeeScript para que você possa seguir adiante. CoffeeScript é um nó.pacote js. Então depende do nó.js e o Gestor de pacotes (npm).

On OS X

Node.o js pode ser instalado usando o Homebrew, um gerenciador de pacotes de código aberto para o OS X. Você pode rever o processo de instalação do Homebrew aqui.

certifique-se que o seu Homebrew está actualizado escrevendo brew update no seu terminal.

a fórmula Homebrew para nó.js is node. Para instalar o nó.js você digita em brew install node no seu terminal. Siga quaisquer instruções adicionais que apareçam se você precisar alterar PATHs ou algo do género.

então escreva npm install -g coffee-script para instalá-lo globalmente.

no nó de visita do Windows

.site da js e pressione o botão “Instalar”. Ele deve detectar automaticamente o seu sabor das janelas que você está usando e um instalador vai começar a baixar.

passar pelo processo de instalação.

Uma vez instalado, abra a sua linha de comandos e escreva npm install -g coffee-script para a instalar globalmente.

e finalmente

Tipo coffee -v na sua linha de comandos para ver se foi instalado correctamente.

Utilização da linha de comandos

o compilador coffee pode ser usado de várias formas. Aqui estão alguns para ver o que está disponível.

Executar e Compilar

O seguinte comando irá compilar todos os seus .coffee arquivos em uma pasta chamada coffeescripts.js arquivos em um paralelo estrutura de árvore javascripts pasta.

coffee -o javascripts/ -c coffeescripts/

Warning

the option -c means to compile and -o means the output folder. Note que a ordenação é saída e depois compile. Isto é porque se você mudar a ordem não funciona!

Observador

executando o comando acima sempre que quiser compilar ficheiros CoffeeScript para que haja outra opção útil a usar, -w.

coffee -w -o javascripts/ -c coffeescripts/

o observador ouve as mudanças nos arquivos nocoffeescripts pasta e compila-os na hora.

Se adicionar um novo ficheiro à pastacoffeescripts deverá compilar, no entanto, se adicionar uma nova pasta e um ficheiro CoffeeScript dentro do qual não será compilado. Isto pode mudar em versões posteriores.

juntar os ficheiros

Pode também compilar todos os seus ficheiros .coffee até um único ficheiro JavaScript. Isso reduzirá o número de pedidos HTTP que um navegador tem que fazer e melhorar o desempenho. Para fazer isso use o -j opção assim:

coffee -j javascripts/app.js -c coffeescripts/*.coffee

* é um operador de caractere curinga.

REPL

Se escrever coffee sem quaisquer opções abre-se uma linha de comandos interactiva. Isto é semelhante airb em Ruby. Esta é uma grande ferramenta para as coisas no console e realizar experimentos rápidos.

Editor de texto realce

Se você vai codificar em CoffeeScript a melhor coisa a fazer é ter realce de sintaxe.

TextMate

Jeremy Ashkenas, inventor de CoffeeScript, criou um pacote de TextMate útil. Para instruções de instalação, aqui.

Texto Sublime 2

Texto Sublime 2 tem um plugin criado pelo usuário do GitHub Xavura. Você pode instalar isso através do controle Sublime de pacotes, se você já tem isso.

The Good Stuff a. k. a. The Syntax

Variables

Variables in CoffeeScript don’t require the keyword var. Basta nomear a sua variável, um sinal igual, e então o valor.

year = 1985speed = 88

Strings

Strings são declaradas com citações como na maioria das outras línguas.

first_name = "Marty"

Para entrar ou concatenar cadeias de caracteres, você pode listá-los um após o outro com um sinal de mais no meio, assim:

full_name = first_name + " McFly"

Você também pode incluir o símbolo de hash (#), seguido por chavetas, e dentro destas a variável de seqüência de caracteres.

full_name = "#{first_name} McFly"

os dois exemplos acima criariam a cadeia Marty McFly.

o último tipo de interpolação de texto só funciona quando você usa aspas duplas. Se você usar aspas simples, o texto é mostrado “como está”. Strings de aspas simples são strings literais.

full_name = '#{first_name} McFly'

assim o acima será a cadeia de#{first_name} McFly. Isto espelha o comportamento.

funções

funções são declaradas nomeando a função, igual a sinal, e então um símbolo de função especial (->).

initialize_time_circuits = -> year * flux_capacitor_constant * speed

não Temos usado a palavra-chave return porque cada função em CoffeeScript retorna o resultado da última linha de código.

funções multi-forradas são gravadas em várias linhas com cada linha após a declaração ter algum espaço em branco antes dela.

initialize_time_circuits = -> year = 1885 year * flux_capacitor_constant * speed

This would set the year to 1885 every time. Se queremos que o ano deve ser muito mais flexível, mas tem um padrão que podemos trazer para o método declaraion como este:

initialize_time_circuits = (speed, year = 1885) -> year * flux_capacitor_constant * speed

Isso vai significar podemos então chamar esta com um valor de speedyear padrão será sempre 1885.

 initialize_time_circuits(88)

Você também pode chamar métodos sem usar parêntesis. O acima também pode ser escrito como:

 initialize_time_circuits 88

Arrays

Existem várias maneiras diferentes de inicializar e declarar arrays em CoffeeScript. Deve estar habituado a ver arrays declarados com parêntesis rectos e valores separados por vírgulas.

 mcflys = 

Você também pode declarar matrizes em várias linhas como esta:

 mcflys = 

Você tem que ter espaço em branco em cada linha.opcionalmente, pode remover a vírgula final de cada linha.

 mcflys = 

Você também pode usar uma combinação destes dois estilos de declaração.

o exemplo seguinte…

woah = 

…é o equivalente a:

woah = 

que pode ser mais ou menos legível dependendo da sua aplicação. CoffeeScript permite que você faça isso de uma variedade de maneiras para atender às suas necessidades.

objetos

objetos literais ou traços de objetos podem ser declarados como suas contrapartes JavaScript e em algumas outras formas funky.

Dado o seguinte JSON…

…você pode soltar as vírgulas e chavetas:

Enquanto você travessão, com algum espaço em branco, a estrutura fica aninhada, como seria de esperar.

os intervalos

os intervalos são declarados por dois inteiros separados por dois períodos, embrulhados entre parêntesis rectos.

days = 

os intervalos não são um tipo de objeto padrão em Javascript por isso eles são compilados para arrays.

para obter uma sub-seção de um array você pode passar em um intervalo também. Want to get days from tuesday_to_friday where Monday is 1 and Sunday is 7? Como as matrizes são indexadas a zero, começaríamos à 1 e terminaríamos às 4.

days = tuesday_to_friday = days

Pode substituir secções inteiras de arrays de uma forma semelhante também.

O seguinte…

days = 

Modifica days array para ser .

Você pode usar intervalos para contagem regressiva demasiado por exemplo, seria 100.

Splat

a splat é uma maneira conveniente de aceitar vários valores como argumentos para os métodos.

no exemplo a seguir queremos premiar pontos de kudos a um grupo de usuários do fórum para o número de posts em uma dada semana.

A primeira pessoa recebe 10 pontos, a segunda recebe 6, a terceira recebe 2 e cada um receberá um único ponto.

Vamos criar uma função giveKudos Com firstsecond e third como parâmetros. Para o resto bem usar um splat, que é o nome da variável seguida por 3 períodos. Within the giveKudos method let’s call an un implemented addKudosToUser which takes two parameters, the user and the points to be added. Não nos vamos preocupar com a implementação.é só para fins ilustrativos.

giveKudos = (first, second, third, rest...) -> addKudosToUser first, 10 addKudosToUser second, 6 addKudosToUser third, 2

Next we can use a for in to loop over the rest.

dado que temos uma lista de utilizadores:

users = 

we want Pasan to get 10 points, Amit to get 6, Jim to get 2 and then the rest to get 1.

Temos de passar no blog com os prazos para o método para atribuir corretamente a matriz de valores para os parâmetros assim:

giveKudos users...

Sem esses períodos, users obter atribuiu o first parâmetro e undefined para o resto.

Classes

Classes podem ser declaradas trivialmente em CoffeeScript, que é um Refrescante contraste com o JavaScript muito mais verboso.

primeiro escreva a palavra-chave class, seguida pelo nome da sua classe.os métodos

, incluindo o método do Construtor, são escritos com o nome do método seguido por dois pontos. Espaço em branco é necessário antes de cada nome do método. Você pode então usar o operador de função (->).

class TimeMachine constructor: ->

para instanciar uma instância de um objeto, use a palavra-chave new seguido pelo nome da classe.

time_machine = new TimeMachine

Instance Variables

Instance variables start with an @ symbol. Então podemos ter um piloto

class TimeMachine constructor: (pilot) -> @pilot = pilot

você pode acessá-los através de notação de ponto também.

class TimeMachine constructor: (pilot) -> @pilot = pilot time_machine = new TimeMachine "H. G. Wells"console.log time_machine.pilot

No exemplo acima, a stringH. G. Wells seria impressa no console.

em Vez de @pilot = pilot você pode escrevê-lo em forma abreviada, como este:

class TimeMachine constructor: (@pilot) ->

Herança de Classe

Para escrever uma subclasse, você pode usar extends como este:

class Tardis extends TimeMachineclass DeLorean extends TimeMachine

Vamos dizer TimeMachine tem um método go com um parâmetro que é registrado quando a Máquina do Tempo está prestes a viajar no tempo.

class TimeMachine constructor: (@pilot) -> go: (noise) -> console.log noise

now let’s for each time machine implement go and call thesuper method.

so calling go() on instances of both time machines will print out it’s own respective sound.

sintaxe geral

com CoffeeScript você vai encontrar o seu código mais parecido com uma frase em inglês:

light_bulbs() if switch is on

que é o mesmo que:

light_bulbs() unless switch is not on

embora o último seja mais difícil de analisar do que o primeiro, ele mostra-lhe o âmbito do novo açúcar.

Aqui está uma tabela de equivalentes da página de documentação do CoffeeScript sobre operadores e pseudônimos.

CoffeeScript	JavaScript
é	===
não	!==
não	!
and	&&
or	||
true, yes, on	true
false, no, off	false
@, this	this
of	in
in	no JS equivalent

Existential Operator

CoffeeScript brings another cool operator to the table called the Existential Operator, which is a question mark (?).

digamos que um user ainda não assinou e foi definido. Você deseja que a função de login para ser chamado se o user não está presente, então basta usar o Operador Existencial, como por exemplo:

login() if not user?

Você também pode definir valores padrão, como por exemplo:

year ?= 1885

Você pode usar o Operador Existencial em uma forma similar a um operador ternário. O exemplo seguinte definiria saudação para ser tanto message, se não undefined ou a cadeia `”Hello, World!”.

greeting = message ? "Hello, World!"

finalmente há uma variante de acessor que você pode usar absorver aténull referências quando você está encadeando propriedades em conjunto.

ip = securitySystem.lastUser?().remoteSystem?.ipAddress

Então, em vez de levantar um TypeError isso retornaria undefined.

as compreensões

as compreensões podem tornar o seu código mais legível. No nosso exemplo de kudos tínhamos ofor loop passando por duas linhas, quando podíamos tê-lo escrito numa linha como esta:

outra característica legal de looping sobre as coisas em CoffeeScript é que o loop retorna uma matriz dos resultados desse loop. Digamos que quero contar de 0 a 100 em múltiplos de 10. Tudo o que faço é preparar o meu ciclo com uma atribuição variável como assim:

adicionando parêntesis você pode trazê-lo para uma linha também!

conclusão

Woah! Isso foi muito para absorver, mas como você pode ver CoffeeScript está cheio de saborosa sintaxe açucarada. Por que não dar uma festa no seu próximo projeto JavaScript e ver o que ele compila abaixo do capô?

• guide to CoffeeScript

coffeescript CoffeeScript

• learn programming
• make a website