Javascript Polyfill

Polyfill(폴리필)은 웹 개발에서 기능을 지원하지 않는 웹 브라우저 상의 기능을 구현하는 코드를 뜻합니다.

 

예를들면 자바스크립트의 최신 스펙에 나온 함수를 사용하여도 웹 브라우저에서는 돌아가지 않을 수 있습니다.

여러 자바스크립트 엔진에서는 자바스크립트의 최신 스펙중 우선순위에 따라 구현할 것이므로 아직 자바스크립트 엔진에 구현이 되어 있지 않을수도 있는 것이죠.

 

폴리필은 다시 정의하면 기존 함수의 동작 방식을 수정하거나, 새롭게 구현한 함수의 스크립트라 할수 있습니다.

 

현재는 바벨과 같은 트랜스 파일러를 이용합니다.

최신 스펙으로 작성된 스크립트 코드를 명시한 버전에 따라 재작성 해줍니다. 

낮은 버전의 자바스크립트 엔진에서도 프로그램이 돌아갈 수 있게 해주어 서비스가 문제없이 제공될 수 있게 해줍니다.

바벨에는 core-js 라이브러리가 탑재되어 es6 이후의 문법들에 폴리필을 이용할 수 있습니다.

 

이때 폴리필이 이용됩니다.

새로운 문법을 낮은 버전에서도 돌아갈 수 있게 하기 위하여 폴리필이 이용되어 집니다.

 

const arr = [1,2,3,4]
console.log(arr.map((el) => el * 2))


// 예시
Array.prototype.customMap = function (callback) {
  const result = []

  for(let el of this) {
    result.push(callback(el))
  }

  return result
}


console.log(arr.customMap((el) => el * 3))

 

 

출처: https://ko.wikipedia.org/wiki 

위키백과, 우리 모두의 백과사전

https://polyfill.io/v3/

Polyfill.io

https://ko.javascript.info/polyfills

폴리필