Кастомный слайдер через прототип

Делаю свой слайдер, написал код через функции, выглядит так https://jsfiddle.net/1dba20o8/
Но залача так и просит сделать решение на прототипе, но хреново пока выходит
Понимаю нужно передать в

 this  

блок который хочу создать слайдером и дальше от него плясать, но не понял как передать в

this 

передал через переменную sliderContainer
пробую сделать объект класса(как я понимаю объект класса это переменная созданная по прототипу класса)

    var mySlider = simpleSlider( document.querySelector('ul') );
    mySlider.sliderInit;

но переменная какогото хранит

undefined

тут пример на объектах https://jsfiddle.net/od7y8wda/1/
Подскажите как правильно передать this в новый объект класса и почему в переменной

mySlider  

хранится

undefined

Спасибо

В переменной mySlider хранится то, что возвращает функция simpleSlider. В коде по ссылке https://jsfiddle.net/od7y8wda/1/ данная функция возвращает undefined (так как явно не указано, что необходимо вернуть).

Для создания же объекта класса необходимо вызвать данную функцию с оператором new.

var mySlider = new simpleSlider( document.querySelector('ul') ); 

Подробнее здесь: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new.

2 лайка

Как понимаю нужно вернуть объект класса, тогда в переменную

    mySlider

запишется объект со свойствами класса и в этой

    mySlider

будут доступны свойства конструктора

    simpleSlider

Новый фидл тут https://jsfiddle.net/od7y8wda/5/
Но опять же вызывая методы из прототипа не получаю никакого результата,

    	setTimeout(function() {
	    var mySlider = new simpleSlider( document.querySelector('ul') );
	    mySlider.sliderInit;
	    mySlider.check;
        }, 1000);

Когда `

     mySlider.sliderInit;

должен расставить элементы слайдера, а `

    mySlider.check;

должен вывести сам объект по переменной

    mySlider

подскажите чего не выполняются функции check и sliderInit

Потому что в данном случае они не вызываются. Функции вызываются так:

someFunc() // вызов функции без аргументов

Конструктор это сделает сам.

Детальнее — функция, запущенная через new, делает следующее:

  1. Создаётся новый пустой объект.
  2. Ключевое слово this получает ссылку на этот объект.
  3. Функция выполняется. Как правило, она модифицирует this, добавляет методы, свойства.
  4. Возвращается this.

Взято отсюда https://learn.javascript.ru/constructor-new#%D0%BA%D0%BE%D0%BD%D1%81%D1%82%D1%80%D1%83%D0%BA%D1%82%D0%BE%D1%80.

1 лайк

То есть, обращаясь к свойству получаем значение и в этом случае я получил саму функцию, а не выполнил ее, правильно?

Спасибо-спасибо-спасибо oggythetoad теперь все работает и прояснилось много чего, и с этого дня мир стал лучше :v:
Само решение тут

Да. Так и есть.

Это же отлично! :smile:

1 лайк