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

Ответ 1

На самом деле, если вы правильно прочитали сообщение об ошибке, случай 1 и случай 2 выдают разные ошибки.

Case axy:

Невозможно установить свойство 'y' из неопределенного

Дело axyz:

Невозможно прочитать свойство 'y' из неопределенного

Думаю, лучше всего описать это пошаговым исполнением на простом английском языке.

Случай 1

// 1. Declare variable 'a'
// 2. Define variable 'a' as {}
var a = {}

// 1. Declare variable 'b'
// 2. Define variable 'b' as {}
var b = {}

try {

  /**
   *  1. Read 'a', gets {}
   *  2. Read 'a.x', gets undefined
   *  3. Read 'b', gets {}
   *  4. Set 'b.z' to 1, returns 1
   *  5. Set 'a.x.y' to return value of 'b.z = 1'
   *  6. Throws "Cannot **set** property 'y' of undefined"
   */
  a.x.y = b.z = 1
  
} catch(e){
  console.error(e.message)
} finally {
  console.log(b.z)
}

Ответ 2

Порядок операций более понятен, когда вы используете оператор запятой внутри скобки, чтобы увидеть, какие части выполняются, когда:

var a = {}
var b = {}

try{
 // Uncaught TypeError: Cannot set property 'y' of undefined
  a
    [console.log('x'), 'x']
    [console.log('y'), 'y']
    = (console.log('right hand side'), b.e = 1);
} catch(err) {
  console.error(err);
}
console.log(b.e) // 1

Ответ 3

Рассмотрим следующий код:

var a = {};
a.x.y = console.log("evaluating right hand side"), 1;