Blues de cifrão: Javascript e PHP

18

Eu cresci programando C ++ e Java, onde tudo era seguro e bonito. Os compiladores fizeram questão de me manter sob controle, se alguma vez me desviei. Claro, todo mundo fez um pouco de Perl na faculdade, mas eu não inspirei. Hoje em dia, as crianças são sobre PHP no back-end e Javascript na frente. Ao tentar ser moderno, faço o mesmo (para desenvolvimento web). O problema que eu continuo enfrentando é que acidentalmente adiciono um sinal de dólar ($) na frente de variáveis ​​regulares em Javascript e, é claro, ninguém diz nada porque essa sintaxe legal é frequentemente usada para objetos jQuery.

Existem ferramentas de depuração ou truques de desenvolvimento para capturar essa confusão de cifrão? Você costuma cometer o mesmo erro e como lida emocionalmente? As ferramentas de desenvolvimento do Chrome nem sempre veem que isso é um erro de Javascript. Eu uso o PhpStorm e o Emacs para desenvolvimento, mas eles não pegam minha estupidez, embora eu suspeite que o Emacs o faça, mas opte por não me falar sobre isso por despeito.

Se você acha que essa pergunta é ridícula, acho que você está certo. Mas vivemos em um mundo em que uma variável tem um cifrão na frente. Nesse mundo, nada é ridículo.

Alan Turing
fonte
2
Emocionalmente? Basta atacar seus colegas.
Chris Schiffhauer
@ ChrisSchiffhauer Infelizmente, trabalho na academia, onde o isolamento é o nome do jogo. Eu teria que agendar uma reunião com um colega para durar, e isso acabaria com a espontaneidade de tudo.
Alan Turing

Respostas:

11

Não há nada de errado em usar $variáveis. Eu não faria isso de propósito em todas as variáveis, mas ainda é uma sintaxe válida. O jQuery é um dos exemplos em que $é usado como um nome de variável. É também por isso que "as ferramentas de desenvolvimento do Chrome nem sempre veem que isso é um erro de Javascript" , porque não há erro em primeiro lugar.

Se você tem medo de escrever código como:

var demo = function demo() {
    var a = 123;
    ...
    $a = 456; // A new variable is created in global scope.
}

você precisará usar um verificador de estilos, como jsLint , jsHint ou Google Closure Linter . Qual desses? Cabe a você fazer uma escolha. Para ajudá-lo, aqui estão algumas notas:

Estilo

O Google Closure Linter segue o Google JavaScript Style Guide , conhecido por ser feito de maneira inteligente. Usar um estilo conhecido para JavaScript ou qualquer um dos outros seis idiomas é uma boa idéia: quando você compartilha seu código ou contrata um novo desenvolvedor, é provável que eles já estejam familiarizados com esse estilo.

Muitos desenvolvedores também estão familiarizados com o estilo de Douglas Crockford. Esse estilo é explicado em detalhes em JavaScript: The Good Parts , um livro que vale a pena ser comprado por qualquer pessoa que trabalhe com JavaScript.

Quanto ao jsHint, não consigo encontrar realmente quais convenções são usadas, e o próprio site parece evitar falar sobre esse assunto. Talvez eu tenha perdido alguma coisa.

Apoio dos IDEs

O jsLint e o jsHint são suportados pelo PhpStorm. Este também é o caso do Google Closure Linter.

Meio Ambiente

O Google Closure Linter é uma de uma série de ferramentas . Se você já usa o Google Closure Compiler ou a Google Closure Library , é preferível escolher o Closure Linter acima de outras ferramentas.

Rigor

O jsLint é conhecido por ser rigoroso. O jsHint é mais permissivo, o que nem sempre é uma coisa boa. Por exemplo, um dos motivos para bifurcar o jsLint para o jsHint é explicado em um artigo que mostra código incorreto que produzirá um erro no jsLint, mas não no jsHint:

/*global jQuery */

// Example taken from jQuery 1.4.2 source
jQuery.extend({
    /* ... */

    isEmptyObject: function( obj ) {
        for ( var name in obj ) {
            return false;
        }
        return true;
    }

    /* ... */
});

O código é ruim, porque parece que o JavaScript tem escopo de bloco, enquanto não tem. Veja JavaScript: The Good Parts, p. 102, Apêndice A: Peças horríveis, escopo. Em outras palavras, olhando o código sem conhecer o idioma, esperamos namenão estar visíveis fora do loop, enquanto ele permanecerá visível.

Quanto ao Google Closure Linter, acredito que esteja em algum lugar entre jsLint e jsHint, mas não tenho informações suficientes para dar suporte a isso.

Conclusão

Eu evitaria o jsHint: é muito permissivo, o que significa que não encontraria possíveis erros que os outros linters detectariam. O guia de estilo usado é difícil de encontrar.

Entre o jsLint e o Google Closure Linter, a escolha não é óbvia. Ambos são escritos por especialistas, seguem um guia de estilo rigoroso e bem descrito, já seguido por milhares de desenvolvedores. Use os dois por algum tempo e escolha um que seja mais prático para você.

Arseni Mourzenko
fonte
+1: me derrote. I começou a cair meus ponto e vírgula quando eu mudar de idioma de F # para C #, para que eu possa compartilhar a sua dor;)
scrwtp
2
Apenas uma observação, como o OP está usando o PhpStorm: o JSLint e o JSHint são integrados e podem ser configurados para inspecionar seu código sob demanda ou mesmo em tempo real. Erros como o do seu exemplo são bastante fáceis de detectar.
yannis