iT邦幫忙

0

三元運算子迴圈

如題 三元運算子如果裡面要執行迴圈要怎樣寫才有功能?
上次的例子可能比較難以理解 這次我換成正規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;
}
看更多先前的討論...收起先前的討論...
小魚 iT邦大師 1 級 ‧ 2019-01-12 16:23:39 檢舉
s是陣列吧, 陣列應該不能直接變成字串吧.
console.log他會幫你處理陣列,
但是應該不能直接顯示在畫面上.
經測試可以顯示的哦 用if的話
淺水員 iT邦大師 6 級 ‧ 2019-01-12 19:24:24 檢舉
js好像會自動變成以逗號分隔的字串,雖然我習慣上都會用join處理過
所以大大們的結論是? 三元運算子要如何寫迴圈才有功用?
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
0

先問用一般的 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字) 所以要盡可能簡短 我把原本的貼出來不曉得你看不看得懂

0
小魚
iT邦大師 1 級 ‧ 2019-01-12 16:24:34

s是陣列吧, 陣列應該不能直接變成字串吧.
console.log他會幫你處理陣列,
但是應該不能直接顯示在畫面上.

0
froce
iT邦大師 1 級 ‧ 2019-01-12 22:15:54

經過測試,不行。
會跳「SyntaxError: expected expression, got keyword 'for'」告訴你三元運算子裡不能有 for 這關鍵字。

然後字串加array是可以的,JS會毫無節操的把他都轉成用逗號相連的字串。

恩 我也是類似的錯誤 看來並不是所有的if else都能用三元簡化呢

froce iT邦大師 1 級 ‧ 2019-01-12 22:24:00 檢舉

三元運算子本來就不是給你這樣用的。
只是讓你簡化一些簡單的邏輯。太複雜的邏輯根本不適合寫三元。

迴圈 陣列那些非單一的三元應該都無法處理

0
淺水員
iT邦大師 6 級 ‧ 2019-01-13 00:18:18

該用 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在三元裡工作?

淺水員 iT邦大師 6 級 ‧ 2019-01-13 09:45:36 檢舉

()={...} 是 ES6 的寫法,其實就是 function(){...}
然後又用了 IIFE ,就變成 (()={...})() 也就是 (function(){...})()
昨天我是盡量照你原本的程式去加點東西
不然其實那個 x="Good day"+s; 我很想拉到迴圈外面

淺水員 iT邦大師 6 級 ‧ 2019-01-13 09:54:22 檢舉

另一個例子,這邊的 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

淺水員 iT邦大師 6 級 ‧ 2019-01-13 10:17:10 檢舉

所以直接用 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!';}})
淺水員 iT邦大師 6 級 ‧ 2019-01-13 11:04:40 檢舉

我應該沒時間去看 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的 而且也不能傳參數
/images/emoticon/emoticon10.gif

froce iT邦大師 1 級 ‧ 2019-01-14 12:33:42 檢舉

你先把code整理成正常人會想看的吧...

然後其實 fillano 大說的才是重點,那些array的迭代方法可以省很多code。

0
fillano
iT邦超人 1 級 ‧ 2019-01-14 10:49:27

for是statement,放在三元運算中是不合法的。但是array有一些迭代的方法可以呼叫,函數呼叫是expression,可以放在三元運算中。

	time<20?r.forEach(i=>{s.push(i);x="Good day"+s})...

類似的還有map, filter, some, every, reduce, recudeRight等方法,請善用。

1

三元判斷原意不是要給你這樣用的。
正常來說,三元判斷式是為了給與你方便給值使用的。

並非是取代if用。
淺水員已經跟你說實際用法了。認真來說,你原意是想要降低程式碼字數。但相對的增加了判讀性不意。

我要發表回答

立即登入回答