javascript - 如果一个 If 语句包含很多方法调用，你应该只给这些方法调用一个 "variable name"吗？

Question

例如，不写，

1.

// If the square in front of piece is not occupied then highlight the square  

if($(`#${currentHighlightedPiece.currentSquareLetter}${currentHighlightedPiece.currentSquareNumber-1}`).children().length === 0){
// ...
};

我会不会写得更好，

2.

var forwardOneOccupantSize = $(`#${currentHighlightedPiece.currentSquare[0]}${currentHighlightedPiece.currentSquare[1]-1}`).children().length;

// If the square in front of piece is not occupied then highlight the square  

if(forwardOneOccupantSize === 0){
    // do stuff
}

?

1. 将更具“描述性”但包含更多代码行，以实现相同的目标。

Answer 1

决定将其写为答案以提供更多信息:)

1. 如果您不需要重新计算 - 是的，将值保存在变量中会好得多。您的代码将更具可读性，其他程序员(甚至您)将来需要更少的时间来理解/更改/修复此代码。

2. 如果值可能发生变化(当您查看元素的尺寸/位置时这很常见)- 为此使用函数会好得多。

function checkSpecificContainerNumberOfChildren() {
    return $(`#${currentHighlightedPiece.currentSquareLetter}${currentHighlightedPiece.currentSquareNumber-1}`).children().length === 0;

}

if(checkSpecificContainerNumberOfChildren()){
    // ...
};

既然你谈到了 DOM，它可能会随着时间的推移而改变 - 最好为该调用使用一个函数。