如題 三元運算子如果裡面要執行迴圈要怎樣寫才有功能?
上次的例子可能比較難以理解 這次我換成正規js
function myFunction(){
var x="";
var r=["a","b","c","d","e","f","g"];
var s=[];
var time=new Date().getHours();
time<20?for(i=0;i<r.length;i++){s.push(r[i]); x="Good day"+s;}
document.getElementById("demo").innerHTML=x;
}
先問用一般的 if 你會怎麼寫?
三元運算子跟用不用迴圈基本上是兩件事,沒什麼關係
function myFunction(){
var x="";
var r=["a","b","c","d","e","f","g"];
var s=[];
var time=new Date().getHours();
if(time<20)
{
for(i=0;i<r.length;i++)
{
s.push(r[i]); x="Good day"+s;
}
}
document.getElementById("demo").innerHTML=x;
}
所以這種情況不適合用三元運算子,因為不好維護,三元運算子用的情境是邏輯單純的賦值,迴圈已經跟time賦值沒關係了,沒必要用三元運算子,要慢慢體會什麼時候該用什麼,想要用三元運算子的理由在?
因為有字數限制(500字) 所以要盡可能簡短 我把原本的貼出來不曉得你看不看得懂
經過測試,不行。
會跳「SyntaxError: expected expression, got keyword 'for'」告訴你三元運算子裡不能有 for 這關鍵字。
然後字串加array是可以的,JS會毫無節操的把他都轉成用逗號相連的字串。
該用 if
就用 if
,三元運算子主要是「賦值」使用
x = 條件判斷式 ? 成立時的值 : 失敗時的值;
所以可以這樣寫(但是不會比用 if
好)
function myFunction(){
var r=["a","b","c","d","e","f","g"];
var s=[];
var time=new Date().getHours();
for(i=0;i<r.length;i++){
s.push(r[i]);
}
var x=time<20?"Good day"+s.join(','):"";
document.getElementById("demo").innerHTML=x;
}
如果硬要在裡面寫 for
的話,下面這比較偏娛樂效果
function myFunction(){
var x="";
var r=["a","b","c","d","e","f","g"];
var s=[];
var time=new Date().getHours();
time<20?(()=>{for(i=0;i<r.length;i++){s.push(r[i]); x="Good day"+s;}})():null;
document.getElementById("demo").innerHTML=x;
return x;
}
然後回完文我才發現,為什麼不這樣寫就好
function myFunction(){
var r=["a","b","c","d","e","f","g"];
var time=new Date().getHours();
var x=time<20?"Good day"+r.join(','):"";
document.getElementById("demo").innerHTML=x;
}
如果只要逗點分隔的話當然join即可 可是如果要作更細部的修改例如最前面加上index的話還是push比較方便
function myFunction(){
var x="";
var r=["a","b","c","d","e","f","g","h","i","j"];
var s=[];
var time=new Date().getHours();
time<20?(()=>{for(i=0;i<r.length;i++){s.push((i<9?"0":"")+(i+1)+r[i]); x="Good day"+s;}})():null;
document.getElementById("demo").innerHTML=x;
return x;
}
還有我想請問一下(()=>{})的寫法是叫啥呢 為何加了這個就能讓for在三元裡工作?
()={...}
是 ES6 的寫法,其實就是 function(){...}
然後又用了 IIFE ,就變成 (()={...})()
也就是 (function(){...})()
昨天我是盡量照你原本的程式去加點東西
不然其實那個 x="Good day"+s;
我很想拉到迴圈外面
另一個例子,這邊的 conditional operator 是回傳 function
然後用 IIFE 直接執行
(只是練習,實際上用 if 反而簡潔有效率)
function myFunction(tt){
var x="";
var r=["a","b","c","d","e","f","g"];
var time=new Date().getHours();
(tt<20?function(){
var s=[];
for(i=0;i<r.length;i++){
s.push(r[i]);
}
x="Good day"+s;
}:function(){
//這是一個空的函式
})();
document.getElementById("demo").innerHTML=x;
}
果然是要加function才能運作阿......而且還要IIFE
所以直接用 if 才是正解
恩 那是時候給你看看原本的了 因為有字數限制(500字) 所以才密密麻麻的 這是用Nightbot語法寫成的 雖然已經改成if了
$(eval var x="http://ac1011.hopto.org:4095/data/songlist.json?search=$(querystring $(1))",y="$(2)",z=x.replace(/25/g,""),a=($(urlfetch json http://ac1011.hopto.org:4095/data/songlist.json?search=$(querystring))),r=a.songlist,b=[],c="歌手:",d="歌名:",e="lid:",f="sid:",g=" ";if(y=="1"){z}else{for(i=0;i<r.length-1;i++){b.push((i<9?"0":"")+(i+1)+"."+c+r[i].artist+g+d+r[i].title+g+e+r[i].list_id+g+f+r[i].song_id+g);b.length>0?b.join(' ').slice(0,400):'Error!';}})
我應該沒時間去看 Nightbot 語法
不過扣除那部分,我想我會這樣寫
b=r.map(function(val, idx){
return (idx<9?'0':'')+(idx+1)
+' 歌手:'+val.artist
+' 歌名:'+val.title
+' lid:'+val.list_id
+' sid:'+val.song_id
}).join(' ').slice(0,400);
大致上是覺得沒必要把「歌手」「歌名」那些字串用變數儲存起來增加閱讀難度
另外有 map 的方法可以使用
nb的eval裡是不能再寫function的 而且也不能傳參數
你先把code整理成正常人會想看的吧...
然後其實 fillano 大說的才是重點,那些array的迭代方法可以省很多code。
for是statement,放在三元運算中是不合法的。但是array有一些迭代的方法可以呼叫,函數呼叫是expression,可以放在三元運算中。
time<20?r.forEach(i=>{s.push(i);x="Good day"+s})...
類似的還有map, filter, some, every, reduce, recudeRight等方法,請善用。
三元判斷原意不是要給你這樣用的。
正常來說,三元判斷式是為了給與你方便給值使用的。
並非是取代if用。
淺水員已經跟你說實際用法了。認真來說,你原意是想要降低程式碼字數。但相對的增加了判讀性不意。