Question

如果$(this).html(sourcesArray[tableNumber-1].forecast[i].alt.low)传递到.alt，如何从两行中移除true，如何使以下功能更改行simplePar和function switchTempUnitOnForecastTables(simplePar) { for (let tableNumber = 1; tableNumber < numberOfSources+1; tableNumber++) { if (tableNumber == 2) { for (let i = 1; i < 4; i++) { $("#temp-high"+tableNumber+i).removeClass('fadeIn').addClass('fadeOut animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){ $(this).html(sourcesArray[tableNumber-1].forecast[i].alt.high) $(this).removeClass('fadeOut').addClass('fadeIn'); }); $("#temp-low"+tableNumber+i).removeClass('fadeIn').addClass('fadeOut animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){ $(this).html(sourcesArray[tableNumber-1].forecast[i].alt.low) $(this).removeClass('fadeOut').addClass('fadeIn'); }); } } else { for (let i = 1; i < 7; i++) { $("#temp-high"+tableNumber+i).removeClass('fadeIn').addClass('fadeOut animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){ $(this).html(sourcesArray[tableNumber-1].forecast[i].alt.high) $(this).removeClass('fadeOut').addClass('fadeIn'); }); $("#temp-low"+tableNumber+i).removeClass('fadeIn').addClass('fadeOut animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){ $(this).html(sourcesArray[tableNumber-1].forecast[i].alt.low) $(this).removeClass('fadeOut').addClass('fadeIn'); }); } } }}？

<tbody id="subjects">
        @foreach($subjects as $subject)
            <tr id="row{{$subject->id}}">
                <td>{{$subject->name}}</td>
                <td>{{$subject->level}}</td>
                <td>
                    <a data-id="{{$subject->id}}" data-name="{{$subject->name}}" data-level="{{$subject->level}}" data-toggle="tooltip" title="Edit" id="edit-modal" href="#" role="buton">
                        <i class="glyphicon glyphicon-edit text-info"></i>
                    </a>
                </td>
                <td>
                    <a id="delete" data-id="{{$subject->id}}" data-toggle="tooltip" title="Delete" href="#" role="button">
                        <i class="glyphicon glyphicon-trash text-danger"></i>
                    </a>
                </td>

            </tr>
        @endforeach
    </tbody>

Answer 1

当提出这样的问题时，将其分解为简化版本会有所帮助 - 因此它与您的特定代码无关。这是一种思考它的方法。它肯定会更复杂，检查类型和args的数量等。

var thing = {
  name: 'Derek',
  alt: {
    name: '@sheriffderek',
  },
};

function doSomething(special) { // could be true or something else

  var outcome = undefined;

  if ( special === true ) {
    outcome = thing.alt.name;
  } else {
    outcome = thing.name;
  }

  return outcome;

}

console.log( doSomething(true) );

https://jsfiddle.net/sheriffderek/gsrkm6rg/

Answer 2

你可以用三元表达式解决这个问题（这只是if(){}...then{}的紧凑版本）：

var obj = sourcesArray[tableNumber-1].forecast[i];
$(this).html(simplePar ? obj[hiLo] : obj.alt[hiLo]).removeClass('fadeOut').addClass('fadeIn');
//           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^      this expression solves your problem

但是你可以更进一步，并保持你的代码DRY：

使用变量作为内循环限制（4或7）
编写一个广义的工人函数来处理＆＃34; high＆＃34; vs＆＃34;低＆＃34;

function switchTempUnitOnForecastTables(simplePar) {
    // worker function
    function action(tableNumber, i, hiLo) {
        $("#temp-"+hiLo+tableNumber+i).removeClass('fadeIn').addClass('fadeOut animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
            var obj = sourcesArray[tableNumber-1].forecast[i];
            $(this).html(simplePar ? obj[hiLo] : obj.alt[hiLo]).removeClass('fadeOut').addClass('fadeIn');
        });
    }

    for (var tableNumber = 1; tableNumber < numberOfSources+1; tableNumber++) {
        var n = (tableNumber == 2) ? 4 : 7; // inner loop limit
        for (var i = 1; i < n; i++) {
            action(tableNumber, i, 'high');
            action(tableNumber, i, 'low');
        }
    }
}

作为奖励，您不再依赖let，对浏览器的支持仍然有点基础。

如果参数为True，则删除函数的特定部分

2 个答案: