Aplikacja Vue JS

Question

Witam, kupiłem książkę tworzenie reaktywnych aplikacji vue.js 2 , w rozdziale 2 jest  projekt aplikacji liczącej czas pracy i czas relaksu.

const POMODORO_STATES = {
  WORK: 'work',
  REST: 'rest'
};

const WORKING_TIME_LENGTH_IN_MINUTES = 1;
const RESTING_TIME_LENGTH_IN_MINUTES = 5;

new Vue({
  el: '#app',
  data: {
    state: STATES.STOPPED,
    minute: WORKING_TIME_LENGTH_IN_MINUTES,
    second: 0,
    pomodoroState: POMODORO_STATES.WORK,
    timestamp: 0
  },
 methods: {
    start: function () {
      this.state = STATES.STARTED;
      this._tick();
      this.interval = setInterval(this._tick, 1000);
    },

    _tick: function () {
      // jeżeli wartość second jest większa od 0, zmniejsz ją o 1
      if (this.second !== 0) {
        this.second--;
        return;
      }
      // jeśli second ma wartość 0, ale minute nie, zmniejsz minute o 1 i nadaj second wartość 59
      if (this.minute !== 0) {
        this.minute--;
        this.second = 59;
        return;
      }
      // jeśli i second, i minute są równe 0, przełącz między czasem pracy a odpoczynkiem
      this.pomodoroState = this.pomodoroState === POMODORO_STATES.WORK ? POMODORO_STATES.REST : POMODORO_STATES.WORK;
      if (this.pomodoroState === POMODORO_STATES.WORK) {
        this.minute = WORKING_TIME_LENGTH_IN_MINUTES;
      } else {
        this.minute = RESTING_TIME_LENGTH_IN_MINUTES;
      }
    }
  }
});

Potrzebuję osoby która mi wytłumaczy działanie tego programu. Na jakiej zasadzie powstała wartość this._tick() ?

Nie mogę znaleźć rozwiązania na koniec kodu: 

      this.pomodoroState = this.pomodoroState === POMODORO_STATES.WORK ? POMODORO_STATES.REST : POMODORO_STATES.WORK;
      if (this.pomodoroState === POMODORO_STATES.WORK) {
        this.minute = WORKING_TIME_LENGTH_IN_MINUTES;
      } else {
        this.minute = RESTING_TIME_LENGTH_IN_MINUTES;

co oznaczają =, ===, ? , : 

nie widzę wytłumaczenia w książce a na w dokumentacji się słabo poruszam.

Answer 1

Powinieneś zacząć od początku, czyli od czystego javascript , bo to o co pytasz to podstawa JS a dokładnie operatory.

 

Answer 2

= oznacza przypisanie

=== oznacza identyczne czyli nie dość że coś musi równać się czemuś to też musi mieć taki sam typ

i tak jak kolega powyżej przeczytaj jakąś książkę bo to są podstawy ja mogę polecić ci Javascript i Jquery interaktywne strony www dla każdego

Answer 3

znaki równości to się domyśliłem, że chodzi o js , jedynie zdziwiło mnie te : i ?  tego nie mogłem przypisać

 

Comments

https://msdn.microsoft.com/pl-pl/library/be21c7hw(v=vs.94).aspx

Answer 4

Już prawie wszystko rozumiem, tylko mam dwa problemy, po co jest przypisanie this.pomodoroState = this.pomodoroState, rozumiem że jest to operator przypisania ale po co do dwóch takich samych. Drugie pytanie jak są pobierane wartości z work i rest bo funkcja start i rest o tym nic nie wspomina.

Comments

A gdzie jest to this.pomodoroState = this.pomodoroState?

---

38 linijka

---

W 38 linijce nie ma this.pomodoroState = this.pomodoroState a jest:

this.pomodoroState = this.pomodoroState === POMODORO_STATES.WORK ? POMODORO_STATES.REST : POMODORO_STATES.WORK;

i jest to skrócony zapis 'if'. Można to przetłumaczyć tak:

Jeśli this.pomodoroState jest równe POMODORO_STATES.WORK to wtedy zwróć POMODORO_STATES.REST, czyli this.pomodoroState = POMODORO_STATES.REST. W przeciwnym przypadku zwróć POMODORO_STATES.WORK, czyli this.pomodoroState = POMODORO_STATES.WORK,