ECMA 2022에서 눈여겨볼 것

1. Array.prototype.at()

• 배열에서 이용할 수 있는 메서드
• at(숫자)를 통해 숫자에 위치하는 값들을 가져올 수 있음
  • 인자의 숫자가 양수일 때, 예를 들어 arr.at(3)은 기존의 arr[3]과 같음
  • 하지만 음수일 경우, 배열의 마지막 요소를 시작으로, -1, -2, -3, ... 을 통해 값을 찾을 수 있음

const arr = [1, 22, 333, 4444, 55555];

console.log(arr[2]);	// 333
console.log(arr.at(2));	// 333

console.log(arr.at(-1));	// 55555
console.log(arr.at(-3));	// 33

 

 

2. Object.hasOwn(객체, key)

• 객체에서 특정 key가 존재하는지 확인할 수 있는 메서드
• 기존의 hasOwnProperty를 대체하는 메서드

const obj = {
    name: "peter", 
};

console.log(Object.hasOwn(obj, "name")); // true
console.log(Object.hasOwn(obj, "age"));  // false

 

 

3. Error cause

• error를 throw할 때, cause라는 정보를 추가로 보낼 수 있음
• 이 cause의 값으로 문자열 뿐만이 아니라, 객체 등도 가능함

try {
    console.log("try!");
    throw new Error("Error!", {
        cause: "hahaha",
    });
} catch(error) {
    console.log(error.message, error.cause); // Error! hahaha
}

try {
    console.log("try!");
    throw new Error("Error!", {
        cause: {
            name: "peter", 
            age: 21,
        }
    });
} catch(error) {
   console.log(error.message, error.cause); // Error! {name: 'peter', age: 21}
}

 

 

4. Class Field Declarations

• 기존 클래스에서 constuctor를 통해 생성했던 인스턴스들을 바로 생성할 수 있음

class Counter {
    constructor() {
        this.counter = 5;
    }
}

class NewCounter {
    counter = 5;
}

const myCounter = new Counter();
const newMyCounter = new NewCounter();

console.log(newMyCounter.counter); // 5
console.log(myCounter.counter); // 5

 

 

5. Private

• 인스턴스 속성이나 메서드 이름 앞에 '#'를 붙이면 private으로 만들 수 있음

class Counter {
    counter = 0;
    plus() {
        this.counter++;
    }
};

const myCounter = new Counter();

myCounter.plus();
console.log(myCounter.counter); // 1

// Private 적용 예시

class NewCounter {
    #counter = 0;
    #reset() {
        this.#counter = 0;
    }
    get count() {
        return this.#counter;
    }
    plus() {
        this.#counter++;
    }
}

const counter = new NewCounter();

• get count() { ... } 처럼 메서드 이름 앞에 get을 붙일 경우, 이 메서드는 값을 반환한다는 것을 암시하기에 counter.count()가 아닌, counter.count 로 이용할 수 있음

 

 

6. Static Field, Static Methods

• 자바스크립트의 클래스에서 static 키워드를 사용하여 정의하는 필드와 메서드는 클래스의 인스턴스에 속하지 않고, 클래스 자체에 속하는 정적(static) 필드와 메서드를 말함.
• 즉, 클래스의 인스턴스를 생성하지 않고도 클래스 이름을 통해 직접 접근할 수 있음
• Static Field
  • 클래스 자체에 속하는 변수로, 인스턴스마다 개별적으로 존재하지 않음
  • static 키워드를 통해 클래스 내부에서 정의됨
  • 주로 클래스 수준의 상수나 모든 인스턴스에서 공유해야 하는 데이터를 저장하는 데 사용

class MyClass {
    static staticField = 'Shared value';
}

console.log(MyClass.staticField); // 'Shared value'

• Static Methods
  • 클래스에 속하는 메서드로, 인스턴스가 아닌 클래스 자체에서 호출할 수 있음
  • 주로 특정 인스턴스가 아니라 클래스 전체와 관련된 기능을 제공하는 데 사용
  • 클래스의 다른 정적 메서드 또는 필드에 this를 통해 접근할 수 있음

class MathUtils {
    static sum(a, b) {
        return a + b;
    }

    static square(n) {
        return n * n;
    }
}

console.log(MathUtils.sum(2, 3)); // 5
console.log(MathUtils.square(4)); // 16