Polyfill (폴리필)
폴리필은 지원되지 않는 최신 기능을 낡은 환경에서도 동작하도록 흉내 내는 코드다.
쉽게 말해, 새로운 기능을 낡은 브라우저에서도 돌아가게 만드는 보충 코드다.
만약 Array.prototype.includes()가 없는 옛날 브라우저(IE 등)에서 코드를 실행한다고 하면, 아래와 같이 직접 흉내내는 코드(폴리필)을 추가할 수 있다.
js
if (!Array.prototype.includes) {
Array.prototype.includes = function (element) {
return this.indexOf(element) !== -1;
};
}- 이렇게 하면,
include()가 없는 환경에서도 동일하게 동작한다. - 하지만
Symbol과BigInt처럼 JS 엔진 내부 동작에 의존하는 타입은 흉내낼 수 없다.
💡 Airbnb 가이드가 이 점을 강조한 이유
Symbol/BigInt는 자바스크립트의 언어 레벨 기능으로, 단순히 코드로 재현하거나 대체할 수 없는 타입이다.- 따라서 오래된 브라우저처럼 이러한 기능을 지원하지 않는 환경에서는
Symbol과BigInt사용을 피해야 한다. 즉, 진짜Symbol/BigInt처럼 완벽히 대체할 수 있는 폴리필이 불가능하다.
💡 언어 레벨 기능이란?
Symbol과 BigInt는 단순한 새로운 함수나 객체가 아니라, 자바스크립트 엔진이 직접 처리하는 언어 차원의 타입이다.
일반적인 기능(Array.prototype.includes, Promise, Object.assign 등)은 자바스크립트 표준 라이브러리 함수로 정의되어 있어, JS 코드로 흉내낼 수 있다. (폴리필 가능)
하지만 Symbol과 BigInt는 자바스크립트 언어 자체의 새로운 자료형이기 때문에 JS 코드로는 구현이 불가능하다. (폴리필 불가능)
| 구분 | 폴리필 가능 여부 | 이유 |
|---|---|---|
Array.prototype.includes | 가능 | 단순한 메서드로 JS 코드로 구현 가능 |
Promise | 가능 | 클래스와 콜백 구조로 흉내 가능 가능 |
Symbol | 불가능 | 엔진 내부에서 고유한 식별자 ID 생성 — JS 코드로는 동일한 내부 동작 불가능 |
BigInt | 불가능 | 64비트 정수보다 큰 숫자 계산을 엔진 수준에서 처리함 — JS의 일반 Number로는 불가능 |
💡 정리
| 구분 | 설명 |
|---|---|
| 폴리필 (Polyfill) | 특정 기능이 없는 환경에서도 돌아가게 하는 대체 코드 |
| 왜 Symbol/BigInt는 폴리필 안돼? | 언어 엔진 레벨의 기능이라 JS 코드로 완전하게 재현 불가능 |
| Airbnb 가이드의 의미 | 오래된 브라우저(예: IE) 지원이 필요하면 Symbol, BigInt는 사용하지 말 것 |