Jshint | Passing default settings | Function declarations and 'this'

问题

for ( element = 0; element < this.tag_array.length; element++ ) {
    document.getElementById( this.tag_array[element] ).addEventListener(
    "click", function(){ /* constructor function here */ } );  // jshint.com error #1
}

This code will cause an error in jshint.com b.c. it does not want to see functions declared in a loop.

However, if I pass in a simple function reference then I can not extract out 'this' with out once again breaking jshint.

for ( element = 0; element < this.tag_array.length; element++ ) {
    document.getElementById( this.tag_array[element] ).addEventListener(
    "click", vFlipBP );
}

Now I've when I use 'this' in vFlipBP, I get an error b.c. it expects 'this' to be used in conjunction with a constructor function.

function vFlipBP(){ var foo = this ; } // jshint error #2

Because of this, I find it impossible to make jsthint.com happy in this particular function.

Nevermind turning off the jshint.com options.

Is it possible to write code that passes jshint.com default settings.

I'm just trying to understand the reasoning behind why it makes these warnings/errors.

I'm not hung up on worrying about the error ( it is optional I could just turn it off )...I just want to know if it is possible to pass the default...is there an angle I missed.

回答1:

Since you don't seem concerned about making several identical functions, it seems that JSHint doesn't mind this...

var element;
for ( element = 0; element < 10; element++ ) {
    document.getElementById( this.tag_array[element] ).addEventListener(
    "click", make_func() );
}

function make_func() {
  "use strict";
  return function(){ var foo = this; alert(foo); };
}

It also seems accepting if you don't use the function declaration syntax...

var element;
var the_func = function(){ 
  "use strict";
  var foo = this; 
  alert(foo); 
};


for ( element = 0; element < 10; element++ ) {
    document.getElementById( this.tag_array[element] ).addEventListener(
    "click", the_func );
}

回答2:

It looks like you'd like to use this as the context in the callback but jshint complains about using this in a function that is not a constructor.

So suppose this is the code you had

function showId() {
   alert(this.id); // jshint warning here
}
for ( element = 0; element < this.tag_array.length; element++ ) {
    document.getElementById( this.tag_array[element] ).addEventListener(
    "click", showId ); 
}

You'd have to rewrite your function so it doesn't use this, here's a possible way

function createHandler(obj) {
    return function(e) {
        alert(obj.id);
    }
}

for ( element = 0; element < this.tag_array.length; element++ ) {
    var nodeId = this.tag_array[element];
    var node =  document.getElementById(nodeId);
    node.addEventListener("click", createHandler(node)); 
}

Can't you tell jshint that this specific function is safe to use this? With the validthis this option? In Google Closure Compiler you can do so by using the @this to specify that you know what this will be in that function (and avoid the warning) https://developers.google.com/closure/compiler/docs/js-for-compiler

来源：https://stackoverflow.com/questions/11961735/jshint-passing-default-settings-function-declarations-and-this

标签

javascript

jshint