それで、今日、私たちは社内+new Date()
で良い習慣であるかどうかについて議論しました。よりもこの方法を好む人もいnew Date().getTime()
ます。
私の意見では、これはかなり便利ですが、逆に読みにくいと言う人もいるでしょう。
明らかな「単項演算子に慣れていない人にはわかりにくい」以外に、長所と短所はありますか?
それで、今日、私たちは社内+new Date()
で良い習慣であるかどうかについて議論しました。よりもこの方法を好む人もいnew Date().getTime()
ます。
私の意見では、これはかなり便利ですが、逆に読みにくいと言う人もいるでしょう。
明らかな「単項演算子に慣れていない人にはわかりにくい」以外に、長所と短所はありますか?
このgetTime
方法は非常に高速であるように見えます:
なぜそうなのですか?
インスタンスでgetTime
メソッドを呼び出すと、次のようになります。Date
[[PrimitiveValue]]
このDateオブジェクトの内部プロパティの値を返します。単項プラス演算子をDate
インスタンスに適用すると、次のようになります。
Date
インスタンスの値を取得します[[DefaultValue]]
メソッドを呼び出すここ数年、これについてよく考えた結果、パフォーマンスはここでは問題にならないという結論に達しました。
したがって、読みやすさの点で私が好むソリューションは次のとおりです。
Date.now();
このタイプのコードはあまり頻繁に呼び出されない傾向があることがわかったので、通常目にするインライン使用のテストを追加するのが最善だと考えました。
例えば
var t = (new Date()).getTime();
と
var t = +new Date();
JSPerf の結果は、これら 2 つの速度に大きな違いがないことを示しています: http://jsperf.com/get-time-vs-unary-plus/7
前の perf 結果の問題は、この例が実用的でないことです。実際には同じことを続けることはできませんnow
。getTime()
now が変更されていない場合は、結果を一度だけ保存します。これらの新しい結果が示すように、通常の使用状況では速度の違いは重要ではありません。
したがって、一般的なアドバイスは、いずれかを1回限りの使用+new Date()
に使用すると短くなりますが、(new Date()).getTime()
読みやすくなります(そして少し速くなります)。
新しい を使用する場合は、ここDate.now()
から古いブラウザーをサポートするために推奨される shim を実装する必要があります。
if (!Date.now) {
Date.now = function now() {
return new Date().getTime();
};
}
(なぜ彼らがその例で無名関数を使用しないのか、私は困惑していますが)
私見、パフォーマンスに大きな違いがない場合、読みやすさが常に勝つはずです。私たちは皆、WCTR の「読むコードを書く」ことを実践すべきです。したがって、私にとっては、これがベスト プラクティスです。
(new Date()).getTime();
それはすべて、何を比較しているかによって異なります。
実際、同じ日付オブジェクトに対して .getTime を 100 万回連続して実行することは、固定変数を 100 万回読み取るのとほぼ同じ速さであり、実際のコードには関係ないようです。
より興味深いテストでは、各反復で新しい日付から時間文字列を返すのにかかる時間を比較できます。
<!doctype html>
<html lang="en">
<head>
<meta charset= "utf-8">
<title>get time</title>
<script>
/*does n= +new Date() take longer than n= new Date().getTime()?*/
var score=[],runs;
function tests(arg){
runs= parseInt(document.getElementsByTagName('input')[0].value)|| 100000;
var A= [], i= runs, start= new Date(),n=1357834972984;
while(i--){
A.push(n);
}
if(arg!==true){
score[0]= (new Date()- start);
setTimeout(tests0, 0);
}
}
function tests0(){
runs= parseInt(document.getElementsByTagName('input')[0].value)|| 100000;
var A= [], i= runs, start= new Date();
while(i--){
A.push(+(start));
}
score[1]= (new Date()- start);
setTimeout(tests1, 0);
}
function tests1(){
var A= [], i= runs, start= new Date();
while(i--){
A.push(start.getTime());
}
score[2]= (new Date()- start);
setTimeout(tests2, 0);
}
function tests2(){
var A= [], i= runs, start= new Date();
while(i--){
A.push(+(new Date));
}
score[3]= (new Date()- start);
setTimeout(tests3, 0);
}
function tests3(){
var A= [], i= runs, start= new Date();
while(i--){
A.push(new Date().getTime())
}
score[4]= (new Date()- start);
setTimeout(report, 0);
}
function report(){
var inp=document.getElementsByTagName('input'),t,
lab=document.getElementsByTagName('label')
for(var i=0;i<5;i++){
inp[i+1].value=score[i]+' msec';
}
}
onload= function(){
tests(true);
document.getElementsByTagName('button')[0].onclick=tests;
}
</script>
</head>
<body>
<h1>Comparing +prefix and getTime()</h1>
<p>
This comparison builds an array of the values for each test case, eg, 100000 array items for each case.
</p>
<ol>
<li>Building an array of a fixed integer, no date calculations at all.</li>
<li>Reading +prefix of existing Date and adding each value to array.</li>
<li>Reading getTime from existing Date and adding each value to array.</li>
<li>Creating a new date with +(new Date) and adding each value to array.</li>
<li>Creating a new date with new Date().getTime()and adding each value to array.</li>
</ol>
<p><label>Iterations of each test:<input type="text" size="8" value="100000"></label>
<button type="button">Run Tests</button></p>
<p><label>1. Building the array with no calculation: <input type="text" size="12"></label></p>
<h2>Repeatedly reading the same created date</h2>
<p><label>2. +prefix to existing Date: <input type="text" size="12"></label></p>
<p><label>3. getTime from existing Date: <input type="text" size="12"></label></p>
<h2>Creating a new date and reading new value each time:</h2>
<p><label>4. +(new Date): <input type="text" size="12"></label></p>
<p><label>5. new Date().getTime(): <input type="text" size="12"></label></p>
</body>
</html>