programing

vuex에서 이상한 게터.누가 나에게 이 행동을 설명해 줄 수 있습니까?

skycolor 2023. 6. 16. 21:35
반응형

vuex에서 이상한 게터.누가 나에게 이 행동을 설명해 줄 수 있습니까?

네, 저는 js에서 많은 것들이 불가능하거나 이상하게 보인다는 것을 압니다.하지만 왜 수백만 개의 ppl을 사용하는 제품에 그것들을 구현합니까?

여기에 우리는 입문자 기능이 있습니다.

export const isAuthenticated = state => (
      state.auth !== null &&
      state.auth.access_token !== null &&
      new Date(state.auth.access_token_expiration) > new Date() 
      );

그래서 만약 이것이 함수라면 우리는 괄호와 1개의 인수로 그것을 불러야 합니다.getters.isAuthenticated(state)그러나 이것은 입문자들의 경우가 아닙니다.getters.isAuthenticated괄호도, 인수도 없습니다. 속성과 동일하지만 함수 호출입니다.그리고 우리가 이렇게 하면,getters.isAuthenticated(arg)그러면 우리의 기능은 다음과 같이 보일 것입니다.(state)=>(arg)=>{}.왜 그런 것일까요?

사실 여기 적혀있는 것처럼 getter를 함수로 사용할 수 있습니다.이것이 당신이 보는 이유입니다.(state)=>(arg)=>{}게터는 비슷합니다.computed일반 자바스크립트 게터인 속성.간단한 예에서 콘솔을 확인하십시오.인스턴스로 설정된 다음과 같은 소품을 볼 수 있습니다.

이것들은 기본적인 JS getter 기능들이고, 이상한 것은 없습니다.자세한 내용은 이 MDN 참조를 참조하십시오.이것이 도움이 되길 바라며, Vue를 재미있게 배우세요.

이는 고차 함수의 변형으로, 함수(상태 매개변수 포함)가 호출될 때 함수를 호출하고 자체 컨텍스트에서 상태 매개변수를 제공하는 다른 함수(파라미터 없음)로 대체됩니다.

여기 소스 코드에서 303행과 425행의 래퍼 코드를 단순화했습니다.

module.forEachGetter((rawGetter, key) => {
  store._wrappedGetters[key] = function wrappedGetter (store) {
    return rawGetter(
      local.state, // local state
      local.getters, // local getters
      store.state, // root state
      store.getters // root getters
    )
  }
})

233행에서 당신은 javascript getters로 store.geters 속성에 추가되고 store 매개 변수와 함께 제공되는 lappedGeters를 볼 수 있습니다.게터가 가치 캐싱의 이점을 활용하기 위해 계산된 속성으로 추가되기 때문에 이 또한 단순화됩니다.

forEachValue(wrappedGetters, (fn, key) => {
  Object.defineProperty(store.getters, key, {
    get: () => fn(store),
    enumerable: true // for local getters
  })
})

언급URL : https://stackoverflow.com/questions/53610580/weird-getters-from-vuex-can-someone-explain-to-me-this-behavior

반응형