무엇이 수업입니까?

클래스는 대상을 대상으로 하는 프로그래밍 개념으로 많은 대상을 대상으로 하는 프로그래밍 언어에 포함되어 있다.구체적으로 말하면 클래스는 대상을 만들고 데이터를 초기화하며 함수를 정의하는 청사진이다.그것은 같은 종류의 대상에 대한 정보를 다시 사용할 수 있는 형식으로 구성하는 방법이다.클래스를 사용하면 프로그래머는 상기 클래스의 특정한 실례를 만들고 클래스에 특정한 데이터와 함수에 접근할 수 있습니다.
예를 들어 고양이, 개, 토끼의 대상을 만들고 싶다고 가정하십시오.새 대상마다 거의 같은 코드를 복사하거나 animal이라는 템플릿을 만들 수 있습니다.그리고 특수한 정보를 동물 템플릿에 전달함으로써 고양이, 개, 토끼 대상을 간단하게 만들 수 있습니다.클래스는 코드를 다시 입력하지 않고 템플릿을 사용하여 서로 다르지만 비슷한 대상을 만드는 개념이다.

JavaScript의 클래스

JavaScript는 2015년 ES6에 대한 업데이트로 클래스 기능을 획득했습니다.비록 그것은 다른 대상 언어처럼 풍부하고 상세하지는 않지만, 여전히 존재한다.
JavaScript에서는 class 키워드를 사용하고, 다음에 대문자 클래스 이름과 괄호 쌍을 사용하여 새 클래스를 만듭니다. 그림과 같습니다.

class Animal {
}

그러나 이 종류를 실제로 사용하기 위해서는 실례를 만들어야 한다.이렇게 하려면 변수를 만들고 다음과 같이 new 키워드를 사용하여 클래스에 초기화합니다.

class Animal {
}

let dog = new Animal();

현재 우리는 dog가 있는데 이것은 우리 동물류의 한 예이다.하지만...우리는 도대체 그것으로 무엇을 할 수 있습니까?모든 동물은 어떤 규격을 가지고 있습니까?명칭, 종과 나이.이러한 정보를 Animal 클래스에 추가하려면 다음과 같이 구조 함수를 만들어야 합니다.

class Animal {
  constructor(name, species, age) {
  this.name = name;
  this.species = species;
  this.age == age;
  }
}

let dog = new Animal("Spot", "Dog", 4);

이 구조 함수는 초기화 클래스의 새로운 인스턴스(Dog 객체를 작성할 때)를 수신하고 동물의 클래스별 변수나 속성을 설정합니다.우리 개의 데이터에 접근하고 기록하기 위해 점 기호를 사용합니다.

class Animal {
  constructor(name, species, age) {
  this.name = name;
  this.species = species;
  this.age == age;
  }
}

let dog = new Animal("Spot", "Dog", 4);

console.log(dog.name) //returns "Spot"
console.log(dog.species) //returns "Dog"
console.log(dog.age) //returns 4

현재, 클래스에 특정된 함수를 추가합니다. 이 함수는 클래스 데이터를 이용하여 특수한 메시지를 만듭니다.

NOTE: Class-specific functions are called methods and don't require the function keyword.

class Animal {
  constructor(name, species, age) {
  this.name = name;
  this.species = species;
  this.age == age;
  }

  cutePet() {
  return `Aww, your ${this.species} is so cute!`;
  }

}

let dog = new Animal("Spot", "Dog", 4);

console.log(dog.cutePet()); //returns "Aww, your Dog is so cute!"

초기화 후, 클래스의 실례는 점 표현법으로 그 방법에 접근할 수 있으며, 클래스 속성에 접근하는 방식과 같다.그러나 이제 우리는 변수와 방법을 포함하는 기본 클래스가 생겨서 클래스의 진정한 유용성을 시험할 수 있다.

class Animal {...}

let dog = new Animal("Spot", "Dog", 4);
let bird = new Animal("Feathers", "Bird", 3);
let cat = new Animal("Mochi", "Cat", 2);

console.log(dog.cutePet()); //returns "Aww, your Dog is so cute!"
console.log(bird.cutePet()); //returns "Aww, your Bird is so cute!"
console.log(cat.cutePet()); //What does this return?

우리는 bird와 cat라는 동물류의 새로운 실례를 초기화했다. 그림과 같다.dog.cutePet()와bird.cutePet()가 되돌아오는 것이 무엇인지 알고 있습니다. 호출cat.cutePet()이 되돌아오는 것은 무엇입니까?
너 맞혔어!그것은 되돌아갈 것이다 "Aww, your Cat is so cute!".이것은 Animal 클래스에서 정의한 방법과 같은 방법으로 접근합니다. 단지 초기화 cat 실례를 사용할 때 제공된 데이터입니다.

공공과 개인

대다수의 종류는 모두 공공 변수와 사유 변수의 개념을 가지고 있다.공공 변수는 프로그래머가 직접 접근할 수 있는 변수이고, 개인 변수는 클래스의 역할 영역 밖에서 접근할 수 없다는 것을 의미한다.이를 이용하여 프로그래머는 대상을 대상으로 프로그래밍하는 주요 실천 중 하나인 Encapsulation를 더욱 잘 실현할 수 있다.
많은 개체 대상 언어에 public와 private 키워드가 있지만 최신 버전의 자바스크립트는 이 부분에서 약간 다르다.기본적으로 JavaScript 클래스 속성은 공용으로 선언되므로 프로그램원이 개인 속성을 선언할 때만 지정할 수 있습니다.우리는 모든 속성 성명 앞에 하나의 # 를 추가해서 개인 변수를 성명할 수 있다.클래스 밖의 개인 클래스 속성에 액세스하려고 하면 JavaScript에서 구문 오류[#variableName] out of scope를 반환합니다.자세한 내용은 private class properties의 MDN 문서를 참조하십시오.

NOTE: Until the introduction of private class features, JavaScript programmers simulated private class variables by adding an underscore to the front of a property name. Adding an underscore did not actually prevent programmers from accessing and changing these variables. It just lets programmers know to treat them as private.

액세스 방법

JavaScript는 액세스 클래스의 속성에 액세스할 때 더 나은 데이터 품질, 더 간단한 구문, 더 높은 보안을 구현할 수 있도록 액세스 기법이라는 특수 내장 방법을 제공합니다.두 가지 흔히 볼 수 있는 접근기는 Getter와setter이다.

흡기제법

흔히 볼 수 있는 액세스 방법은 Getter이다.Getter 방법은 값을 되돌려 주지만, 접근 속성처럼 접근할 수 있습니다.Getter를 얻기 위해서, 우리는 우리의 방법을 확보해야 한다.

에 되돌아오는 문장이 하나 있다

사용get 키워드

매개 변수 없음

이러한 조건에 따라 다음과 같이 Getter 방법을 설명합니다.

class Animal {
  constructor(name, species, age) {...}

  get cutePet() {
  return `Aww, your ${this.species} is so cute!`;
  }

}

비슷해 보이지는 않지만 get 키워드를 추가하면 다음과 같은 속성으로 접근할 수 있습니다.

class Animal {...}

let dog = new Animal("Spot", "Dog", 4);

/**
console.log(dog.cutePet()) 
We no longer need these parentheses as it isn't 
a function call anymore.
**/
console.log(dog.cutePet); //returns "Aww, your Dog is so cute!"

세이트법

또 다른 일반적인 JavaScript 액세스 방법은 setter 방법입니다.setter 방법은 Getter와 같은 논리를 따른다.우리는 주어진 방법을 함수로 호출할 필요가 없고, 그것을 주어진 클래스의 속성으로 접근할 수 있다.setter가 되기 위해서는 다음과 같은 방법을 확보해야 합니다.

사용set 키워드

매개 변수 하나

동물류에 새로운 setter 방법을 만들어서 우리 동물의 종을 바꾸자.

class Animal {
  constructor(name, species, age) {...}

  get cutePet() {...}

  set animalName(name) {
    this.name = name;
  }
}

이제 우리는 이렇게 우리의 개 이름을 바꿀 수 있다.

class Animal {...}

let dog = new Animal("Spot", "Dog", 4);

console.log(dog.name); //returns "Spot"

dog.animalName = "Fuzzy";

console.log(dog.name); //returns "Fuzzy"

보시다시피, animalName setter에 접근하는 속성처럼 접근할 수 있으며, '같은 것으로 설정하기' 를 값으로 설정할 수 있습니다.이 값은 자동으로 매개 변수로 setter 방법에 전달됩니다.set 키워드가 없으면 다음과 같이 함수를 호출해야 합니다.

class Animal {...}

let dog = new Animal("Spot", "Dog", 4);

console.log(dog.name); //returns "Spot"

dog.animalName("Fuzzy");

console.log(dog.name); //returns "Fuzzy"

최종 성명

JavaScript 클래스는 더 나은 모듈식, 재사용 가능, 더 깨끗한 코드를 만드는 데 도움이 되는 강력한 도구입니다.너는 이제 그것들을 사용할 능력이 생겼어!클래스와 해당 클래스가 JavaScript에서 작동하는 방식을 더 자세히 연구하려면 MDN Documentation on Classes를 참조하십시오.