首页 > javascript > 为什么这些三元表达式会产生不同的结果?

为什么这些三元表达式会产生不同的结果? (Why do these ternary expressions give different results?)

2019-03-05 javascriptreduce

问题

我的第一个reduce返回一个表单形式: a + (condition)? b : c和我的第二个reduce返回等价的(???)表达式:(condition)? a+b : a+c 为什么它们表现不同?

function addressLengthWrong(address) {
  let keys = ['street', 'city', 'state', 'zip']
  return keys.reduce((acc, key) => acc + (address[key]) ? address[key].length : 0, 0)
}

let address = {
  street: 'My Street',
  city: '',
  state: '',
  zip: ''
}
console.log(`wrong address len ${addressLengthWrong(address)}`)

address.zip = '01234'
console.log(`wrong address len ${addressLengthWrong(address)}`)


运行替代方案......

function addressLengthCorrect(address) {
  let keys = ['street', 'city', 'state', 'zip']
  return keys.reduce((acc, key) => (address[key]) ? acc + address[key].length : acc, 0)

}

address = {
  street: 'My Street',
  city: '',
  state: '',
  zip: ''
}
console.log(`correct address len ${addressLengthCorrect(address)}`)

address.zip = '01234'
console.log(`correct address len ${addressLengthCorrect(address)}`)


我有一种兴奋的感觉,我即将学习新的东西。这里发生了什么?

解决方法

你的括号顺序是错误的。试试这个:

function addressLengthWrong(address) {
  let keys = ['street', 'city', 'state', 'zip']
  return keys.reduce((acc, key) => acc + (address[key] ? address[key].length : 0), 0)
}

你应该用括号包装整个三元表达式,否则acc将包含它。

另外,引用Andreas的回答:

... + ... precedence: 13, ... ? ... : ... precedence: 4; the higher value 'wins'

问题

My first reduce returns an expression of the form: a + (condition)? b : c, and my second reduce returns the equivalent (???) expression: (condition)? a+b : a+c Why do they behave differently?

function addressLengthWrong(address) {
  let keys = ['street', 'city', 'state', 'zip']
  return keys.reduce((acc, key) => acc + (address[key]) ? address[key].length : 0, 0)
}

let address = {
  street: 'My Street',
  city: '',
  state: '',
  zip: ''
}
console.log(`wrong address len ${addressLengthWrong(address)}`)

address.zip = '01234'
console.log(`wrong address len ${addressLengthWrong(address)}`)

Running the alternative...

function addressLengthCorrect(address) {
  let keys = ['street', 'city', 'state', 'zip']
  return keys.reduce((acc, key) => (address[key]) ? acc + address[key].length : acc, 0)

}

address = {
  street: 'My Street',
  city: '',
  state: '',
  zip: ''
}
console.log(`correct address len ${addressLengthCorrect(address)}`)

address.zip = '01234'
console.log(`correct address len ${addressLengthCorrect(address)}`)

I have the excited sense that I'm about to learn something new. What's going on here?

解决方法

Your parentheses order is wrong. Try this:

function addressLengthWrong(address) {
  let keys = ['street', 'city', 'state', 'zip']
  return keys.reduce((acc, key) => acc + (address[key] ? address[key].length : 0), 0)
}

You should wrap the entire ternary expression with parentheses, else the acc will be included.

Also, to quote Andreas' answer:

... + ... precedence: 13, ... ? ... : ... precedence: 4; the higher value 'wins'

相似信息