as const

as const

문자열 또는 숫자의 경우 const를 사용해 변수를 정의하면 동일한 효과를 얻을 수 있기 때문에 덜 유용하다.

객체의 경우, as const는 모든 속성을 readonly로 변경하고, 값의 범위를 좁힌다.

배열은 readonly값의 튜플(순서가 지정된 값의 배열)로 변경한다.

의도는 첫 번째는 boolean 값, 두 번째는 값을 토글하는 함수를 갖는 튜플이다. 하지만 타입스크립트는 값과 토글 함수가 배열 내 어느 위치에나 있을 수 있으며, 그 배열은 임의의 길이가 될 수 있다고 가정했다.

그래서 훅을 사용하면 예상대로 동작하지 않는다.

이 때 as const를 사용하면 이런 문제를 해결할 수 있다.

const vs as const

변수를 const로 선언하는 것과 변수 끝에 as const를 추가하는 것은 다르다.

const 변수를 선언하면 해당 변수가 참조하는 대상이 변경되지 않을 것임을 타입스크립트에게 알릴 수 있다. 자바스크립트에서 문자열과 숫자는 불변이므로, const와 as const 중 어느 쪽으로 변수를 선언하든 타입스크립트에게는 두 기술 간에 차이는 없다. 차이점은 const는 자바스크립트 기능이고, as const는 타입스크립트 기능이라는 사실에 있다.

객체와 배열의 경우, 참조와 값에 차이점이 있다.

객체/배열을 const를 사용해 선언하는 것은 해당 변수가 다른 객체/배열을 참조하지 않을 것임을 타입스크립트와 자바스크립트에 알리지만, 값이 변경되지 않을 것임을 의미하지는 않는다.

as const는 변수에 더 좁은 타입을 부여하는 훌륭한 타입스크립트 기능이다. 항상 필요한 것은 아니지만, 튜플을 생성하고, 함수에서 더 좁은 타입의 값을 반환할 때 쓰면 좋은 기능이다.