如何重构此 JavaScript 以删除 'with' 语句
How would this JavaScript be refactored to remove the 'with' statement
这是一个简单的时钟应用程序的JS。 在 JS 中,不再使用 'with' 语句。 我想帮助理解如何在删除使用 'with' 语句的同时保留功能。谢谢你。
function moveHands() {
with (new Date()) {
h = 30 * (getHours() % 12 + getMinutes() / 60); // 30 degrees for each hour
m = 6 * (getMinutes()); // 6 degrees each minute
s = 6 * (getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
}
window.onload = moveHands;
Using with is not recommended, and is forbidden in ECMAScript 5 strict
mode. The recommended alternative is to assign the object whose
properties you want to access to a temporary variable.
基本上,这只是意味着您必须在使用对象之前将其分配给变量,这是非常标准的。
所以在你的情况下,你的代码应该是这样的:
function moveHands() {
var date = new Date();
h = 30 * (date.getHours() % 12 + date.getMinutes() / 60); // 30 degrees for each hour
m = 6 * (date.getMinutes()); // 6 degrees each minute
s = 6 * (date.getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
window.onload = moveHands;
只需将日期分配给变量,然后显式调用该变量的日期方法。
function moveHands() {
var currentDate = new Date();
h = 30 * (currentDate.getHours() % 12 + currentDate.getMinutes() / 60); // 30 degrees for each hour
m = 6 * (currentDate.getMinutes()); // 6 degrees each minute
s = 6 * (currentDate.getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
window.onload = moveHands;
我只会使用局部变量。
function moveHands() {
var date = new Date();
h = 30 * (date.getHours() % 12 + date.getMinutes() / 60); // 30 degrees for each hour
m = 6 * (date.getMinutes()); // 6 degrees each minute
s = 6 * (date.getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
window.onload = moveHands;
这是一个简单的时钟应用程序的JS。 在 JS 中,不再使用 'with' 语句。 我想帮助理解如何在删除使用 'with' 语句的同时保留功能。谢谢你。
function moveHands() {
with (new Date()) {
h = 30 * (getHours() % 12 + getMinutes() / 60); // 30 degrees for each hour
m = 6 * (getMinutes()); // 6 degrees each minute
s = 6 * (getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
}
window.onload = moveHands;
Using with is not recommended, and is forbidden in ECMAScript 5 strict mode. The recommended alternative is to assign the object whose properties you want to access to a temporary variable.
基本上,这只是意味着您必须在使用对象之前将其分配给变量,这是非常标准的。 所以在你的情况下,你的代码应该是这样的:
function moveHands() {
var date = new Date();
h = 30 * (date.getHours() % 12 + date.getMinutes() / 60); // 30 degrees for each hour
m = 6 * (date.getMinutes()); // 6 degrees each minute
s = 6 * (date.getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
window.onload = moveHands;
只需将日期分配给变量,然后显式调用该变量的日期方法。
function moveHands() {
var currentDate = new Date();
h = 30 * (currentDate.getHours() % 12 + currentDate.getMinutes() / 60); // 30 degrees for each hour
m = 6 * (currentDate.getMinutes()); // 6 degrees each minute
s = 6 * (currentDate.getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
window.onload = moveHands;
我只会使用局部变量。
function moveHands() {
var date = new Date();
h = 30 * (date.getHours() % 12 + date.getMinutes() / 60); // 30 degrees for each hour
m = 6 * (date.getMinutes()); // 6 degrees each minute
s = 6 * (date.getSeconds());
// now rotate the clock via changing css
document.getElementById('hours').style.cssText = "-webkit-transform:rotate(" + h + "deg);";
document.getElementById('minutes').style.cssText = "-webkit-transform:rotate(" + m + "deg);";
document.getElementById('seconds').style.cssText = "-webkit-transform:rotate(" + s + "deg);";
setTimeout(moveHands, 1000);
}
window.onload = moveHands;