Actualmente estoy validando mi JavaScript contra JSLint y avanzando, me está ayudando a escribir un mejor JavaScript, en particular al trabajar con la biblioteca Jquery.

Ahora me he encontrado con JSHint , un tenedor de JSLint .
Así que me pregunto por las aplicaciones web, que están basadas en JavaScript, que es la herramienta de validación mejor o más aplicable para trabajar:

• JSLint o JSHint?

Quiero decidir ahora sobre un mecanismo de validación y seguir adelante, usar esto para la validación del lado del cliente.

¿Y la diferencia entre jshint y jslint? Por favor explique en un solo ejemplo de javascript.

Enlaces:

1. jshint - http://www.jshint.com/

2. jslint - http://jslint.com/

[EDITAR]
Esta respuesta ha sido editada. Dejo la respuesta original a continuación para el contexto (de lo contrario, los comentarios no tendrían sentido).

Cuando se hizo originalmente esta pregunta, JSLint fue la principal herramienta de enlace para JavaScript. JSHint era una nueva bifurcación de JSLint, pero aún no se había desviado mucho del original.

Desde entonces, JSLint se ha mantenido bastante estático, mientras que JSHint ha cambiado mucho: ha desechado muchas de las reglas más antagónicas de JSLint, ha agregado una carga completa de nuevas reglas y, en general, se ha vuelto más flexible. Además, ahora está disponible otra herramienta ESLint, que es aún más flexible y tiene más opciones de reglas.

En mi respuesta original, dije que no debes forzarte a seguir las reglas de JSLint; siempre y cuando haya entendido por qué estaba lanzando una advertencia, puede juzgar por sí mismo si debe cambiar el código para resolver la advertencia o no.

Con el conjunto de reglas ultra estricto de JSLint de 2011, este fue un consejo razonable: he visto muy pocos conjuntos de códigos JavaScript que podrían pasar una prueba de JSLint. Sin embargo, con las reglas más pragmáticas disponibles en las herramientas JSHint y ESLint de la actualidad, es una propuesta mucho más realista intentar que su código pase a través de ellas con cero advertencias.

En ocasiones, puede haber casos en los que un linter se quejará de algo que haya hecho intencionalmente; por ejemplo, sabe que siempre debe usarlo, ===pero solo esta vez tiene una buena razón para hacerlo ==. Pero incluso entonces, con ESLint tiene la opción de especificar eslint-disablealrededor de la línea en cuestión para que pueda tener una prueba de pelusa aprobada con cero advertencias, con el resto de su código obedeciendo la regla. (¡simplemente no hagas ese tipo de cosas con demasiada frecuencia!)

[RESPUESTA ORIGINAL SIGUE]

Por supuesto, use JSLint. Pero no se obsesione con los resultados y con la fijación de todo lo que advierte. Le ayudará a mejorar su código y le ayudará a encontrar posibles errores, pero no todo lo que JSLint se queja resulta ser un problema real, así que no sienta que tiene que completar el proceso con cero advertencias.

Casi cualquier código Javascript con una longitud o complejidad significativa producirá advertencias en JSLint, sin importar qué tan bien esté escrito. Si no me cree, intente ejecutar algunas bibliotecas populares como JQuery a través de él.

Algunas advertencias de JSLint son más valiosas que otras: aprenda cuáles hay que tener en cuenta y cuáles son menos importantes. Se debe considerar cada advertencia, pero no se sienta obligado a corregir su código para borrar cualquier advertencia dada; está perfectamente bien mirar el código y decidir que estás contento con él; Hay momentos en que las cosas que a JSlint no le gustan son en realidad lo correcto.

tl; dr comida para llevar :

Si está buscando un estándar muy alto para usted o su equipo, JSLint. Pero no es necesariamente EL estándar, solo un estándar, algunos de los cuales nos llegan dogmáticamente de un dios javascript llamado Doug Crockford. Si quiere ser un poco más flexible, o tener algunos viejos profesionales en su equipo que no aceptan las opiniones de JSLint, o van y vienen entre JS y otros idiomas de la familia C de forma regular, pruebe JSHint.

versión larga :

El razonamiento detrás de la bifurcación explica bastante bien por qué existe JSHint:

http://badassjs.com/post/3364925033/jshint-an-community-driven-fork-of-jslint http://anton.kovalyov.net/2011/02/20/why-i-forked-jslint-to -jshint /

Así que supongo que la idea es que es "impulsado por la comunidad" en lugar de Crockford. En la práctica, JSHint es generalmente un poco más indulgente (o al menos configurable o agnóstico) en algunas "opiniones" sintácticas estilísticas y menores en las que JSLint es muy exigente.

Como ejemplo, si cree que tanto A como B a continuación están bien, o si desea escribir código con uno o más de los aspectos de A que no están disponibles en B, JSHint es para usted. Si crees que B es la única opción correcta ... JSLint. Estoy seguro de que hay otras diferencias, pero esto destaca algunas.

A) Pasa JSHint fuera de la caja - falla JSLint

(function() {
  "use strict";
  var x=0, y=2;
  function add(val1, val2){
    return val1 + val2;
  }
  var z;
  for (var i=0; i<2; i++){
    z = add(y, x+i);
  }
})();

B) Pasa tanto JSHint como JSLint

(function () {
    "use strict";
    var x = 0, y = 2, i, z;
    function add(val1, val2) {
       return val1 + val2;
    }
    for (i = 0; i < 2; i += 1) {
        z = add(y, x + i);
    }
}());

Personalmente, encuentro que el código JSLint es muy agradable de ver, y las únicas características duras con las que no estoy de acuerdo son su odio a más de una declaración var en una función y a var i = 0declaraciones for-loop , y algunos de los requisitos de espacios en blanco para declaraciones de funciones .

Creo que algunas de las cosas de espacios en blanco que aplica JSLint no son necesariamente malas, pero no están sincronizadas con algunas convenciones de espacios en blanco bastante estándar para otros idiomas de la familia (C, Java, Python, etc.), que a menudo son seguido como convenciones en Javascript también. Como estoy escribiendo en varios de estos idiomas durante todo el día y trabajando con miembros del equipo que no les gusta el espacio en blanco al estilo Lint en nuestro código, creo que JSHint es un buen equilibrio. Captura cosas que son un error legítimo o una forma realmente mala, pero no me ladra como lo hace JSLint (a veces, en formas que no puedo deshabilitar) por las opiniones estilísticas o nitpicks sintácticos que no me importan.

Muchas buenas bibliotecas no son Lint'able, lo que para mí demuestra que hay algo de verdad en la idea de que parte de JSLint se trata simplemente de impulsar 1 versión de "buen código" (que es, de hecho, buen código). Pero, de nuevo, las mismas bibliotecas (u otras buenas) probablemente tampoco sean insinuables, así que, touché.

Hay otro "jugador" maduro y desarrollado activamente en el frente de linux de javascript ESLint:

ESLint es una herramienta para identificar e informar sobre patrones encontrados en el código ECMAScript / JavaScript. En muchos sentidos, es similar a JSLint y JSHint con algunas excepciones:

• ESLint usa Esprima para el análisis de JavaScript.
• ESLint usa un AST para evaluar patrones en el código.
• ESLint es completamente conectable, cada regla es un complemento y puede agregar más en tiempo de ejecución.

Lo que realmente importa aquí es que es extensible a través de complementos / reglas personalizados . Ya hay varios complementos escritos para diferentes propósitos. Entre otros , hay:

• eslint-plugin-angular (aplica algunas de las pautas de la Guía de estilo angular de John Papa )
• eslint-plugin-jazmín
• eslint-plugin-backbone

Y, por supuesto, puede usar la herramienta de compilación que prefiera para ejecutar ESLint:

• Grunt-Eslint
• trago-eslint

Tuve la misma pregunta hace un par de semanas y estaba evaluando tanto JSLint como JSHint.

Contrariamente a las respuestas en esta pregunta, mi conclusión no fue:

Por supuesto, use JSLint.

O:

Si está buscando un estándar muy alto para usted o su equipo, JSLint.

Como puede configurar casi las mismas reglas en JSHint que en JSLint. Por lo tanto, diría que no hay mucha diferencia en las reglas que podrías lograr.

Entonces, las razones para elegir una sobre otra son más políticas que técnicas.

Finalmente hemos decidido ir con JSHint por las siguientes razones:

• Parece ser más configurable que JSLint.
• Parece definitivamente más impulsado por la comunidad en lugar de un espectáculo de un solo hombre (no importa cuán genial sea The Man ).
• JSHint coincidió con nuestro estilo de código OOTB mejor que JSLint.

Haría una tercera sugerencia, Google Closure Compiler (y también Closure Linter ). Puedes probarlo en línea aquí .

El compilador de cierre es una herramienta para hacer que JavaScript se descargue y se ejecute más rápido. Es un verdadero compilador para JavaScript. En lugar de compilar desde un lenguaje fuente a un código de máquina, compila desde JavaScript para mejorar JavaScript. Analiza tu JavaScript, lo analiza, elimina el código muerto y reescribe y minimiza lo que queda. También verifica la sintaxis, las referencias de variables y los tipos, y advierte sobre los errores comunes de JavaScript.

Prefacio: Bueno, eso se intensificó rápidamente. Pero decidió sacarlo adelante. Que esta respuesta sea útil para usted y otros lectores.

Sugerencia de código

Si bien JSLint y JSHint son buenas herramientas para usar, a lo largo de los años he llegado a apreciar lo que mi amigo @ugly_syntax llama:

Espacio de diseño más pequeño .

Este es un principio general, al igual que un "monje zen", que limita las elecciones que uno tiene que hacer, uno puede ser más productivo y creativo.

Por lo tanto, mi estilo de código JS de configuración cero favorito actual:

StandardJS .

ACTUALIZACIÓN :

El flujo ha mejorado mucho. Con él, puede agregar tipos a su JS con lo que le ayudará a prevenir muchos errores. Pero también puede mantenerse fuera de su camino, por ejemplo, cuando se interconecta JS sin tipo. ¡Darle una oportunidad!

Inicio rápido / TL; DR

Agregar standardcomo dependencia a su proyecto

npm install --save standard

Luego package.json, agregue el siguiente script de prueba:

"scripts": {
    "test": "node_modules/.bin/standard && echo put further tests here"
},

Para la salida snazzier mientras que el desarrollo, npm install --global snazzyy ejecutarlo en lugar de npm test.

Nota: Verificación de tipo versus Heurística

Mi amigo cuando mencionó el espacio de diseño se refirió a Elm y le animo a que pruebe ese idioma.

¿Por qué? De hecho, JS está inspirado en LISP, que es una clase especial de idiomas, que no tiene tipo . Lenguajes como Elm o Purescript son lenguajes de programación funcional escritos .

Escriba restringir su libertad para que el compilador pueda verificar y guiarlo cuando termine violando el lenguaje o las reglas de su propio programa; independientemente del tamaño (LOC) de su programa.

Recientemente, un colega junior implementó una interfaz reactiva dos veces: una vez en Elm, una vez en React; Eche un vistazo para tener una idea de lo que estoy hablando.

Compare Main.elm(escrito) ⇔ index.js(sin tipo, sin pruebas)

(Nota: el código React no es idiomático y podría mejorarse)

Un comentario final

La realidad es que JS no está tipificado. ¿Quién soy para sugerirte programación escrita ?

Verá, con JS estamos en un dominio diferente: liberados de los tipos, podemos expresar fácilmente cosas que son difíciles o imposibles de dar a un tipo adecuado (lo que ciertamente puede ser una ventaja).

Pero sin tipos hay poco para mantener nuestros programas bajo control, por lo que nos vemos obligados a introducir pruebas y (en menor medida) estilos de código.

Le recomiendo que mire LISP (por ejemplo, ClojureScript ) en busca de inspiración e invierta en probar sus códigos. Lea El camino del subgrupo para hacerse una idea.

Paz.

Bueno, en lugar de hacer configuraciones manuales de pelusa, podemos incluir todas las configuraciones de pelusa en la parte superior de nuestro archivo JS, por ejemplo

Declare todas las var globales en ese archivo como:

/*global require,dojo,dojoConfig,alert */

Declare todos los ajustes de pelusa como:

/*jslint browser:true,sloppy:true,nomen:true,unparam:true,plusplus:true,indent:4 */

Espero que esto te ayudará :)

También hay otra alternativa desarrollada activamente: JSCS : estilo de código JavaScript :

JSCS es una interfaz de estilo de código para imponer mediante programación su guía de estilo. Puede configurar JSCS para su proyecto en detalle utilizando más de 150 reglas de validación, que incluyen ajustes preestablecidos de guías de estilo populares como jQuery, Airbnb, Google y más.

Viene con múltiples ajustes preestablecidos entre los que puede elegir simplemente especificando preseten el .jscsrcarchivo de configuración y personalizarlo: anular, habilitar o deshabilitar cualquier regla:

{
    "preset": "jquery",
    "requireCurlyBraces": null
}

También hay complementos y extensiones creados para editores populares.

Ver también:

• Código perfecto, esfuerzo cero