javascript - true - ¿Jshint entiende Angular?

jshintrc

Question

jshint está lanzando un error al definir un módulo angular (o directiva, o fábrica) como lo recomiendan las guías de estilo Angular (por John Papa o Todd Motto ). Por ejemplo, para un controlador como este:

(function () {
    ''use strict'';

    angular
        .module(''myApp'')
        .controller(''myAppCtrl'', theController);

    function theController() {...}

})();

... jshint lanza este error:

''theController'' was used before it was defined.

La aplicación angular funciona perfectamente a pesar de estos errores. Sin embargo no sé por qué protesta jshint ...

¿Qué me estoy perdiendo? Me pregunto si jshint es un buen evaluador de la calidad del código angular (a pesar de que se incluye con los paquetes populares como generador angular) o soy yo que estoy haciendo algo mal (aunque mi aplicación funciona).

¡Gracias por adelantado!

Answer 1

Bueno, primero de incluir angular en sus "variables globales", por ejemplo:

"globals": { // Global variables.
        "jasmine": true,
        "angular": true,
        "browser": true,
        "element": true,
        "by":true,
        "io":true,
        "_":false,
        "$":false
    }

luego mueva la definición de su función antes de que haga referencia a ella desde angular.

(function () {
    ''use strict'';

    function theController() {...}

    angular
        .module(''myApp'')
        .controller(''myAppCtrl'', theController);
})();

Answer 2

Por lo tanto, otra opción, que hace feliz a cada interlocutor, es declarar la variable que mantendrá la función primero, usarla como parámetro y luego definirla.

Pero personalmente no estoy seguro de que me guste el flujo aquí. Creo que me gusta más la respuesta de Jack, pero esto está un poco más cerca de lo que papá parece preferir, si estás de acuerdo con su guía de estilo . En realidad, no estoy seguro de por qué esto no es lo que recomienda, si realmente quiere que aparezcan las funciones después de que se usen (y lo hace). De lo contrario, no puede usar su estilo con latedef configurado como verdadero en JSHint o JSLint.

(function () {
    ''use strict'';
    var theController;

    angular
        .module(''myApp'')
        .controller(''myAppCtrl'', theController);


    theController = function () {
        return "so jslint doesn''t complain about empty blocks";
    };
}());

Answer 3

Su código debería funcionar, pero jshint intentará que usted codifique de una manera muy estricta. Como mínimo, es una "buena práctica" tener sus funciones definidas antes de usarlas. Como mencioné en el comentario anterior, creo que los motores javascript más antiguos se ejecutan de arriba a abajo (aunque no puedo recordarlo y no podemos probar), por lo que si desea obtener el soporte más amplio posible, querrá escuchar jshint

Algo que vale la pena notar aquí es que si usa la palabra clave var para definir su función, obtendrá un error, que se explica mejor con el ejemplo:

Esto funciona ( http://jsfiddle.net/ryanwheale/kr8L825p/ )

(function() {
    try {
        foo();
    } catch(ex) {
        alert("ahhhhh, what''s going on?!?!?/n/n" + ex.message);
    }

    function foo() {
        alert("I was hoisted to the top of this scope before execution :)");
    }
})();

... pero esto no ( http://jsfiddle.net/ryanwheale/kr8L825p/4/ )

(function() {
    try {
        foo();
    } catch(ex) {
        alert("ahhhhh, what''s going on?!?!?/n/n" + ex.message);
    }

    var foo = function() {
        alert("I was hoisted to the top of this scope before execution :)");
    }
})();

Answer 4

Usa la propiedad latedef y latedef en false . Esto permite el levantamiento de funciones, que IMO está bien. Pero todavía se informa sobre el levantamiento de vars, lo que es malo OMI