거기 nullES6 (ES2015 / JavaScript.next / 하모니) 등의 -safe 속성 액세스 (null의 전파 / 유) 연산자 ?.의 커피 스크립트 예는? 아니면 ES7을 계획하고 있습니까?

var aThing = getSomething()
...
aThing = possiblyNull?.thing

이것은 대략 다음과 같습니다.

if (possiblyNull != null) aThing = possiblyNull.thing

이상적 솔루션 (심지어 할당해서는 안됩니다 undefined)로 aThing하면 possiblyNullISnull

업데이트 (2020-01-31) : 사람들이 여전히 이것을 찾는 것 같습니다. 현재 이야기는 다음과 같습니다.

• 선택적 체인 사양 (4 단계) : https://github.com/tc39/proposal-optional-chaining
• babel-preset-env : 이것은 아마도 당신이 원하는 것입니다 https://babeljs.io/docs/en/babel-preset-env
• 바벨 v7 플러그인 : https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining

업데이트 (2017-08-01) : 공식 플러그인을 사용하려면 새로운 변형으로 Babel 7의 알파 빌드를 시도 할 수 있습니다. 귀하의 마일리지가 다를 수 있습니다

https://www.npmjs.com/package/babel-plugin-transform-optional-chaining

실물 :

현재 1 단계에있는 기능 : 옵션 체인.

https://github.com/tc39/proposal-optional-chaining

오늘 사용하고 싶다면 그것을 수행하는 Babel 플러그인이 있습니다.

https://github.com/davidyaha/ecmascript-optionals-proposal

?만큼 좋지 않습니다. 연산자이지만 비슷한 결과를 얻으려면 다음을 수행하십시오.

user && user.address && user.address.postcode

null및 undefined둘 다 잘못된 값 이므로 ( 이 참조 참조 ) &&선행 연산자가 null이거나 정의되지 않은 경우에만 연산자 뒤의 속성에 액세스합니다.

또는 다음과 같은 함수를 작성할 수 있습니다.

function _try(func, fallbackValue) {
    try {
        var value = func();
        return (value === null || value === undefined) ? fallbackValue : value;
    } catch (e) {
        return fallbackValue;
    }
}

용법:

_try(() => user.address.postcode) // return postcode or undefined 

또는 대체 값으로 :

_try(() => user.address.postcode, "none") // return postcode or a custom string

아니요 . JavaScript에서 lodash # get 또는 이와 유사한 것을 사용할 수 있습니다 .

안전한 자산 접근을위한 바닐라 대안

(((a.b || {}).c || {}).d || {}).e

가장 간결한 조건부 할당은 아마도

try { b = a.b.c.d.e } catch(e) {}

아니요, ES6에는 null 전파 연산자가 없습니다. 알려진 패턴 중 하나를 사용해야합니다. 합니다.

하지만 다음과 같은 구조 조정을 사용할 수 있습니다.

({thing: aThing} = possiblyNull);

ES7에서 그러한 연산자를 추가하기위한 많은 토론 (예 : this ) 이 있지만 실제로 이륙 한 사람은 없습니다.

여기 의 목록으로 이동하면 현재 Ecmascript에 안전한 순회를 추가 할 제안이 없습니다. 따라서이를 수행 할 수있는 좋은 방법은 없을뿐만 아니라 미래에도 추가되지는 않을 것입니다.

// Typescript
static nullsafe<T, R>(instance: T, func: (T) => R): R {
    return func(instance)
}

// Javascript
function nullsafe(instance, func) {
    return func(instance);
};

// use like this
const instance = getSomething();
let thing = nullsafe(instance, t => t.thing0.thing1.thingx);

옵션 체인 ?. 및 Nullish Coalescing??

당신은 지금 직접 사용할 수 있습니다 ?.인라인을 하여 존재 여부를 안전하게 테스트 . 모든 최신 브라우저가이를 지원합니다.

?? undefined 또는 null 인 경우 기본값을 설정하는 데 사용할 수 있습니다.

aThing = possiblyNull ?? aThing
aThing = a?.b?.c ?? possiblyNullFallback ?? aThing

속성이 존재 ?.하면 다음 확인으로 진행하거나 유효한 값을 반환합니다. 모든 고장은 즉시 단락되어 복귀 undefined합니다.

const example = {a: ["first", {b:3}, false]}

example?.a  // ["first", {b:3}, false]
example?.b  // undefined

example?.a?.[0]     // "first"
example?.a?.[1]?.a  // undefined
example?.a?.[1]?.b  // 3

domElement?.parentElement?.children?.[3]?.nextElementSibling

null?.()                // undefined
validFunction?.()       // result
(() => {return 1})?.()  // 1

기본 정의 된 값을 보장하기 위해을 사용할 수 있습니다 ??. 첫 번째 진실한 값이 필요한 경우을 사용할 수 있습니다 ||.

example?.c ?? "c"  // "c"
example?.c || "c"  // "c"

example?.a?.[2] ?? 2  // false
example?.a?.[2] || 2  // 2

사례를 확인하지 않으면 왼쪽 속성이 존재해야합니다. 그렇지 않으면 예외가 발생합니다.

example?.First         // undefined
example?.First.Second  // Uncaught TypeError: Cannot read property 'Second' of undefined

?.브라우저 지원 -78 %, 2020 년 7 월

??브라우저 지원 -78 %

모질라 문서

-

논리적 인 무효 할당, 2020+ 솔루션

신규 사업자는 현재 브라우저에 추가되고 ??=, ||=하고 &&=. 그들은 당신이 찾고있는 것을하지 않지만 코드의 목적에 따라 동일한 결과를 초래할 수 있습니다.

참고 : 공용 브라우저 버전에서는 아직 일반적이지 않지만 Babel은 잘 변환됩니다. 가용성이 변경되면 업데이트됩니다.

??=왼쪽이 정의되지 않았는지 또는 null인지 확인하고 이미 정의 된 경우 단락합니다. 그렇지 않으면 왼쪽에 오른쪽 값이 할당됩니다. ||=그리고 &&=온 유사하지만 기반 ||및 &&운영.

기본 예

let a          // undefined
let b = null
let c = false

a ??= true  // true
b ??= true  // true
c ??= true  // false

객체 / 배열 예

let x = ["foo"]
let y = { foo: "fizz" }

x[0] ??= "bar"  // "foo"
x[1] ??= "bar"  // "bar"

y.foo ??= "buzz"  // "fizz"
y.bar ??= "buzz"  // "buzz"

x  // Array [ "foo", "bar" ]
y  // Object { foo: "fizz", bar: "buzz" }

브라우저 지원 2020 년 7 월-.03 %

모질라 문서

안전한 deep get 메소드는 underscore.js에 자연스럽게 맞는 것처럼 보이지만 문제는 문자열 프로그래밍을 피하는 것입니다. 문자열 프로그래밍을 피하기 위해 @Felipe의 답변을 수정하십시오 (또는 적어도 사례를 호출자에게 푸시합니다).

function safeGet(obj, props) {
   return (props.length==1) ? obj[keys[0]] :safeGet(obj[props[0]], props.slice(1))
}

예:

var test = { 
  a: { 
    b: 'b property value',
    c: { }
  } 
}
safeGet(test, ['a', 'b']) 
safeGet(test, "a.b".split('.'))  

나는 이것이 JavaScript 질문이라는 것을 알고 있지만 Ruby는 요청 된 모든 방식으로 이것을 처리한다고 생각하므로 관련 참조 지점이라고 생각합니다.

.&, try및 &&에는 강점과 잠재적 인 함정이 있습니다. 이러한 옵션에 대한 자세한 설명은 다음과 같습니다. http://mitrev.net/ruby/2015/11/13/the-operator-in-ruby/

TLDR; Rubyists의 결론은 dig눈에 더 쉽고 값 이나 가치null 가 부여 될 것이라는 더 강한 보증입니다 .

TypeScript의 간단한 구현은 다음과 같습니다.

export function dig(target: any, ...keys: Array<string>): any {
  let digged = target
  for (const key of keys) {
    if (typeof digged === 'undefined') {
      return undefined // can also return null or a default value
    }
    if (typeof key === 'function') {
      digged = key(digged)
    } else {
      digged = digged[key]
    }
  }
  return digged
}

이것은 모든 깊이의 중첩 및 핸들 기능에 사용할 수 있습니다.

a = dig(b, 'c', 'd', 'e');
foo = () => ({});
bar = dig(a, foo, 'b', 'c')

이 try접근법은 이전 답변에서 볼 수 있듯이 JS에서도 읽는 것이 좋습니다. 또한이 구현의 한 가지 단점 인 루핑이 필요하지 않습니다.

이 질문은 2018 년에 약간의 새로 고침이 필요하다고 생각했습니다.이 라이브러리는 라이브러리를 사용하지 않고도 훌륭하게 수행 Object.defineProperty()할 수 있으며 다음과 같이 사용할 수 있습니다.

myVariable.safeGet('propA.propB.propC');

나는 MDN에 문서화 된 것처럼 의 방법에 사용할 수 있는 writeable및 enumerable정의 때문에이 안전하고 js-ethical이라고 생각합니다.definePropertyObject

아래 함수 정의 :

Object.defineProperty(Object.prototype, 'safeGet', { 
    enumerable: false,
    writable: false,
    value: function(p) {
        return p.split('.').reduce((acc, k) => {
            if (acc && k in acc) return acc[k];
            return undefined;
        }, this);
    }
});

콘솔 출력으로 jsBin 을 결합하여 이것을 보여줍니다. jsBin 버전에서는 빈 값에 대한 사용자 정의 예외도 추가했습니다. 이것은 선택 사항이므로 위의 최소 정의에서 제외했습니다.

개선을 환영합니다