변수 이름으로 데이터 사용 중지

"There are only two hard things in Computer Science: cache invalidation and naming things."

- Phil Karlton

캐시가 효력을 잃는 것은 물론이고, 내가 정확한 이름을 찾지 못할 때마다, 이 악명 높은 말이 내 머릿속에서 울려 퍼진다.불을 끄고 테스트를 하거나 면접을 보든 동료를 협조하든 명확한 명칭은 중요한 상하문을 제공할 수 있다. users가 무슨 뜻인지 물어볼 필요는 없지만 data가 무슨 뜻인지 물어봐야 한다.비록 나는 보통 가장 좋은 이름을 찾지 못하지만, 나는 몇 가지 기본 규칙에 따라 독자를 위해 코드를 최적화하려고 시도할 것이다.

규칙은 다음과 같습니다.

의미 있는 접두사 사용
이 접두사들은 통용되지 않지만 팀에서 공유 언어를 구축하기에 매우 적합하다.전체 코드 라이브러리에서 그것들을 지속적으로 사용하면 읽기와 이해를 더욱 쉽게 할 수 있다.

get,find,fetch, 값을 되돌려 주는 함수나 매개 변수나 자신을 바꾸지 않고 값으로 해석하는 함수Promise.

set, update 변이 매개 변수의 함수나 구성원 함수에 사용되는 호출자.이 함수들은 업데이트된 값을 되돌려주거나 업데이트된 값으로 해석할 수 있다Promise.

on, handle는 이벤트 처리 프로그램 함수에 사용됩니다.우리 팀의 관례는onEvent 도구를 통해 구성 요소에 전달하고handleEvent 구성 요소에 성명하는 것이다.

is,should,can는 브리 변수와 브리 반환값을 가진 함수에 사용된다.

팀의 표준이 되는 모든 관례는 가독성을 높이는 데 도움이 된다.프로젝트README나 비키에 이 내용을 기록해야 한다.이러한 작업을 강제로 수행하기 위해 사용자 정의 트렁크를 작성하는 것이 더 효과적입니다.

의미를 더한 단어를 사용하다
예를 들어 개발자는 기본적으로 변수data를 명명하지만 그 중 몇 가지 변수definitions를 살펴보자.

• "factual information (such as measurements or statistics) used as a basis for reasoning, discussion, or calculation"
• "information in digital form that can be transmitted or processed"

이러한 정의는 우리가 처리하는 모든 변수를 가리킬 수 있기 때문에 독자에게 어떠한 정보도 제공하지 않는다.이 규칙을 따르지 않는 예를 살펴보겠습니다.

function total(data) {
  let total = 0;
  for (let i = 0; i < data.length; i++) {
    total += data[i].value;
  }

  return total;
}

우리는 이 함수가 일부 물건의 총수를 계산한 것을 알고 있지만, 우리는 무엇인지 확실하지 않다.

예외적 상황
때때로 변수는 실제적으로 네트워크 요청-응답체와 같은 모든 내용을 포함할 수 있다.axios와 같은 라이브러리 사용data은 본고에서 합리적인 명칭이다.이런 상황에서도 예비 방안body은 더 많은 의미를 전달하고 원생 웹 APIfetch를 그Response에서 사용한다.

완전한 단어 사용
다른 사람들과 마찬가지로 내 머릿속System 1 부분은 항상 나에게 임무를 빨리 완수하기 위해 지름길을 가라고 알려준다.변수 이름에 대해 말하자면, 단축키는 일반적으로 줄임말이나 단일 문자 변수 이름을 가리킨다.
앞에서 설명한 대로 규칙을 따르지 않는 함수를 살펴보겠습니다.

function totBal(accts) {
  let tot = 0;
  for (let i = 0; i < accts.length; i++) {
    tot += accts[i].bal;
  }

  return tot;
}

우리는 약간의 심리 연습을 해서 accts가 accounts와 tot가 total라는 것을 추측할 수 있지만 우리는 코드를 한눈에 처리할 수 없다.

예외적 상황
일반적인 업계 약어는 긴 형식(예: URL, API, CSS)보다 우선합니다.

텁수룩하다Container와 Wrapper는 그에 포함된 내용에만 의미가 있다.문제는 기본 요소가 아닌 모든 구성 요소가 다른 구성 요소를 포함한다는 것이다.구성 요소 MyComponentContainerContainer 를 명명할 때, 당신도 난처한 상황에 빠질 수 있습니다.이 역시 Wrapper에 적용된다.

예외적 상황
어떤 언어 환경에서 이런 융모어는 중요한 의의를 가지고 있을 수 있다.React 클래스 어셈블리의 일반적인 모드는 presentation/container component pattern입니다.Container 이 경우 구성 요소 관리 상태를 나타내는 구성 요소를 나타낼 수 있습니다. 이 목적을 위해 항상 사용해야 하며, 그렇지 않으면 의미를 잃을 수 있습니다.

스펠링이 중요해요.
맞춤법 오류가 발생하여 검색 코드를 더욱 어렵게 할 수 있습니다.맞춤법 오류는 무시하기 쉽지만, 코드 라이브러리의 모든 내용을 정확하게 맞춤법을 쓰면 큰 차이가 발생할 수 있으며, 특히 전역적으로 찾거나 바꾸려고 시도할 때 큰 차이가 발생할 수 있다.

그것을 한데 놓다
모든 규칙을 동시에 적용하면 다음과 같은 함수를 얻을 수 있습니다.

function getAccountsTotalBalance(accounts) {
  let totalBalance = 0;
  for (let accountIndex = 0; accountIndex < accounts.length; accountIndex++) {
    totalBalance += accounts[accountIndex].balance;
  }

  return totalBalance;
}

accountIndex는 i에 대해 논쟁이 있을 수 있지만 함수의 나머지 부분은 더 잘 알아야 한다.getAccountsTotalBalance는 기능의 의도를 완전히 전달했고 접두사get는 어떠한 돌연변이도 일으키지 않는다는 것을 나타냈다.코드 작성자가 더 많은 정력을 들여 독자의 이익을 바꿀 가치가 있다.6개월 후, 그들이 코드를 유지할 때, 당신의 미래의 자신은 이러한 추가 업무에 감사할 것이다.
행장이 걱정된다면, 코드를 자동으로 포맷하기 위해 Prettier 같은 도구를 사용하는 것을 고려할 수 있습니다.

결론
이러한 규칙의 목표는 미래 독자들이 작성할 코드에 가능한 한 많은 의미를 가져다 주는 것이다.환경에 맞는 규칙을 찾아라. 만약 규칙이 이익보다 해롭다면, 그것을 바꾸거나 포기해라.팀 규칙을 편찬하는 것은 팀원들에게 타격을 주지 않고 그 주제에 대한 생각을 소통하는 데 도움이 될 것이다.
변수, 함수, 클래스 등을 명명할 때 따르는 다른 규칙을 공유하십시오. 만약 이 규칙에 동의하지 않는다면, 이 규칙을 어떻게 바꿀지 알려주십시오.