Three.js: Revisitando o guia de estilo?

Criado em 19 jul. 2018  ·  16Comentários  ·  Fonte: mrdoob/three.js

Tenho certeza que isso está abrindo uma lata de minhocas, mas o [guia de estilo] parece um pouco desatualizado e gostaria de sugerir 2 mudanças

prefere const e let a var ?

Não sei por que var é preferido (foi dito para mudar para var em um PR recente). Meu palpite é porque foi aí que tudo começou e porque const e let são novos. Mas agora que a base de código está usando módulos ES5, parece que qualquer razão para manter var acabou. Por causa das linhas import , para o código funcionar em navegadores que suportam apenas var o código deve ser executado por meio de um transpiler. Esse mesmo transpiler é / já converterá const e let em var .

Além disso, existem objetivos positivos concretos no uso de const e let sobre var . Ambos têm como escopo chaves em vez do escopo da função. Nem crie variáveis ​​globais ao contrário de var . Claro, grande parte do código usa var agora (embora IIRC eslint possa consertar isso automaticamente). Alterar o linter para exigir const e let e alterar lentamente o código legado evitará mais erros e vazamentos. Também com const e let usados ​​em todos os lugares, é possível habilitar o eslint para verificar se há mais variáveis ​​indefinidas que, pelo menos para mim, foram de grande ajuda.

Houve um tempo em que var era mais rápido, mas esse tempo já se foi.

É hora de parar de usar var ?

permite vírgulas finais em matrizes e objetos com várias linhas

Esta pode ser uma preferência pessoal do Sr. Doob, mas meu palpite é mais que isso é um resto da época do IE. O IE não suportava uma vírgula final, mas agora que a transpilação está acontecendo, as vírgulas finais são removidas pelo transpiler para compatibilidade com o IE. Para os desenvolvedores, as vírgulas finais são uma vitória, pois levam a menos erros. Erros que geralmente são detectados, mas erros que geralmente requerem pelo menos uma iteração para serem detectados, rodando no navegador e vendo o erro de sintaxe, voltando e editando vírgulas. Pelo menos na minha experiência, as vírgulas evitam esse problema.

Ao seguir vírgulas em matrizes e objetos com várias linhas, quero dizer, por exemplo

 const sizes = [
     100,
     200,
     300,
 ];

e

 const options = {
    width: 100,
    height: 200,
    depth: 300,
};

Com vírgulas no final, adicionar ou remover linhas requer apenas lidar com uma única linha. Com vírgulas finais, significa sempre ter que estar ciente da última vírgula e removê-la ou adicioná-la.

Claro que tudo o que for decidido está bem, vou seguir o guia para RP. Só pensei em perguntar quando o código mudou para módulos ES5 se fosse hora de revisitar parte do guia de estilo (observe que a parte var não está realmente no guia de estilo.)

Suggestion

Comentários muito úteis

Os intérpretes JS removem essa vírgula hoje em dia?

Todos os navegadores aceitaram essa vírgula em matrizes e objetos por> 10 anos, exceto o IE

Deixe-me acrescentar, em vez de olhar para isso como algo estranho, outro POV é que a sintaxe é na verdade a vírgula é necessária, é apenas o navegador que dá uma pausa e não exige a última. O estranho de uma pessoa é o embelezamento de outra. Acho a consistência de cada linha sendo a mesma pessoalmente mais agradável do que a última linha sendo diferente. É claro que essas são preferências pessoais, estou apenas apresentando uma outra maneira de ver as coisas.

quanto às diferenças, encontrei essas comparações online

sem vírgula final diff adicionando uma linha

vírgula final diff adicionando uma linha

Todos 16 comentários

Houve um tempo em que var era mais rápido, mas esse tempo já se foi.

no que você está baseando isto? IIRC da última vez que testamos isso, não houve diferença para const mas let foi um pouco mais lento. Seria bom ver alguns testes atualizados sobre isso.

permite vírgulas finais em matrizes e objetos com várias linhas

Definitivamente, concordo com essa mudança, se não houver problemas com o IE (ainda queremos oferecer suporte pelo menos ao IE 10 e 11, certo?).

Houve um tempo em que var era mais rápido, mas esse tempo já se foi.

no que você está baseando isto? IIRC da última vez que testamos isso, não houve diferença para const mas let foi um pouco mais lento. Seria bom ver alguns testes atualizados sobre isso.

Sim, alguns números ajudariam nesta decisão.

permite vírgulas finais em matrizes e objetos com várias linhas

Ao seguir vírgulas em matrizes e objetos com várias linhas, quero dizer, por exemplo

const sizes = [
    100,
    200,
    300,
];

Meu cérebro lê assim:

 const sizes = [
     100,
     200,
     300, undefined
 ];

Os intérpretes JS removem essa vírgula hoje em dia?

Eu, pessoalmente, não voto para permitir vírgulas finais em matrizes de várias linhas, pois também acho incomum de ler.

Para mim, o propósito de colocar vírgulas no final é tornar mais rápido adicionar e remover itens, bem como reordená-los recortando / colando. Não precisa se preocupar se você acabou de cortar o último item ou não, todas as linhas são iguais. Quanto a ver undefined , é fácil evitar que se você souber que há apenas um item por linha - e nos casos em que a matriz está em uma linha como [1, 2, 3, 4, 5] você não adicionaria uma vírgula final.

Por outro lado, não acho que isso importe de qualquer maneira. A mudança para const / let é a questão importante aqui.

... mas agora que transpilar está acontecendo ...

Não estamos transpilando, certo? O rollup apenas substitui a sintaxe de importação / exportação do ES6, deixando todo o resto sozinho, a menos que você adicione plug - ins como let / const são suportados no IE11 de qualquer maneira.

As vírgulas finais também servem a um propósito muito maior do que apenas "facilidade de uso". Em projetos maiores, onde muitas pessoas contribuem, é útil usar coisas como git blame para descobrir quem é responsável por cada parte do código.

Portanto, afirmando o óbvio aqui: se houver coisas listadas em várias linhas que foram adicionadas por @mrdoob , e mais tarde eu adicionaria uma linha lá, meu nome seria mostrado na última linha do código que eu não escrevi.

Pessoalmente, sou contra o uso de vírgulas finais pelo mesmo motivo que as pessoas declararam antes de mim, mas vejo os benefícios e estou me acostumando agora que também aplicamos isso no escritório desde este ano.

Os intérpretes JS removem essa vírgula hoje em dia?

Sim.

Em relação ao uso de let vs var :

A diferença entre let e var não importa mais atualmente se se trata de desempenho. V8 e Spidermonkey (Firefox) têm ótimas otimizações atualmente que funcionam muito bem.

Veja esta postagem para uma elaboração (certifique-se de executar os trechos reais para ver que a diferença é praticamente desprezível agora): https://stackoverflow.com/questions/37792934/why-is-let-slower-than-var- in-a-for-loop-in-nodejs

A resposta aceita dessa pergunta SO também aponta as diferenças entre var e let de uma perspectiva funcional, uma vez que ambos têm significados e casos de uso _muito_ diferentes, caso isso não seja claro para ninguém.

O uso de const para variáveis ​​que nunca mudam é um acéfalo. Se o mecanismo javascript pode ver que uma variável está declarada com const , ele sabe que seu valor nunca mudará novamente, então pode ser altamente otimizado.

Apenas meus 2 centavos.

Para referência:

As vírgulas finais são um dos melhores padrões js que já vi e tornam os diffs muito mais legíveis.

Os intérpretes JS removem essa vírgula hoje em dia?

Todos os navegadores aceitaram essa vírgula em matrizes e objetos por> 10 anos, exceto o IE

Deixe-me acrescentar, em vez de olhar para isso como algo estranho, outro POV é que a sintaxe é na verdade a vírgula é necessária, é apenas o navegador que dá uma pausa e não exige a última. O estranho de uma pessoa é o embelezamento de outra. Acho a consistência de cada linha sendo a mesma pessoalmente mais agradável do que a última linha sendo diferente. É claro que essas são preferências pessoais, estou apenas apresentando uma outra maneira de ver as coisas.

quanto às diferenças, encontrei essas comparações online

sem vírgula final diff adicionando uma linha

vírgula final diff adicionando uma linha

Vamos começar com let e const primeiro. Um passo de cada vez.

screen shot 2018-07-30 at 5 03 00 pm

Acho que esses tempos estão muito perto de chamar. Eu obtenho resultados diferentes

screen shot 2018-07-31 at 9 13 50

Embora no Chrome 70 eles não sejam nem remotamente próximos

screen shot 2018-07-31 at 9 15 36

enquanto estamos nisso

screen shot 2018-07-31 at 9 19 20

screen shot 2018-07-31 at 9 20 18

Deixe-me adicionar mais um ponto de vista para as vírgulas finais 😜 Você pode ver as vírgulas finais semelhantes ao ponto e vírgula

Este é um código perfeitamente legal

 {
      doThis();
      doThat();
      doOther()
 }

A última linha sem ponto e vírgula. Um ponto de vista é ver a vírgula como a mesma coisa. Talvez seja como a ilusão de pessoas / lâmpada.

Quer você veja 2 pessoas ou um bastão de luz, ambos são válidos. Mas, nesse caso, com vírgula, uma vez que ambos os POVs se encaixam ("vírgula no final parece indefinida" vs "vírgula ausente parece inconsistente"), um tem benefícios objetivos e o outro não ...?

Tentei adicionar const em algum lugar do código e ele não compila mais ...

screen shot 2018-07-30 at 5 58 46 pm

@mrdoob O formato de saída deve ser definido como ES6 vez de ES ou ES5 .

Fechando em favor de # 6419.

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

Bandit picture Bandit  ·  3Comentários

yqrashawn picture yqrashawn  ·  3Comentários

ghost picture ghost  ·  3Comentários

konijn picture konijn  ·  3Comentários

filharvey picture filharvey  ·  3Comentários