javascriptecmascript-6babeljs

Variable simultaneously true and false


This is my code

class ToolDispatcherBlueprint extends Destroyable {
  _tool;
  _dispatchRegister = null;

  _state = {
    selectedTool: null,
    selectedElement: null,
    hoveredElement: null,
    keyboardKeyDown: null,
    keyboardKeyUp: null,
    mousedown: false,
    mouseup: true,
    mousemove: false
  };

  constructor(paper) {
    super();
    this._tool = new paper.Tool;

    let dispatchOnKeyDown = (event) => {
      this._state.keyboardKeyDown = event;
      this.dispatch(event);
    };

    let dispatchOnKeyUp = (event) => {
      this._state.keyboardKeyUp = event;
      this.dispatch(event);
    };

    let dispatchOnMouseDown = (event) => {
      this._state.mouseup = false;
      this._state.mousemove = false;
      this._state.mousedown = true;
      console.log("dispatcher", this._state.mousedown, this._state);
      this.dispatch(event);
 ...

The issue is that I get a log which indicates both that mousedown is true and false simultaneously. I expect it to indicate true and the property of _state to also indicate true ie. _state.mousedown: true

enter image description here


Solution

  • It's not what you think. When it is printed, the true comes through. But the object is held by reference by the dev tools. It is only evaluated when you expand the object, and by that time, your mousedown event has ended.