Expected ':' and instead saw '_variableName'

Question

I am confused where to declare these variables so I can use them as obj.slider._minVal & obj.slider._maxVal. I am getting JShint errors:

var _minVal = 75; ^ Expected ':' and instead saw '_minVal'. var _minVal = 75; ^ Expected an identifier and instead saw '='.

var obj = obj || {};

obj.slider = {
var _minVal=75, //Confused where to define these variables so it's available 
    _maxVal=300;//in _createSlider();

init:function(){
    console.log('Initialization of Slider');
    var $this = $(this);

    this._createSlider();
    return false;
},

// setSliderMin:function(sliderId, minVal){

// },

_createSlider:function(){
    $('.slider-range').slider({
      range: true,
      min: obj.slider._minVal,
      max: obj.slider._maxVal,
      values: [obj.slider._minVal, obj.slider._maxVal],
      slide: function( event, ui ) {
        $( '#amount' ).val( '$' + ui.values[ 0 ] + ' - $' + ui.values[ 1 ] );
        var handle = $(this).find('.ui-slider-handle');
        $('.ui-slider-handle:first').html('<div class="tooltip bottom slider-tip"><div class="tooltip-arrow"></div><div class="tooltip-inner">' + ui.values[0] + '</div></div>');
        $('.ui-slider-handle:last').html('<div class="tooltip bottom slider-tip"><div class="tooltip-arrow"></div><div class="tooltip-inner">' + ui.values[1] + '</div></div>');
      }
    });

    var value = $( '#slider-range' ).slider( 'option', 'values' );

    $('.ui-slider-handle:first').html('<div class="tooltip bottom slider-tip"><div class="tooltip-arrow"></div><div class="tooltip-inner">' + value[0] + '</div></div>');
    $('.ui-slider-handle:last').html('<div class="tooltip bottom slider-tip"><div class="tooltip-arrow"></div><div class="tooltip-inner">' + value[1] + '</div></div>');
}
};

obj.slider.init();

});

Answer 1

The syntax for member variables is the same as for member functions:

key1: val,
key2: val

Change your object to use the key/value syntax:

obj.slider = {
    _minVal: 75,
    _maxVal: 300,
    _createSlider: function() {...},
    init: function() {...}
};

Alternatively, you may want to use a function if you would like hidden variables and perhaps more natural code:

obj.slider = function() {
    var _minVal = 75,
        _maxVal = 300,
        _createSlider = function() {...};
    (this.init = function() {...})();
};

var slider = new obj.slider();
// later on you can reset by calling
slider.init();

JSFiddle