為什么長度屬性出現在 Javascript 中的結束標記之后

Question

在我作為 JavaScript 課程的一部分制作的待辦事項列表應用程序中，我在理解“長度”屬性的位置時遇到了一些麻煩。

任務列表：

const todos = [{
    text: 'First task',
    completed: true
}, {
    text: 'Second task',
    completed: false
}, {
    text: 'Third task',
    completed: true
}]

我的問題：下面的代碼為我提供了仍然需要完成的任務總數。 我不明白的是：為什么 .length 屬性在結束“})”之后出現？ 我會假設代碼是!todo.completed.length ，而不是!todo.completed}).length 。 我可以看到只有后者有效 - 但我試圖理解為什么. 謝謝！！

let remaining = todos.filter(function(todo){
    return !todo.completed
}).length

Answer 1

這是因為Array.prototype.filter返回一個數組。 Array.prototype.filter MDN 參考。

例如，這兩個語句是等價的：

[1, 2, 3].filter(function(){
  return false
}).length

和

[].length

這是因為：

[1, 2, 3].filter(function(){
  return false
})

返回[] 。

 var one = [1, 2, 3].filter(function() { return false }) // Removes all elements from array var two = [] console.log(one, one.length) console.log(two, two.length)

Answer 2

首先：過濾器函數遍歷每個 todo 對象並返回一個新的 todo 對象列表。

每個 todo 對象都傳遞給您作為參數提供的函數（在本例中為匿名函數），只有當此函數返回 true 時，todo 對象才會添加到新列表中。

由於您想知道仍需要完成的待辦事項數量，您返回 !todo.completed 因為當 todo.completed 為 false 時這將返回 true。

當過濾器函數迭代每個對象時，它返回新列表，這時您可以訪問它的長度。

返回 !todo.completed.lenght 並沒有任何意義，因為您正在嘗試獲取布爾值的長度並且過濾器函數期望為真或假。