왜 getter와setter 함수를 사용합니까

Getter와 Setter 함수를 모두 Acceler 함수라고 합니다.앞의 두 문장에서 나는 Getter와 Setter 함수를 사용하고 싶어서 mix 를 어떻게 만드는지 토론했다.
그런데 왜 우리는 처음부터 수용자와 수용자를 사용해야 합니까?

나는 두 가지 이유가 있다.

문법적 원인

포장

문법적 원인

그룹의 길이를 가져오려면 array.length 를 써야 합니다.이 속성의 역할은 Getter 함수와 유사합니다.이것은 실시간으로 당신에게 값을 되돌려줍니다.
만약 length 이 간단한 속성이라면, 그룹에 몇 항목을 추가하든지 간에 length 을 보류할 것이다.length 수조의 길이에 따라 값이 바뀌었기 때문에 length 간단한 속성이 아니라는 것을 증명했다.
그러나, 나는 length 이 Getter 함수인지 아닌지 확실하지 않다.기록되어 있지 않지만, 나는 그렇다고 의심한다.
기왕 우리가 length (그 작용은 Getter 함수와 유사) 를 사용하여 값을 얻는데, 왜 우리는 다른 Getter 함수를 사용하여 값을 얻지 않습니까?우리는 이미 이런 문법에 익숙해졌다.
예를 들어, 회전 목마가 있고 현재 슬라이드를 원한다고 가정하십시오.다음과 같은 두 가지 옵션이 있습니다.

일반 함수 만들기

getter 함수 만들기

다음은 코드의 모양입니다.

const carousel = {
  // Option 1: Normal function
  getCurrentSlide () {/* ... */},

  // Option 2: Getter function
  get currentSlide () {/* ...*/}
}

우선, Getter 함수를 정의하는 데 별도의 작업이 없는 것을 볼 수 있습니다.그럼, 왜 하나를 만들지 않습니까?
그 다음에 Getter 함수를 사용하면 속성을 호출해서 사용할 수 있습니다.일반 함수를 사용하면 괄호를 작성해서 이 방법을 호출해야 합니다.

// Normal function
const currentSlide = carousel.getCurrentSlide()

// Getter function
const currentSlide = carousel.currentSlide

나는 Getter 함수 버전이 더욱 간결하고 이해하기 쉽다고 생각한다.이것은 나에게 더욱 의미가 있다.
다른 한편, 우리는 일반 함수 대신 Setter 함수를 사용할 수 있다.

// Normal function
carousel.setCurrentSlide(4)

// Setter function
carousel.currentSlide = 4 // Uses a Setter function

마찬가지로 Setter 함수 버전은 내가 보기에 더욱 깔끔하다.나는 이미 이런 문법에 익숙해졌다. 왜냐하면 나는 array.length 부치에 익숙하기 때문이다.
이제 관건은 Getter와 Setter 함수를 사용하여 코드의 의도를 전달하는 것이다.

어떤 물건을 얻은 사람

Setters가 설정한 내용

나머지 방법 완료

이 그룹의 의도가 완성되면, Getter와 Setter 함수로 작성된 코드는 더욱 쉽게 해석될 것이다.
여기에는 우리가 값을 얻고 값을 설정한 다음에 하나의 과정을 실행하는 예가 있다. 이 모든 것은 함수를 통해 이루어진다.

const value = object.getValue() // Gets value
object.setValue(5) // Sets value
object.method() // Runs a process

이것은 같은 버전의 Getter와 Setter 함수입니다.

const value = object.value // Getter
object.value = 5 // Setter 
object.method() // Runs a method

어떤 게 더 잘 알 것 같아요?나에게 Getter와 Setter 버전은.
Getter와setter를 사용할 때 이 코드가 값을 가져오는지, 값을 변경하는지, 프로세스를 실행하는지 쉽게 볼 수 있습니다.너는 심지어 네가 쓴 내용의 세부 사항에 관심을 가질 필요가 없다.
네, 이것은 사소한 일입니다.하지만 사소한 일은 힘들어진다.그것을 합치면 대량의 뇌력을 절약할 수 있다.

봉인하다

두 번째 이유는 보안 코드를 만드는 능력이다.
만약 네가 차 한 대를 가지고 있다면.자동차에 연료가 있다.자동차가 출하될 때 50리터의 연료가 있다.

function Car () {
  const fuel = 50
}

자동차는 연료가 얼마나 남았는지 알아야 한다.한 가지 방법은 전체 연료의 특성을 폭로하는 것이다.

function Car () {
  const fuel = 50
  return {
    fuel
  }
}

const car = Car() 
console.log(car.fuel) // 50

단, 이러한 방식으로 = 속성을 공개할 때, 우리는 사용자가 fuel 에 대해 무제한 변경을 할 수 있도록 합니다.
이 차의 연료 용량이 100이라고 가정해 보세요.그들은 어떤 수량도 늘리고 자동차를 손상시킬 수 있다.

car.fuel = 3000
console.log(car.fuel) // 3000

Getter 함수를 사용하는 경우 이 속성을 변경할 수 없습니다.

function Car () {
  const fuel = 50
  return {
    get fuel () { return fuel } 
  }
}

const car = Car() 
car.fuel = 3000
console.log(car.fuel) // 50

우리 한 걸음 더 나아가자.fuel 의 Setter 함수를 사용하면 가능한 제한에 대한 보호를 만들 수 있습니다.이곳에서 우리는 자동차의 연료가 영원히 100을 넘지 않을 것을 확보한다.

function Car () {
  let fuel = 50
  return {
    get fuel () { return fuel } 
    set fuel (value) {
      fuel = value
      if (value > 100) fuel = 100
    }
  }
}

const car = Car()
car.fuel = 3000
console.log(car.fuel) // 100

요컨대, 내가 Getter와 Setter 함수를 좋아하는 것은 두 가지 이유 때문이다.

문법적 원인.액세스 함수

를 사용하여 생성된 코드를 읽기 쉽고 빠름

포장.나는 접근기 함수를 사용하여 더욱 안전한 코드를 만들 수 있다.

그렇습니다!
읽어주셔서 감사합니다.본고는 최초로 my blog에 발표되었다.더 좋은 전단 개발자가 될 수 있도록 더 많은 글을 원한다면 등록하세요my newsletter.