dynamic

學習如何在JavaScript中動態訪問對象的方法 有時候你有一個對象，根據某些條件需要調用一個方法或不同的方法。 例如，你有一個 car 對象，根據 driver.sleepy 的值，你可能想要把它開車(drive())或停車(park())。 如果司機的瞌睡程度超過6，我們需要在他開車時把車停下來。 以下是使用 if/else 條件語句實現此功能的例子： if (driver.sleepy > 6) { car.park() } else { car.drive() } 讓我們重寫這個例子，使它更加動態。 我們可以使用三元運算符動態選擇方法名，並將它作為字符串值獲取。 使用方括號，我們可以從對象的可用方法中選擇它： car[driver.sleepy > 6 ? 'park' : 'drive'] 通過上面的語句，我們獲取了方法的引用。我們可以通過追加括號來直接調用它： car[driver.sleepy > 6 ? 'park' : 'drive']()

我在使用Svelte時遇到了一個需求，需要在元素上動態應用一些CSS屬性，當其中一個變量具有特定的值時。 我找到的最簡單的解決方案是在selected變量值為true時添加一個HTML類，然後我寫了一些針對具有該類的元素的CSS： <style> /\* ...其他CSS... \*/ span.cell.selected { outline-color: lightblue; outline-style: dotted; } </style> <span class="cell {selected === true ? 'selected' : ''}"> {value} </span> 這種需求是如此常見，以至於Svelte添加了將類名綁定到變量值的功能： <span class="cell" class:selected="{selected}"> {value} </span> 更簡潔的方式是使用簡寫符號： <span class="cell" class:selected> {value} </span>