Incorrect JSHint warning “variable is defined but never used.”

Question

I have the following JS code:

var func = function (dimension) {
  var element,
      minSize = "min-" + dimension,
      maxSize = "max-" + dimension;           

  element = jQuery('<div>');
  element.css({
    maxSize: "",
    minSize: ""
  });

};

func();

JSHint throws me the following warnings:

Two unused variables

3 minSize

4 maxSize

Why? It is obvious that I'm using them.

Answer 1

The variables are assigned but not used.

Assignment:

minSize = "min-" + dimension, maxSize = "max-" + dimension;

Not using minSize or maxSize but creating two properties with the same names on an anonymous object :

element.css({ maxSize: "", minSize: "" });

Answer 2

you havn't use the variable. you can't use literal object with variable as key. try

var func = function (dimension) {
  var element,
      minSize = "min-" + dimension,
      maxSize = "max-" + dimension;           

  element = jQuery('<div>');
  var obj={};
  obj[maxSize]=""
  obj[minSize]=""

  element.css(obj);

};

func();