[javascript] Javascript에서 조건부로 객체를 멤버에 추가하는 방법은 무엇입니까?

조건부로 추가 된 멤버로 객체를 만들고 싶습니다. 간단한 접근 방식은 다음과 같습니다.

var a = {};
if (someCondition)
    a.b = 5;

이제 더 관용적 인 코드를 작성하고 싶습니다. 나는 노력하고있다 :

a = {
    b: (someCondition? 5 : undefined)
};

그러나 지금 b은 a그 가치가 의 멤버입니다 undefined. 이것은 원하는 결과가 아닙니다.

편리한 해결책이 있습니까?

최신 정보

여러 회원과 함께 일반적인 경우를 처리 할 수있는 솔루션을 찾고 있습니다.

a = {
  b: (conditionB? 5 : undefined),
  c: (conditionC? 5 : undefined),
  d: (conditionD? 5 : undefined),
  e: (conditionE? 5 : undefined),
  f: (conditionF? 5 : undefined),
  g: (conditionG? 5 : undefined),
 };

답변

순수한 Javascript에서는 첫 번째 코드 스 니펫보다 관용적 인 것을 생각할 수 없습니다.

그러나 jQuery 라이브러리를 사용하는 것이 문제가 아닌 경우 설명서 에서 다음과 같이 $ .extend () 가 요구 사항을 충족해야합니다.

정의되지 않은 속성은 복사되지 않습니다.

따라서 다음과 같이 작성할 수 있습니다.

var a = $.extend({}, {
    b: conditionB ? 5 : undefined,
    c: conditionC ? 5 : undefined,
    // and so on...
});

그리고 (경우에 당신이 기대하는 결과를 얻을 수 conditionB있다 false, 그 다음 b에 존재하지 않습니다 a).

답변

@InspiredJW가 ES5로 그렇게했다고 생각합니다. @ trincot이 지적했듯이 es6을 사용하는 것이 더 나은 방법입니다. 그러나 스프레드 연산자와 논리적 AND 단락 평가를 사용하여 설탕을 조금 더 추가 할 수 있습니다.

const a = {
   ...(someCondition && {b: 5})
}

답변

EcmaScript2015를 사용하면 다음을 사용할 수 있습니다 Object.assign.

Object.assign(a, conditionB ? { b: 1 } : null,
                 conditionC ? { c: 2 } : null,
                 conditionD ? { d: 3 } : null);

코드 스 니펫 표시

var a, conditionB, conditionC, conditionD;
conditionC = true;
a = {};
Object.assign(a, conditionB ? { b: 1 } : null,
                 conditionC ? { c: 2 } : null,
                 conditionD ? { d: 3 } : null);

console.log(a);

스 니펫 확장

일부 비고 :

Object.assign 첫 번째 인수를 그 자리에서 수정하지만 업데이트 된 객체도 반환합니다. 따라서이 메소드를 더 큰 표현식으로 사용하여 객체를 더 조작 할 수 있습니다.
대신에 null당신 전달할 수 undefined또는 {}같은 결과. 기본 값이 래핑되고 자체 열거 가능한 속성이 없기0 때문에 대신 제공 할 수도 있습니다 .Number

더 간결한

(@Jamie는 지적 아웃이로) falsy 값이 더 자신의 열거 속성이 없기 때문에, (다음과 같이 상기 제 2 지점을 가지고 가서, 당신은 그것을 줄일 수 false, 0, NaN, null, undefined, ''제외 document.all) :

Object.assign(a, conditionB && { b: 1 },
                 conditionC && { c: 2 },
                 conditionD && { d: 3 });

코드 스 니펫 표시

var a, conditionB, conditionC, conditionD;
conditionC = "this is truthy";
conditionD = NaN; // falsy
a = {};
Object.assign(a, conditionB && { b: 1 },
                 conditionC && { c: 2 },
                 conditionD && { d: 3 });
console.log(a);

스 니펫 확장

답변

const obj = {
   ...(condition) && {someprop: propvalue},
   ...otherprops
}

라이브 데모 :

const obj = {
  ...(true) && {someprop: 42},
  ...(false) && {nonprop: "foo"},
  ...({}) && {tricky: "hello"},
}

console.log(obj);

스 니펫 확장

답변

부울과 함께 스프레드 구문을 사용하는 것은 (여기에서 제안한대로) 유효한 구문이 아닙니다. 확산은 iterables 에만 사용할 수 있습니다 .

나는 다음을 제안한다.

const a = {
   ...(someCondition? {b: 5}: {} )
}

답변

Enhanced Object Properties를 사용하고 속성이 진실 인 경우에만 설정하는 방법은 다음과 같습니다.

[isConditionTrue() && 'propertyName']: 'propertyValue'

따라서 조건이 충족되지 않으면 선호하는 속성이 생성되지 않으므로 버릴 수 있습니다. 보다: http://es6-features.org/#ComputedPropertyNames

업데이트 :
객체 리터럴 및 배열 ( http://2ality.com/2017/04/conditional-literal-entries.html ) 에 조건부로 항목을 추가하는 방법에 대한 블로그 기사에서 Axel Rauschmayer의 접근 방식을 따르는 것이 훨씬 좋습니다 .

const arr = [
  ...(isConditionTrue() ? [{
    key: 'value'
  }] : [])
];

const obj = {
  ...(isConditionTrue() ? {key: 'value'} : {})
};

나에게 많은 도움이되었다.

답변

더 단순화

const a = {
    ...(condition && {b: 1}) // if condition is true 'b' will be added.
}