วิธีการกำหนดอาร์เรย์ด้วยองค์ประกอบเงื่อนไข?


101

ฉันจะกำหนดองค์ประกอบอาร์เรย์ตามเงื่อนไขได้อย่างไร ฉันต้องการทำสิ่งนี้:

const cond = true;
const myArr = ["foo", cond && "bar"];

สิ่งนี้ได้ผลตามที่คาดไว้: ["foo", "bar"]

แต่ถ้าฉันตั้งค่าcondเป็นfalseฉันจะได้ผลลัพธ์ดังนี้["foo", false]

ฉันจะกำหนดอาร์เรย์ด้วยองค์ประกอบเงื่อนไขได้อย่างไร


คำตอบ:


233

falseคุณสามารถแพร่กระจายภายในอาร์เรย์ของอาร์เรย์เพื่อให้รายการอาร์เรย์สะอาดเมื่อเงื่อนไขเป็น

นี่คือวิธีที่คุณสามารถทำได้ :

// Will result in ['foo', 'bar']
const items = [
  'foo',
  ... true ? ['bar'] : [],
  ... false ? ['falsy'] : [],
]

console.log(items)

คำอธิบาย :

ดังที่คุณเห็นว่าตัวดำเนินการ ternary จะส่งกลับอาร์เรย์เสมอ

ถ้าเงื่อนไขเป็นtrueแล้วก็จะส่งกลับมิฉะนั้นอาร์เรย์ที่ว่างเปล่า['bar'][]

หลังจากนั้นเราจะกระจาย...อาร์เรย์ผลลัพธ์ออกไป(จากการดำเนินการด้านท้าย) และรายการของอาร์เรย์จะถูกผลักไปยังอาร์เรย์แม่

หากไม่มีรายการอาร์เรย์ใด ๆ (เมื่อมีการตรวจสอบด้านบนfalse) ก็จะไม่มีการผลักดันซึ่งเป็นเป้าหมายของเรา


ในคำตอบอื่นฉันอธิบายแนวคิดเดียวกัน แต่สำหรับวัตถุ คุณสามารถตรวจสอบมันมากเกินไปที่นี่


1
เมื่อไม่นานมานี้ฉันต้องทำสิ่งนี้และการใช้สเปรดดูเหมือนจะเป็นวิธีแก้ปัญหาที่ชัดเจนที่สุดสำหรับฉัน ดีใจที่คนอื่นใช้รูปแบบนี้เช่นกัน ฉันไม่อยากทำให้มันคลุมเครือเกินไป แต่ฉันจะทำมันต่อไปเพราะมันดูเป็นที่นิยมมากพอ
Brennan Cheung

ขอบคุณมาก ~ !! ฉันไม่ได้คิดว่าส
เปรด

มันเจ๋งมากไม่คิดว่าจะมีวิธีทำได้โดยไม่ต้องกรองอาร์เรย์ตามความเป็นจริง
JDune

1
ประณามว่าทำไมฉันรัก ECMAScript
Anni

1
ทางออกที่ยอดเยี่ยม!
catch22

22

ฉันจะทำสิ่งนี้

[
  true && 'one',
  false && 'two',
  1 === 1 && 'three',
  1 + 1 === 9 && 'four'
].filter(Boolean) // ['one', 'three']

โปรดทราบว่าการดำเนินการนี้จะลบค่าที่เป็นเท็จเช่นสตริงว่าง


1
ฉันชอบความคิด แต่การนำไปใช้ของคุณจะผิดสำหรับ [true && ''] สตริงว่างจะถูกกรองออก ฉันอยากจะใช้ฟังก์ชันตัวช่วยเช่น [foo] .filter (isNonBoolean) หรือ [foo] .stripBoolean ()
Martin

@Martin ใช่บางทีอาจจะอธิบายได้ในคำตอบ ฉันจะแก้ไขต่อไป!
Michael Bergquist Suarez

ฉันคิดว่าจะมีปัญหาถ้าฉันต้องการอาร์เรย์เช่นนี้: const arr = ['one', 'two', false, true]; แต่ความคิดนั้นดีสำหรับคุณค่าที่แท้จริง :)
Sanjib Debnath


8

หากคุณต้องการเก็บไว้เป็นซับเดียวจริงๆคุณสามารถใช้:

const cond = true;
const myArr = ["foo"].concat(cond ? ["bar"] : []);

ฉลาดมีประโยชน์สำหรับฉันสำหรับหน้าอาร์เรย์แบบมีเงื่อนไขเช่นconst myArr = (cond ? ['item 1'] : []).concat(['item 2', 'item 3']);
devonj

6

คุณไม่มีตัวเลือกมากมายนอกเหนือจากการใช้push:

const cond = true;
const myArr = ["foo"];

if (cond) myArr.push("bar");

อีกแนวคิดหนึ่งคืออาจเพิ่ม null และกรองออก:

const cond = true;
const myArr = ["foo", cond ? "bar" : null];

myArr = myArr.filter((item) => item !== null);


2

มีหลายวิธี แต่วิธีที่คุณทำมันใช้ไม่ได้กับ Javascript

วิธีแก้ไขที่ง่ายที่สุดคือมีคำสั่ง if

if (myCond) arr.push(element);

นอกจากนี้ยังมีfilterแต่ฉันไม่คิดว่านั่นคือสิ่งที่คุณต้องการที่นี่เลยเนื่องจากคุณดูเหมือนจะ "เพิ่มสิ่งนี้ถ้าเงื่อนไขนี้เป็นจริง" แทนที่จะตรวจสอบทุกอย่างกับเงื่อนไขบางอย่าง ถึงแม้ว่าถ้าคุณอยากจะทำตัวนอกลู่นอกทางจริงๆคุณสามารถทำได้ (ไม่แนะนำ แต่มันเจ๋งมากที่คุณทำได้)

var arr = ["a", cond && "bar"];
arr.filter( e => e)

โดยทั่วไปจะกรองค่าที่ไม่ใช่ค่าจริงทั้งหมดออกไป


1
มันดูดี คุณสามารถทำvar arr = ["a", cond && "bar"].filter(e => e);@Adam LeBlanc ได้ แต่คุณพูดถูกมันอาจเป็นขยะ แต่ขยะเย็น ๆ ;)
Manu Schiller

มันยอดเยี่ยม แต่ฉันขอแนะนำให้ใช้ค่าเงื่อนไขเพียงค่าเดียว เหมาะสำหรับวัตถุประสงค์ทั่วไปประเภท "กำจัดค่าเท็จทั้งหมด" เนื่องจากคุณจะต้องผ่านอาร์เรย์ทั้งหมดเพียงค่าเดียว แต่ถ้าคุณมีค่าเงื่อนไขที่ไม่ระบุจำนวนมากก็น่าจะเป็นทางออกที่ดี
Adam LeBlanc

.filter (e => e) จะกรองสตริงว่างออก
Martin

0

แนวทางอื่น: เติมตัวกรองล่วงหน้าแทนการกรองโพสต์:

const populate = function(...values) {
    return values.filter(function(el) {
        return el !== false
    });
};

console.log(populate("foo", true && "bar", false && "baz"))

ผลตอบแทน

(2) ["foo", "bar"]

ฉันรู้ว่ามันไม่สามารถแก้สัญกรณ์ชวเลขได้ (เนื่องจากมันใช้ไม่ได้ไม่ว่าคุณจะพยายามอะไรก็ตาม) แต่มันก็ใกล้เคียงกับที่


0

หากคุณใช้ es6 ฉันขอแนะนำ

let array = [ "bike", "car", name === "van" ? "van" : null, "bus", "truck", ].filter(Boolean);

อาร์เรย์นี้จะมีเฉพาะค่า "van" ถ้าชื่อเท่ากับ "van" มิฉะนั้นจะถูกละทิ้ง


-1

ถ้าคุณใช้ Array.push

คุณสามารถทำตาม

var a = ["1"]
a.push(... !true ? ["2"] : [])

ผลลัพธ์คือ ["1"]

หรือ

var a = ["1"]
a.push(... true ? ["2"] : [])

ผลลัพธ์คือ ["1","2"]


หากคุณจะใช้ a checkและpushโซลูชันของคุณไม่ใช่โซลูชันที่มีความชัดเจนสูงสุด ฉันจะใช้if (check) foo.push( item );แทนการกระจายอาร์เรย์ว่างในกรณีที่เป็นเท็จ
Martin
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.