funtion, class 객체 생성의 차이점은?

funtion, class  객체 생성의 차이점은?

 

new로 만든 객체는 JavaScript에서 객체를 생성하는 일반적인 방법 중 하나입니다. 새로운 객체를 생성하여 해당 객체의 속성과 메소드를 선언하고, 필요에 따라 수정할 수 있습니다.
반면에 class는 ES6에서 도입된 새로운 객체 지향 프로그래밍 기능입니다. 클래스는 생성자 함수와 프로토타입 객체를 보다 구조화된 방식으로 정의하고, 추가적으로 상속과 같은 기능을 제공합니다. 클래스는 일반적으로 프로토타입을 사용해 메소드와 속성을 정의하는 데 비해 더 선언적인 방식으로 사용할 수 있습니다.
따라서, new로 만든 객체는 단순히 새로운 객체를 만들고 속성과 메소드를 추가하는 반면, 클래스는 생성자 함수 및 프로토타입 객체와 관련된 구조화된 방식으로 사용됩니다.

 

예시 코드를 통해 class와 new의 차이점을 살펴보겠습니다.

### new로 객체 생성하기

```
function Person(name, age) {
  this.name = name;
  this.age = age;
}

const person1 = new Person('Alice', 24);
console.log(person1.name); // 'Alice'
console.log(person1.age); // 24
```

위 예시 코드에서는 일반적인 생성자 함수를 사용해 객체를 생성하는 방법을 보여줍니다. `Person` 생성자 함수를 사용하여 `person1` 객체를 생성하고, `name`, `age` 속성을 추가합니다. `person1` 객체는 생성자 함수 `Person`을 사용하여 생성된 새로운 인스턴스입니다.

### class로 객체 생성하기

```
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

const person2 = new Person('Bob', 32);
console.log(person2.name); // 'Bob'
console.log(person2.age); // 32
```

위 예시 코드에서는 `Person` 클래스를 사용해서 객체를 생성하는 방법을 보여줍니다. `Person` 클래스는 생성자 함수와 유사한 `constructor` 메소드를 사용하여 객체를 생성합니다. `person2` 객체는 `Person` 클래스를 사용하여 생성된 새로운 인스턴스입니다.

두 코드에서 가장 큰 차이점은 생성자 함수 대신 `class` 키워드를 사용하여 클래스를 정의한다는 점입니다. `class` 키워드를 사용하면 코드를 더 구조적으로 작성할 수 있습니다.

또한, 클래스를 사용하면 인스턴스 생성에 필요한 코드의 양이 줄어듭니다. 클래스를 사용하면 생성자 함수와 프로토타입 객체를 모두 정의할 필요가 없으므로, 코드 작성의 간소화라는 이점이 있습니다.

따라서, class와 new 키워드는 모두 객체 생성에 사용됩니다. new 키워드의 경우 기존의 생성자 함수를 사용하여 객체를 생성하고, Class는 이전의 프로토타입과 생성자 함수를 보다 구조적으로 정의하여 객체를 생성합니다.

 

문법정리,

class  user Constructors (A,B){ this.A = A; this.B = B; }  function Person(A, B) {  this.A = A;  this.B = B; }

---

class super. funtion 예시코드,

class A { 
    constructor() {
        this.foo = this.foo.bind(this)
    }

    foo() {
        console.log('foo from A')
    }
}

class B extends A {
    foo() {
        super.foo();
        console.log('foo from B')
    }
}
new B().foo()

console.log

---

VM78:7 foo from A
VM78:14 foo from B

 

 

 

 

 

태그

#class #classnerflix #classnetflix #netflixclass #classnetflixseries #classnetflixtrailer #classtrailernetflix #netflixclasstrailer #classy

#function #functions #compositefunctions #whatisafunction #functionnotation #domainofafunction #inversefunctions ##function #mathfunction