Проверка наличия свойств в JavaScript

Question

Я новичок в JavaScript и немного запутался в концепции утки. Насколько я могу сказать, я понял концепцию. Но это приводит к странным последствиям в моих мыслях. Я объясню на следующем примере:

В настоящее время я работаю над мобильным веб-приложением с помощью jQuery Mobile. В какой-то момент я фиксирую vmousedown событие для холста. Я заинтересован в давлении прикосновения. Я нашел Touch.webkitForce имущество.

$('#canvas').live('vmousedown', function(e){
    console.log(e.originalEvent.originalEvent.touches[0].webkitForce);
}

Это прекрасно работает при использовании удаленной отладки для Chrome. Но выдает исключение при тестировании в Opera Firefly, потому что originalEvent свойство не событие касания, а событие щелчка.

Поэтому каждый раз, когда я получаю доступ к свойству объекта, который не находится в моей компетенции, я должен проверять существование и тип?

if( e.originalEvent &&
    e.originalEvent.originalEvent &&
    e.originalEvent.originalEvent.touches && 
    e.originalEvent.originalEvent.touches[0] && 
    e.originalEvent.originalEvent.touches[0].webkitForce) {

    console.log(e.originalEvent.originalEvent.touches[0].webkitForce);
}

Может ли кто-нибудь уточнить, что для меня?

Answer 1

Поэтому каждый раз, когда я получаю доступ к свойству объекта, который не находится в моей компетенции, я должен проверять существование и тип?

Да, вам придется проверять весь путь, по одному, или вы можете автоматизировать его:

function deepObject(o, s) {
    var ss = s.split(".");

    while( o && ss.length ) {
        o = o[ss.shift()];
    }

    return o;
}

var isOk = deepObject(e, "originalEvent.originalEvent.touches.0.webkitForce");

if ( isOk ) {
    // isOk is e.originalEvent.originalEvent.touches.0.webkitForce;
}

---

Прецедент:

var o = {
  a: {
    b: {
      c: {
        d: {
          e: {
          }
        }
      }
    }
  }
}

var a = deepObject(o, "a.b.c");
var b = deepObject(a, "d");

console.log(a); // {"d": {"e": {}}}
console.log(b); // {"e": {}}
console.log(deepObject(o, "1.2.3.3")); // undefined

Answer 2

Используйте попробовать поймать

$('#canvas').live('vmousedown', function(e) {
   try {
       console.log(e.originalEvent.originalEvent.touches[0].webkitForce);
   } catch(e) {
       console.error('error ...');
   }
}

Answer 3

Поскольку вы используете конкретную платформу для захвата ваших событий, я думаю, вы должны предположить, что originalEvent всегда определен. Если это не так, то, вероятно, было бы неплохо выдать ошибку, поскольку где-то во время захвата события что-то явно не получалось.

Тем не менее, событие может быть MouseEvent или TouchEvent, также свойство webkitForce может не поддерживаться. Это те случаи, которые вы можете обнаружить:

// assume that originalEvent is always be defined by jQuery
var originalEvent = e.originalEvent.originalEvent;
if (originalEvent instanceof TouchEvent) {  // if touch events are supported
  // the 'touches' property should always be present in a TouchEvent
  var touch = originalEvent.touches[0];
  if (touch) {
      if (touch.webkitForce) {
        // ...
      } else {
        // webkitForce not supported
      }
  }  // else no finger touching the screen for this event
} else {
   // probably a MouseEvent
}